Si bien hablar de accesibilidad se ha vuelto recurrente en el último tiempo, la accesibilidad digital todavía es un tema desconocido y poco o casi nada se ha aplicado en los sitios actuales. Quienes hemos trabajado en este tema sabemos que no es fácil empezar, pero una vez que lo entiendes, ves y oyes los resultados, no vuelves a programar/diseñar/escribir como antes.

Para comenzar, diremos que la accesibilidad es cuando una persona, sin importar las circunstancias en que se encuentre ni los dispositivos que utilice, puede acceder a todo el contenido de un sitio. Con esto en mente, podemos enumerar 10 acciones que nos ayudarán a comenzar a trabajar la accesibilidad de un sitio y entrar en este desconocido, pero desafiante mundo.

Cabe señalar que según el nivel de accesibilidad que se quiera alcanzar, dependerá las exigencias que debamos cumplir.

1. Leer mucho

La principal fuente de información es la Guía de Accesibilidad de la W3C, luego podemos ir buscando artículos y foros en la web que pueden servir. Debemos tener en cuenta que una vez que nos pongamos manos a la obra, vendrá una etapa de mucho “ensayo y error”.

2. Aprender a usar un screen reader

Los screen reader son softwares de asistencia para personas con ceguera. Lo instalas en tu computador y este leerá absolutamente todo. Al comienzo te parecerá abrumador, luego tu oído se acostumbrará. Los usuarios de screen reader utilizan atajos de teclado para navegar con él, por lo que aprender y comprender cómo estos navegan, será la clave.

3. La accesibilidad es para todos

Muchas veces se relaciona la accesibilidad digital con personas con ceguera, pero también tenemos usuarios con visión reducida, daltonismo, audición reducida, sordera, movilidad reducida en sus extremidades superiores y problemas cognitivos -solo por nombrar algunos-, a los que también debemos tener en cuenta.

4. Crea el storytelling

Si bien dijimos que la ceguera no es la única discapacidad que debemos atender en la accesibilidad, probablemente es a la que más esfuerzo hay que ponerle. Quienes vemos, podemos comprender un mensaje no solo con el texto, sino que también con el color de un botón, las imágenes, etcétera. Es por ello que debemos crear el storytelling que oirá el usuario de screen reader, y proponer instrucciones anexas si es necesario, que le permitan entender el propósito de una página y así evitar que cometa errores.

5. La base es el “buen código”

El 80% del trabajo de accesibilidad se basa en las buenas prácticas del código, tener una correcta estructura semántica, utilizar las etiquetas que correspondan para marcar listas, formularios, títulos, subtítulos y párrafos, etcétera.

6. Establecer las regiones de una página

Como el screen reader lee todo el código de una página, cuando las regiones están bien definidas, este le indicará cuántas hay, así como también cuántos enlaces, etcétera. Así el usuario puede hacerse una idea de cómo se estructura el sitio y dirigirse más rápido a dónde quiere llegar.

7. Formularios

Los formularios probablemente sean los componentes que más problemas pueden traer a los usuarios. Para quienes utilizan screen reader es importante que las etiquetas, campos de texto y ayudas o hint estén correctamente asociados.
Si el formulario se envió y existe un campo con error, es necesario que el foco vuelva automáticamente a ese campo (y evitar que el usuario tenga que volver por todo el formulario y descubrir dónde se equivocó). El input deberá estar marcado con focus visible e incluir una explicación bajo él. Si solo lo marcamos de rojo, un usuario con visibilidad reducida o daltonismo, podría no reconocerlo.

8. Relación de contraste

Debemos preocuparnos del contraste entre los elementos, ya que las personas con visión reducida podrían no ver cierto contenido y cometer errores.

9. Agregar contexto

En el caso de los botones, es de mucha ayuda agregar un mensaje oculto para el screen reader, que indique al usuario hacia dónde se dirigirá al hacer clic en él. En vez de tener un botón que diga “Siguiente” podemos decirle “Confirma el envío de tus datos”.
Debemos procurar tener links comprensibles por sí solos, es decir evitar los “clic aquí” o “más información aquí”, y cambiarlos por lo que realmente encontrarán al acceder a ellos. El usuario de screen reader puede navegar a través de los enlaces y si solo tenemos ese contenido, escuchará una lista de “clic aquí”, “más información aquí”, en vez de “Información sobre tu tarifa”, “detalle de tu pago”, por ejemplo.
Lo mismo sucede con los alt de las imágenes, agregar un alt descriptivo ayudará al usuario de screen reader a comprender qué hay en la imagen, en vez de que solo diga “imagen4.jpg”.

10. Orden natural del “Tab”

Las personas con movilidad reducida, que no utilizan el mouse para navegar, lo hacen con la tecla “Tab” y así pueden moverse por los elementos interactivos del sitio. Es importante considerar el orden natural de lectura de las personas, esto es de izquierda a derecha y de arriba a abajo.
Por último, hacer test con usuarios te entregará una gran cantidad de información que enriquecerá el trabajo de todo el equipo.