Es bien cierto que una imagen vale más que mil palabras y creo que a día de hoy no podría entender una web sin imágenes. Que sí, que las hay, pero creo que casi nunca son webs orientadas a vender algo, orientadas a algún tipo de lo que en marketing llaman conversión, sea del tipo que sea.

De modo que entendemos que la imagen, ya sea fotografía, iconos, la paleta de colores, la tipografía… es algo importante para que una web sea más o menos atractiva o incluso cómoda.

Las imágenes, principalmente decoran, pero también pueden complementar o describir cierta información. Información que, sin esa imagen, se torna incompleta o más difícil de comprender.

Pero entonces, ¿qué ocurre con esas personas que visitan nuestra web y tienen algún tipo de dificultad para ver esas imágenes informativas? ¿Serán capaces de encontrar ese botón azul que les permite suscribirse a nuestra newsletter?

alt de las imágenes en html

Voy a partir de que ya se conoce la existencia del atributo alt para las etiquetas img de HTML.

El propósito del atributo es proporcionar una descripción textual de la imagen, porque no sea visible por problemas técnicos, por opción del usuario o por cualquier tipo de discapacidad para ver o interpretar la imagen.

El atributo alt es obligatorio para los elementos img de html. Si bien, éste puede, e incluso debe, quedar vacío en algunas circunstancias.

Puede beneficiar el SEO al aportar información precisa sobre el contenido o funcionalidad de la imagen, pero alt no es un atributo SEO. Emplear este atributo con un objetivo de posicionamiento en mente, te va a llevar a la discriminar a un amplio colectivo en favor de un incremento minúsculo en el posicionamiento de alguna palabra clave.

El contenido de este atributo variará, principalmente, según la funcionalidad para la que se use la imagen. W3C distingue seis tipos de imagen según su uso y propone criterios de cómo debe usarse el atributo alt.

• Imágenes informativas:
  Representan conceptos o información. El texto debe ser una descripción corta de la información presentada en la imagen.
• Imágenes decorativas:
  Imágenes cuya única función es decorar visualmente la página. El atributo alt se dejará vacío. Estas imágenes, no aportan información al documento.
• Imágenes funcionales:
  Imágenes usadas para representar un botón, un enlace… El texto alternativo debe representar la función de la imagen en lugar de describir la imagen.
• Imágenes complejas
  como diagramas, procura proveer un esquema equivalente en texto.
• Grupos de imágenes:
  Si varias imágenes transmiten un único concepto, el texto de una de las imágenes debe describir el conjunto completo.
• Mapas de imagen:
  El texto alternativo describe el propósito general del conjunto de imágenes. Además, se debe añadir descripción para cada área sobre la que se pueda hacer click.

En la web de W3C también encontramos un árbol de decisión para acertar con el uso del texto alternativo.