Glosario · Accesibilidad

ARIA: atributos de accesibilidad en HTML

Accessible Rich Internet Applications: un conjunto de atributos HTML que complementan la semántica nativa para ayudar a lectores de pantalla.

Atributos ARIA más usados:

  • role: define el tipo de elemento (role="button", role="dialog", role="navigation")
  • aria-label: etiqueta textual cuando el elemento no tiene texto visible
  • aria-labelledby: referencia el ID de otro elemento como etiqueta
  • aria-hidden: oculta del árbol de accesibilidad (pero visible visualmente)
  • aria-expanded: indica si un colapsable está abierto o cerrado
  • aria-current: marca el ítem activo en una lista/nav

Regla oro de ARIA: "la mejor ARIA es no usar ARIA" — prefiere HTML semántico nativo (<button>, <nav>, <main>) cuando sea posible. ARIA sólo se usa para cubrir casos que HTML no expresa nativamente.

Por qué importa

ARIA mal usada es peor que no usarla. Aplicarla requiere probar con un lector de pantalla real (VoiceOver en Mac, NVDA en Windows). Un sitio con 30 <code>role="button"</code> sobre <code>&lt;div&gt;</code> tiene peor accesibilidad que uno con <code>&lt;button&gt;</code> nativos.

Siguiente paso

¿Tienes un proyecto exigente entre manos?

Cuéntanos qué necesita tu empresa. En la primera llamada evaluamos viabilidad técnica, alcance y presupuesto cerrado. Sin compromiso.

Antes de irte

¿10 segundos para analizar tu web gratis?

Pon la URL de tu web y te damos el diagnóstico al momento: SEO, rich snippets, accesibilidad, seguridad y rendimiento. Sin registro ni email. Si después quieres informe humano, lo pides desde ahí.

Analizar mi web gratis