Autor: Romina Vargas.
En un mundo lleno de productos que buscamos crear para ofrecer mejores soluciones a los usuarios, sin duda hoy en día se ha vuelto indispensable el preocuparnos por la experiencia que viven los usuarios, esa experiencia que diferencia unos de otros: la Experiencia de Usuario (UX), que busca cuidar lo que el usuario siente, percibe o interactúa con nuestro producto.
Parte fundamental de esta experiencia es saber para quiénes estamos creando, es decir, conocer a nuestros usuarios, (género, su edad, en dónde viven por mencionar algunos) esto nos llevará a saber las consideraciones que debemos tener a la hora de diseñar. Sin embargo, también es usual el tener ciertos sesgos con nuestros usuarios, y pensar que ellos no tienen problemas, por ejemplo: de visión, discapacidad en habilidades motrices o problemas cognitivos. Habiendo dicho esto, llegamos al punto importante que hace mención el título del artículo, la accesibilidad.
Y entonces ¿A qué nos referimos cuando hablamos de accesibilidad?
De forma simple es: Los usuarios deben tener la facilidad para acceder, comprender, navegar e interactuar con nuestro producto o servicio sin barreras, independientemente de sus capacidades. Las capacidades son el eje cuando hablamos de accesibilidad y cuando una persona no tiene alguna de ellas, ya sea temporal o permanente es lo que conocemos como discapacidad. Y están clasificados por:
Auditivas
Visuales (como daltonismo, visión reducida)
Motoras o de movilidad (impedimentos físicos)
Aprendizaje o cognitivas (dislexia o déficit de atención)
Si pensamos en nuestro día a día, podemos encontrar ejemplos de falta de accesibilidad al usar un servicio, ya sea porque hemos visto a un extraño, alguien que conocemos o incluso nosotros mismos nos hemos dado cuenta, e incluso hasta con cierto toque de comicidad con algún “meme”.
Anaqueles o mostradores altos no consideran a personas de estatura baja (que es una condición permanente) o en silla de ruedas (puede ser una condición temporal o permanente) para tener un fácil acceso.
En productos digitales, lo vemos cuando encontramos, por ejemplo, contenido que nos parece pequeño y nos es difícil leer, colores que nos lastiman la vista, botones o formularios que no podemos usar por su tamaño, por mencionar algunos.
¿Qué tan frecuente puede estar pasando esto?¿Nuestro producto es suficientemente accesible? ¿Cómo identifico si mi producto puede mejorar en este aspecto?
En las siguientes líneas explicaremos cómo hacerlo. Lo primero, considerar los siguientes puntos dentro de nuestro proceso:
Conocer nuestros sesgos e interesarnos por personas con capacidades distintas
Estudiar sobre accesibilidad
Incluir perfiles con discapacidad en nuestros perfiles de usuario a la hora de diseñar el producto
La accesibilidad es un mundo muy extenso y el objetivo de este artículo es, seas o no diseñador, mencionar algunos aspectos básicos para tener una noción sobre la accesibilidad, volvernos más sensibles y poder reducir el sesgo que tengamos con nuestros usuarios de esta manera podemos identificar puntos de mejora y volver nuestro producto más accesible.
Colores y contrastes correctos
Habrás visto alguna vez en algún sitio web o en una app, combinaciones de colores entre elementos como el fondo y textos que tal vez no te fueron tan fáciles de leer, esto se debe a la selección del color o por un inadecuado contraste entre colores que dificulta la lectura e interacción del contenido.
Imagen tomada del artículo: Web Accessibility Criteria - Color Contrast
Hasta octubre de 2022, la OMS menciona que alrededor del mundo, existían 2,200 millones de personas con algún nivel de deterioro de la visión cercana o lejana, por lo que se vuelve muy importante asegurarnos que nuestra selecciones de colores tengan un contraste que ayude a que nuestro contenido sea legible para nuestros usuarios.
Imagen tomada del artículo: There is no “Myths of Color Contrast Accessibility”
Actualmente existen herramientas que nos ayudan (Stark,Contrast,Contraste) junto con una serie de criterios definidos por WCAG (Web Content Accessibility Guidelines) a verificar que nuestro contenido tenga un correcto contraste y que nuestros usuarios puedan leer nuestro contenido.
El color no debe ser la única forma de dar feedback
Dentro de los aspectos de la visión, se encuentra el Daltonismo, que en términos sencillos son defectos de la vista que limitan la percepción de los colores e incluso puede ser nula percepción de color. Esto quiere decir que pueden existir usuarios que no logren identificar un color al que le hemos designado un significado (como los avisos de error que usan rojo).
Tomando en cuenta esto, existen elementos dentro de nuestro diseño que se vuelven importantes identificar para asegurarnos que el color no sea el único identificador para el usuario.
Los estados de los inputs de un formulario solemos diferenciarlos con un color, para alguien con daltonismo puede ser confuso, por eso se vuelve importante diferenciar los estados con algún elemento que de un mejor entendimiento del estado del input, como puede ser un icono.
Los estados vistos desde los ojos de una persona que padece “protanopia”, uno de los tipos de daltonismo más comunes. (Imagen tomada del articulo: Website Accessibility & Design: A vs. AA vs. AAA
Otro elemento importante y muy usado son las gráficas, a diferencia de los inputs, las gráficas pueden tener más datos que mostrar. Para aquellos con algún tipo de daltonismo puede ser difícil de leer si no colocamos elementos de soporte que ayuden a asociar la información.
Gráficas donde solo el color indica la información
Usa patrones, agrega etiquetas, iconos o estilos de texto como soporte para lograr una mejor lectura de la información (Gráficas tomadas del articulo: Understanding color blindness: A guide to accessible design
La importancia de tener tamaños y espaciados para la información
Nuestro producto está formado por contenido y podemos visualizarlo como bloques de información. El contenido es un elemento a veces dejado al último por la facilidad que puede presentar el realizar un cambio, pero no debemos olvidar que el objetivo es facilitar la lectura y compresión del producto y lo podemos hacer considerando dos cosas:
Jerarquía. Definir cuáles elementos funcionan como títulos, subtítulos y cuerpos de texto.
Espacios. Los espacios que hay entre los bloques de información que tenemos, es decir, aquellos que nos ayudan a separar diferentes contenidos en una misma página, por ejemplo. Esto ayudará para que nuestros ojos puedan distinguir qué información va con cuál.
Áreas de seguridad o táctiles grandes
Botones, íconos y enlaces de texto son elementos cuyas reglas básicas de diseño ayudan a que el usuario pueda seleccionar el elemento que necesita. Imagina que tienes lastimada una mano, estás caminando o estás en casa pero tienes prisa por terminar algo, es cuando el tamaño y espaciados cobran importancia, ¿por qué?
Tamaños y proporciones dependiendo del dispositivo. (Imagen tomada de: Provide buttons with a large target size )
Cuando botones o enlaces son más pequeños de lo debido, o se encuentran con poco espacio entre sí (“área de seguridad”) aumenta la probabilidad de estar seleccionando un elemento que no deseamos porque no está claro dónde termina uno e inicia el otro.
Veamos la imagen de abajo, a la izquierda “Conoce la empresa” puede ser difícil de seleccionar debido al poco espacio que existe con respecto al botón de “regístrate ahora”, lo mismo puede pasar si observamos los íconos en la parte de abajo, hay poco espacio entre ellos y esto dificulta el que el usuario pueda seleccionarlos fácilmente
A la izquierda no existe un área de seguridad entre “Regístrate ahora” y “Conoce la empresa”. A la derecha se definió un mayor espacio que permite tener un área de seguridad para saber dónde termina un elemento e inicia el otro (Imagen tomada de: Principio del diseño accesible
Sin duda, hablar sobre todo el universo de la accesibilidad nos llevaría a un sin fin de artículos. Por ahora el objetivo es que después de leer esto puedas identificar los factores más comunes a los que debemos prestar atención, porque la accesibilidad SI impacta en cómo nuestros usuarios viven y perciben nuestro producto.
Comments