Qué es Generador de regiones ARIA live?
Una región ARIA live es un elemento HTML que los lectores de pantalla monitorean para detectar cambios de contenido y los anuncian automáticamente al usuario. Esto permite que las actualizaciones dinámicas de contenido — como errores de validación de formularios, mensajes de estado o mensajes de chat — se lean en voz alta sin mover el foco del teclado. El atributo aria-live controla la urgencia con la que se anuncian los cambios (polite o assertive).
Respuesta rápida
Cree una región ARIA live para anunciar actualizaciones dinámicas de contenido a los usuarios de lectores de pantalla. Use role=status (polite) para actualizaciones informativas, role=alert (assertive) para alertas críticas. La región debe existir en el DOM al cargar la página y el contenido debe actualizarse mediante textContent, no innerHTML.
Last updated: 2026-05-28
Limitaciones
- Las regiones ARIA live solo funcionan con lectores de pantalla que las soportan. Los usuarios que navegan visualmente sin lector de pantalla no ven ninguna indicación visual de las actualizaciones de la región live a menos que agregue una.
- aria-live=assertive interrumpe los lectores de pantalla inmediatamente, lo que puede ser disruptivo para usuarios que dependen del ritmo del audio. Úselo con moderación y solo para mensajes verdaderamente críticos.
- Las actualizaciones frecuentes o rápidas de textContent pueden hacer que los lectores de pantalla acumulen anuncios y se retrasen. Aplique debounce a las actualizaciones que ocurren más de una vez por segundo.
Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub
Cómo usar esta herramienta
- Elija el tipo de región según la criticidad de las actualizaciones — status para informativo, alert para urgente, log para actualizaciones secuenciales.
- Configure aria-atomic (leer toda la región o solo los cambios) y aria-relevant (qué tipos de cambios en el DOM activan los anuncios).
- Copie el fragmento HTML con o sin el asistente de actualización JavaScript.
- Coloque la región live en el DOM al cargar la página para que los lectores de pantalla puedan registrarla.
Para qué puedes usarla
- Agregar una región de estado para comentarios de validación de formularios que los lectores de pantalla anuncien sin mover el foco.
- Crear una región de alerta para mensajes de error críticos que interrumpan al usuario inmediatamente.
- Construir un registro de mensajes de chat donde los nuevos mensajes se anuncien en orden a medida que aparecen.