Uso de aria-live

El atributo aria-live nos permite a todos notificar a los usuarios de lectores de pantalla cuando el contenido se actualiza en áreas específicas de la página.

 ¿Qué es Aria-live?

JavaScript nos proporciona muchas cosas, incluidas las interacciones dinámicas, como arrastrar y soltar, cambiar el tamaño, ocultar y mostrar, abrir y cerrar, cambiar de vista y muchas cosas más. También nos permite crear widgets, selectores de fecha, controles deslizantes y más. Sin embargo, muchas de estas interacciones dinámicas y widgets son problemáticos para ciertas tecnologías de asistencia al usuario.

¿cómo se usar aria-live?

El atributo aria-live puede aplicarse a cualquier elemento HTML.

A los lectores de pantalla se les informará de cualquier cambio dentro de ese elemento después de que la página haya sido cargada inicialmente. Existen tres valores posibles para el atributo aria-live.

El primero es:

aria-live = "off". Las tecnologías de asistencia no deben anunciar actualizaciones a menos que la tecnología de asistencia esté actualmente enfocada en esa región.

Un ejemplo donde se podría usar este valor es para tablas clasificables. En este caso, los lectores de pantalla deben saber que el orden de contenido del cuerpo de la tabla ha cambiado, pero esta información no necesita ser anunciada a los usuarios.

aria-live="polite" Las actualizaciones realizadas en esta región solo deben anunciarse si el usuario no está haciendo nada.

aria-live="assertive." En este caso, las tecnologías de asistencia anunciarán actualizaciones inmediatamente. El valor assertive solo debe usarse si la interrupción es imprescindible para que los usuarios