Técnica ARIA WCAG 2.2
ARIA15Usar aria-describedby para proporcionar descripciones de imágenes
En resumen
Cuando el texto alternativo corto de una imagen (el alt) no basta para transmitir toda la información que contiene, como ocurre con gráficos o diagramas, esta técnica asocia la imagen a una descripción larga que ya está en la misma página mediante aria-describedby. Así los lectores de pantalla anuncian la descripción junto a la imagen y, además, el texto queda a la vista de todas las personas, también de quienes no usan tecnologías de asistencia.
Aplicabilidad
Tecnologías que admiten Accessible Rich Internet Applications (WAI-ARIA).
Descripción
El objetivo de esta técnica es proporcionar descripciones de las imágenes cuando una alternativa textual corta no transmite adecuadamente la función o la información que ofrece el objeto.
Una de las características de WAI-ARIA es la posibilidad de asociar un texto descriptivo a una sección, un dibujo, un elemento de formulario, una fotografía, etc., mediante la propiedad aria-describedby. El texto descriptivo proporcionado con aria-describedby es independiente del nombre corto proporcionado con el atributo alt de HTML. Una ventaja de proporcionar descripciones largas usando contenido de la misma página en la que está la imagen es que la alternativa queda disponible para todo el mundo, incluidas las personas videntes que no disponen de tecnologías de asistencia.
Al igual que aria-labelledby, aria-describedby puede aceptar varios id para apuntar a otras zonas de la página mediante una lista separada por espacios. También está limitado a id para definir estos conjuntos.
Ejemplos
Describir una imagen
El siguiente ejemplo muestra cómo puede aplicarse aria-describedby a una imagen para proporcionar una descripción larga, cuando esa descripción textual está en la misma página que la imagen.
<img src="ladymacbeth.jpg" alt="Lady MacBeth" aria-describedby="p1">
<p id="p1">This painting dates back to 1889 and is oil on canvas. It was created by
John Singer Sargent, and represents ...</p>Pruebas
Procedimiento
- Examinar cada elemento de imagen en el que esté presente un atributo
aria-describedby. - Examinar si el atributo
aria-describedbyasocia por software un elemento con su descripción textual, a través del atributoiddel elemento en el que se encuentra el texto que se usará como descripción. - Examinar si la combinación del equivalente textual y la descripción textual asociada describe con precisión el objeto o proporciona su propósito equivalente.
Resultados esperados
- Las comprobaciones n.º 1, n.º 2 y n.º 3 son verdaderas.
Recursos
- WAI-ARIA Authoring Practices Guide (guía de prácticas de autor de WAI-ARIA)
- HTML to Platform Accessibility APIs Implementation Guide: Accessible Name and Description Calculation (cálculo del nombre y la descripción accesibles)
Cómo lo comprobamos en ADDAW
En las auditorías de accesibilidad de ADDAW revisamos cada criterio de conformidad siguiendo este catálogo de técnicas: comprobamos si la web aplica una técnica suficiente y documentamos cada fallo común con capturas y el código afectado, para que el equipo de desarrollo sepa exactamente qué corregir. Los informes siguen la metodología del Observatorio de Accesibilidad y la norma UNE-EN 301 549.
Fuente y licencia
Traducción al español, no oficial, realizada por ADDAW a partir de la técnica ARIA15 del documento «Techniques for WCAG 2.2» del W3C (versión del repositorio público del W3C a 22/10/2026). Copyright © W3C® (MIT, ERCIM, Keio, Beihang). Se publica conforme a la licencia de documentos del W3C. El texto normativo de referencia es el original en inglés; si detecta un error en la traducción, escríbanos.
