Contenido / Ficha de diccionario

Atributo alt: cómo escribir el texto alternativo de una imagen

El atributo alt proporciona una alternativa textual para una imagen HTML. Su contenido debe transmitir la información o función que esa imagen aporta en el contexto de la página, especialmente cuando no se puede ver.

El atributo alt también puede ayudar a los buscadores a interpretar una imagen, pero no es un espacio para acumular palabras clave. Antes de escribirlo, decide si la imagen informa, decora, funciona como enlace o representa datos que necesitan una explicación más amplia.

Atributo alt según la función de la imagen

Una imagen informativa necesita una descripción breve de lo relevante. Una imagen puramente decorativa suele utilizar alt="" para que las tecnologías de asistencia puedan ignorarla. Omitir el atributo no equivale a dejarlo vacío.

Si una imagen es el único contenido de un enlace, la alternativa debe expresar su propósito. Si un texto adyacente ya comunica la misma información y la imagen no añade nada, evita repetirla innecesariamente. La misma fotografía puede necesitar alternativas distintas en páginas con objetivos diferentes.

Ejemplos de redacción

Ejemplos hipotéticos: en una ficha de mobiliario, «Mesa plegable con patas recogidas bajo el tablero» explica una característica visible. En cambio, «mesa barata comprar mesa oferta mejor mesa» no describe la imagen y dificulta su lectura.

<img src="mesa-plegada.jpg"
     alt="Mesa plegable con patas recogidas bajo el tablero">

Para un adorno sin información:

<img src="adorno.svg" alt="">

Estos nombres de archivo son ilustrativos. Elige la alternativa por lo que existe en tu imagen real; no inventes materiales, ubicaciones o resultados que no se pueden reconocer o no están documentados.

Gráficos, texto en imágenes y descripciones largas

Un gráfico complejo puede necesitar un alt que identifique su finalidad y una explicación cercana con sus datos y conclusiones relevantes. No intentes comprimir una tabla entera dentro del atributo. Ofrecer datos como texto permite consultarlos sin depender de la imagen.

Si una imagen contiene palabras esenciales que no aparecen en otro lugar, la alternativa debe conservar su información. Siempre que sea viable, publica el texto como HTML legible en lugar de incrustarlo en una imagen. El atributo title no sustituye el alt.

Cómo revisar el resultado

Pregúntate qué se pierde si la imagen desaparece. Lee el texto alternativo junto al contenido próximo y comprueba si añade información útil, repite lo mismo o deja sin explicar una acción. No hay una longitud universal que garantice una buena alternativa: busca brevedad suficiente y contexto.

Revisa también que el archivo cargue, tenga dimensiones adecuadas y no distorsione el contenido en móvil. La ficha de a href explica los enlaces; la guía de contenido SEO ayuda a integrar texto e imágenes.

¿Estás preparando una galería de imágenes o un catálogo? En Diseño web Barcelona puedes ver un ejemplo de galería y conocer cómo planteamos la presentación del contenido. Te ayudará a valorar el conjunto de la página, además de redactar el texto alternativo de cada imagen.