ARIA
ARIA añade información sobre roles, estados y propiedades para las tecnologías de apoyo. El comportamiento anunciado debe implementarse realmente.
Añadir significado para las tecnologías de apoyo
ARIA significa Accessible Rich Internet Applications. Sus roles y atributos pueden comunicar información sobre controles a las tecnologías de apoyo. Por ejemplo, aria-expanded="false" indica que la sección desplegable asociada está cerrada.
En un portal de ejemplo, el botón «Más detalles de la factura» lleva este atributo. Al abrir la sección, el valor cambia a true y aparece el contenido correspondiente. Si el valor no cambia, un lector de pantalla puede comunicar un estado distinto del visible.
ARIA no añade por sí sola comportamiento de clic ni interacción con teclado. Un div con role="button" no se convierte automáticamente en un botón funcional. Utilice elementos HTML nativos adecuados y añada ARIA donde falte información. Las indicaciones incorrectas pueden dificultar el uso.
Fuentes
Términos relacionados
- HTML semánticoEl HTML semántico usa cada elemento según su significado. Un botón real aporta propiedades que un bloque de texto con estilo no obtiene automáticamente.
- Lector de pantallaUn lector de pantalla facilita el acceso al contenido digital mediante voz o braille. La estructura y las etiquetas dan sentido a los controles.
- Uso mediante tecladoEl uso mediante teclado permite completar tareas sin ratón. Las acciones deben ser accesibles siguiendo un recorrido comprensible.
- Orden del focoEl orden del foco determina el recorrido por los elementos que pueden recibirlo. Debe conservar el sentido y la operabilidad ante cambios dinámicos.
- Trampa de tecladoUna trampa de teclado deja la interacción atascada en una zona. La contención deliberada del foco en un diálogo necesita una salida operable con teclado.
- Enlace para saltar al contenidoUn enlace de salto evita la navegación repetida y lleva al contenido principal. El siguiente paso con el teclado también debe continuar en el lugar correcto.
Artículos sobre el tema
Diseño y UX con ASES
Experiencia de usuario, interfaces e imagen de marca