Accesibilidad y diseño inclusivo

Desarrollo

Para que realmente todas las personas puedan acceder al contenido de un servicio digital, es necesario que el código también esté optimizado para lectores de pantalla. Esto ayudará a que las personas invidentes puedan escuchar todo nuestro contenido e interactúen con el servicio, ayudados por el software de su preferencia. Estos son los requerimientos mínimos en cuanto a desarrollo que se deben incluir en todos los servicios:

Texto alternativo para imágenes

El uso de imágenes en un servicio debe ser solamente para aportar información valiosa al usuario, por ejemplo una ayuda sobre dónde encontrar el dígito verificador del DNI. Por lo tanto, una persona invidente que requiere de software de lectura de pantalla, necesita de texto alternativo que le describa la imagen. En caso una imagen sea únicamente decorativa, no necesita texto alternativo, pero entonces tendríamos que revisar por qué la estamos incluyendo.

Indicar el idioma en que se encuentra la página

Para que un software de lectura de pantalla pueda leer adecuadamente la información, la página o servicio debe indicar dentro de su código en qué idioma se encuentra. Esto se logra con el atributo lang, dentro de la etiqueta html.

Utilizar las etiquetas correctas de HTML5 y aria-labels

La estructura de cada página debe tener las etiquetas correctas para identificar títulos, formularios, listas, entre otros. En caso no exista un elemento nativo de HTML para un elemento que usemos, debemos utilizar aria-labels. Estas etiquetas nos permiten “nombrar” el elemento para que pueda ser reconocido por los lectores de texto. Los aria-labels también pueden ser utilizados para mejorar la interactividad al utilizar lectores de pantalla.

Considerar el orden en que se muestra la información para ordenar el código

En lo posible, debemos estructurar el código en el orden en que un usuario va a consumirlo. Es decir, si tenemos una fotografía y debajo el título de esta, es mejor colocar en el código primero el título y luego la imagen.

Elementos interactivos usando el teclado

Debemos asegurar que el usuario pueda utilizar el teclado para ir de un elemento interactivo a otro. Un menú, acordeón (elementos con opciones desplegables) o reproductor de video deben poder ser controlados utilizando las teclas.

Usar código CAPTCHA cuando sea necesario

Los captchas deben ser utilizados cuando el formulario puede generar registros spam o cuando es imperativo proteger las consultas (como la autenticación de DNI). Si necesitamos utilizar CAPTCHA, debemos implementar uno que sea accesible para personas que navegan utilizando un software de lector de pantalla. Una alternativa es utilizar un reCAPTCHA en español.

Estos son solo algunos requerimientos mínimos de lo que se debe cumplir en un servicio, pero se pueden incluir otras mejoras, como las detalladas en https://www.w3.org/WAI/tips/developing/.

Referencias