Krypton Solid

Guía para principiantes de accesibilidad ARIA

Idealmente, Internet debería ser para todos. Pero algunas funciones utilizadas en los sitios web no están disponibles para los usuarios con discapacidades, especialmente aquellos que dependen de lectores de pantalla y aquellos que no pueden usar el mouse.

¿Problema? HTML.

La versión anterior de HTML, HTML4, no tenía etiquetas que describieran semánticamente ciertos widgets de la interfaz de usuario, como controles deslizantes, menús y barras de progreso. Como resultado, los desarrolladores han recurrido al uso de elementos genéricos como «div» para crear estos widgets. Aunque se veían bien para los usuarios que podían ver la pantalla, eran problemáticos para los que no podían.

Debido a que el código no proporcionó suficiente información para describir estos widgets en el marcado, no fue utilizable por una tecnología de soporte. Ahí es donde entró ARIA.

ARIA permite a los autores web describir los componentes de la interfaz de usuario de manera que las tecnologías de asistencia puedan comprenderlos, haciendo que esos componentes sean accesibles para los usuarios de tecnologías de asistencia.

A continuación, analizaremos más de cerca qué es ARIA y cómo puede ayudar a mejorar la accesibilidad web.

¿Qué es ARIA?

ARIA, abreviatura de Accesible Rich Internet Applications, es un conjunto de roles, estados y propiedades que se pueden agregar a HTML para describir el significado y el propósito de los elementos comunes de la interfaz de usuario que no tienen etiquetas semánticas en HTML. Al complementar HTML de esta manera, los atributos ARIA hacen que el contenido web y las aplicaciones sean más accesibles para las personas que utilizan tecnologías de asistencia.

Por ejemplo, ARIA proporciona roles como «casilla de verificación» y «menú» para describir el tipo de widget que se presenta. ARIA también proporciona propiedades para describir el estado de los widgets, como «marcado» para una casilla de verificación o «haspopup» para un menú.

Dado que ARIA controla la prestación de la experiencia no visual de los usuarios de tecnología de asistencia, Iniciativa de accesibilidad web del W3C (WAI) dice que, funcionalmente, los roles, estados y propiedades de ARIA son como CSS para tecnologías de asistencia.

Ahora que entendemos qué es ARIA, aprendamos cómo usar ARIA para hacer que el HTML básico de su sitio sea más accesible.

Guía de accesibilidad ARIA

Antes de usar ARIA, es importante que se tome el tiempo para comprender y aplicar las reglas de accesibilidad de ARIA a continuación. Se basan en la orientación proporcionada por el Grupo de trabajo de WAI sobre aplicaciones de Internet enriquecidas. Especificación de prácticas de escritura 1.2.

1. Utilice elementos HTML nativos cuando estén disponibles.

ARIA fue diseñado para llenar un vacío en HTML4. Sin embargo, posteriormente se agregaron muchas etiquetas semánticas a HTML5. Los autores web siempre deberían preferir utilizar el elemento HTML semántico correcto en lugar de utilizar un rol, estado o propiedad ARIA.

Por ejemplo, los autores web deben usar el elemento HTML5

Deja un comentario