El atributo alt proporciona una alternativa de texto que describe el contenido o la función de la imagen. Sirve a usuarios y herramientas que no pueden ver la imagen.
html
<img src="chart.png" alt="Sales grew 40% from Q1 to Q2" />
El atributo alt proporciona una alternativa de texto que describe el contenido o la función de la imagen. Sirve a usuarios y herramientas que no pueden ver la imagen.
<img src="chart.png" alt="Sales grew 40% from Q1 to Q2" />
alt en voz alta, para que un usuario ciego sepa qué transmite la imagen. Sin él, escucha el nombre del archivo o simplemente "imagen" — inútil.alt en lugar de un icono de imagen rota.alt para entender e indexar imágenes (SEO de imágenes).<!-- ✅ describe the MEANING, not "image of..." -->
<img src="dog.jpg" alt="A golden retriever catching a frisbee" />
<!-- ✅ for functional images, describe the ACTION -->
<a href="/home"><img src="logo.png" alt="Acme home" /></a>
<!-- ✅ DECORATIVE images get an EMPTY alt so screen readers skip them -->
<img src="divider.png" alt="" />
alt="" (vacío, pero presente) es importante: le dice a los lectores de pantalla "esto es decorativo, ignóralo." Omitir alt completamente es diferente — entonces el lector podría anunciar el nombre del archivo.
alt es el atributo de accesibilidad más importante para imágenes y un requisito legal según los estándares de accesibilidad (WCAG).
Hace que el contenido sea perceptible para usuarios sin visión, proporciona un respaldo cuando las imágenes se rompen y ayuda a la SEO — describe qué significa la imagen en contexto y usa alt="" para imágenes puramente decorativas.