Un menú desplegable, un carrusel de imágenes o una ventana emergente pueden verse perfectamente claros para una persona que ve la pantalla, pero completamente opacos para alguien que navega con un lector de pantalla, si el código no incluye la información adicional necesaria. ARIA (Accessible Rich Internet Applications) es precisamente el conjunto de atributos que se añaden al HTML para comunicar a las tecnologías de asistencia qué es y cómo funciona cada elemento interactivo de una página.
Qué problema resuelve exactamente
El HTML tradicional ya incluye elementos con significado semántico claro (un botón, un enlace, un encabezado), que los lectores de pantalla interpretan sin problema. Pero muchas interfaces modernas usan elementos genéricos (como un simple «div») a los que se les añade comportamiento mediante JavaScript para simular un botón, una pestaña o un menú, sin que ese elemento genérico comunique por sí solo qué función cumple realmente. ARIA rellena ese vacío, añadiendo etiquetas explícitas sobre el rol y el estado de cada elemento.
Atributos habituales dentro de ARIA
- role: indica qué tipo de elemento es realmente (por ejemplo, role=»button» en un div que se comporta como botón).
- aria-label: proporciona una descripción textual cuando no existe texto visible suficiente (útil en iconos sin texto acompañante).
- aria-expanded: indica si un menú desplegable está abierto o cerrado en cada momento.
- aria-hidden: oculta un elemento específicamente a tecnologías de asistencia, útil para elementos puramente decorativos.
Por qué su primera regla es, paradójicamente, «no usarlo si no hace falta»
La propia especificación de ARIA recomienda usar siempre primero el elemento HTML semántico nativo correspondiente (un botón real en lugar de un div con role=»button»), reservando ARIA para los casos donde no existe una alternativa nativa adecuada. Un mal uso de ARIA, aplicado de forma incorrecta o innecesaria, puede empeorar la accesibilidad en lugar de mejorarla, confundiendo a las tecnologías de asistencia con información contradictoria o redundante.
Por qué merece atención incluso sin exigencia legal directa
Más allá de cumplir normativa de accesibilidad, un buen uso de ARIA amplía genuinamente el número de personas que pueden usar una web sin fricciones, y suele coincidir además con un código más ordenado y semánticamente más claro, algo que también beneficia indirectamente al SEO técnico del sitio.