Accesibilidad: diseñar para todos

“El poder de la web reside en su universalidad. El acceso por cualquiera independientemente de sus discapacidades es un aspecto esencial”.

Tim Berners-Lee — Padre de la internet, estableció la primera comunicación entre un cliente y un servidor usando el protocolo HTTP en noviembre de 1989.

Tim Cook, CEO de Apple, presentó en 2016 el sitio web de accesibilidad de la compañía usando el lema “Technology is most powerful when it empowers everyone”. Lo hizo con este video:

https://www.youtube.com/watch?v=XB4cjbYywqg

La protagonista es Sady Paulson, una joven que convive con parálisis cerebral. Además de tener movilidad reducida, Sady no habla. Eso no le impidió editar el spot en el que actúa: Sady es Licenciada en Cinematografía Digital y para trabajar usa dos dispositivos Switch Control conectados al cabezal de su silla de ruedas. Los empuja con la cabeza y con ese movimiento ejecuta comandos que cambian según el contexto.

“

En el mundo hay más de 1.000 (¡mil!) millones de personas que viven con algún tipo de discapacidad: casi el 15% de la población mundial. Según la normativa , la accesibilidad “es la usabilidad de un producto, servicio, entorno o herramienta para personas con el más amplio abanico de capacidades”. La accesibilidad está dirigida en primer lugar, a que esas personas puedan usar productos digitales de manera satisfactoria.

Las Pautas de Accesibilidad para el Contenido Web (WCAG) 2.1 concentran cuatro principios para que una interfaz sea accesible, de los cuales se desprenden una serie de pautas:

Navegar en un tren

Es un error habitual creer que la accesibilidad es solo incluir a un porcentaje específico de la población o para cumplir las leyes. Va mucho más allá: es un beneficio para todos y todas.

En primer lugar, es algo que cualquier usuario/a puede necesitar. Además de las personas con discapacidades visuales, cognitivas, motrices o auditivas, hay personas que pueden tener discapacidades transitorias, o dificultades derivadas del envejecimiento u otras situaciones: desde un brazo quebrado hasta el uso de dispositivos obsoletos, desde una conexión lenta hasta estar en situaciones de ruido e inestabilidad. Por ende, como diseñadores/as UX es esencial preguntarnos “¿Qué es la discapacidad?” y tenerla en cuenta siempre en nuestros procesos de trabajo.

“Imagina que estás en un tren”, escribe Richard Morton, del Government Digital Service del Reino Unido, “El tren vibra haciendo que sea difícil hacer click en enlaces u operar botones pequeños. El ruido de fondo y las interrupciones pueden afectar la audición y la concentración. La luz solar, particularmente cuando el sol está bajo en primavera y otoño, puede dificultar la lectura”. Son problemas que deberíamos tomar en cuenta a la hora de diseñar un producto digital. Y piensa más allá: si esta situación empeora o dificulta la experiencia de una persona sin discapacidad motora, ¿cómo le irá a una persona de edad avanzada o con discapacidades motrices severas en este mismo contexto?

Valentina Reyes, su participación en un workshop con el experto en accesibilidad Rajesh Kalidindi, de Microsoft:

“Creo que uno de los grandes aprendizajes que me llevé fue la siguiente frase: ‘No debemos asumir que todas las personas utilizan los productos digitales como nosotros’. Soy zurda y he cometido el error de diseñar pantallas móviles pensando en cómo yo utilizo el celular. Conversando con un colega, me di cuenta de que estaba diseñando para un pequeño porcentaje de la población”.

Más beneficios que costos

Uno de los mitos sobre diseño web accesible es que es difícil y costoso. La verdad es que desarrollar desde cero un sitio web accesible cuesta lo mismo que uno que no lo es. No se necesitan ni contenido ni funciones extra. Se trata de diseñar la interfaz considerando los requerimientos para las personas con discapacidad o dispositivos especiales.

Por el contrario, cuando tomamos en cuenta la accesibilidad, los costos de producción se reducen. Como seguimos estándares de diseño, podemos tener una versión única del producto para todas las plataformas, va a ser más fácil hacer cambios, y el desarrollo y el mantenimiento del producto serán más fáciles.

Un sitio accesible es más usable y se posiciona mejor en los buscadores web, porque es SEO (Search Engine Optimization) friendly. Se va a descargar más rápido y va a tener compatibilidad con diferentes navegadores, además de una mayor vida útil.

En otras palabras: nuestro producto no solo tendrá mejor calidad, sino una audiencia mayor.

¿Qué hacer en cada caso?

Frente a una discapacidad auditiva, –que puede ser parcial o total- podemos empezar por usar closed captioning/subtítulos en los videos. También es recomendable usar un lenguaje accesible y claro para evitar incrementar la carga cognitiva del usuario. Y si queremos ir más allá, tenemos que saber que, para las personas con sordera, muchas veces el idioma escrito es su segundo idioma. El primero es el lenguaje de señas. Cuando se pueda, está muy bien utilizarlo.

Por discapacidad motriz se entiende la dificultad, reducción o falta total en la ejecución de sus movimientos. En general, las personas con ese tipo de discapacidad encuentran barreras relacionadas con interfaces que requieren el uso del mouse o el teclado. Para ayudarlos se recomienda contar con distintos tamaños de interacción (9 mm cuadrados o más) y usar un feedback visual para mostrarles cuando sus interacciones son detectadas.

También es importante darles la posibilidad de una interacción alternativa. En algunos casos puede ser el uso del teclado. En otros –como en el Sady– un mando adaptado. Microsoft, por ejemplo, tiene desarrollos interesantes en materia de mandos para videojuegos.

Las personas que viven con una disminución en sus habilidades cognitivas o intelectuales en general no utilizan ningún tipo de tecnología de apoyo específica. En casos más severos existen navegadores que les simplifican el acceso a la información, como el WWAAC Web Browser y ZAC Browser. Para facilitarles la comprensión del diseño se recomienda:

• Navegación clara y consistente.

• Permitir de manera clara las funciones de Copiar y Pegar para evitar memorizar.

• Poder detener o silenciar o incluso evitar audios automáticos de más de 3 segundos. Poder detener contenido animado.

• Brindar alternativas para acciones que requieren tiempo limitado.

Los usuarios con discapacidad visual suelen utilizar lectores de pantalla o screen readers (como el JAWS o NVDA). Se trata de aplicaciones que interpretan todo aquello que se muestra en la pantalla y la devuelven con un sintetizador de voz, iconos sonoros o una salida Braille.

Aquí tienes un ejemplo –en inglés- de cómo funciona un lector de pantalla:

https://www.youtube.com/watch?v=dEbl5jvLKGQ

Como se ve en el video, para que esos lectores funcionen es muy importante respetar la estructura estándar del html. Y las imágenes, objetos, scripts, o CSS deberían contar con un texto alternativo. El texto alternativo es un elemento de HTML que sirve una doble función: todos los usuarios pueden verlo si un elemento no se carga, pero además los lectores de pantalla lo reproducen para que el usuario sepa lo que está ahí.

Las tipografías sencillas (como sans-serif, arial, verdana o helvética), los tamaños de letra grande, las interfaces que lo soportan y los contrastes para los textos, son elementos que ayudarán a las personas con visión reducida a acceder a la información.

En algunos casos la ceguera al color es absoluta. Y nosotros estamos muy acostumbrados a comunicar con colores. Usamos el rojo como advertencia o el verde para dar a entender que algo que algo está bien. Lo que tenemos que que estar en cuenta es que justo esos dos colores son los que más problemas causan para las personas con daltonismo.

Una buena práctica es acostumbrarnos a usar recursos como símbolos, textos o texturas para ayudarlos a entender qué tienen en frente. También podemos pasar nuestro diseño a escala de grises y comprobar cómo afecta eso a la legibilidad. Como guía, podemos usar Material Design Color Tool.

La mayoría de estos tips también sirven para personas que no viven con ninguna discapacidad. Por ejemplo, un video con subtítulos es ideal para que pueda reproducirse en el transporte público. Tener en cuenta las texturas, los contrastes, la calidad de los textos y el tamaño de la tipografía harán que nuestros productos sean más usables para cualquiera que acceda a ellos.

Al final, como dice Valentina Reyes en el texto que citamos más arriba, se trata de ponerse en los zapatos de los usuarios y desarrollar más y mejor la empatía. Los avances tecnológicos abren la oportunidad de acercar posibilidades a personas que antes se encontraban invisibilizadas. Nuestras tareas como UXers nos da la responsabilidad de trabajar para que esto sea así. En eso estamos.