Biblioteca Complutense

7. Imágenes accesibles

Añade un texto alternativo a cada imagen

Atributo alt. Texto alternativo de la imagen

La manera más habitual de "describir" las imágenes es proporcionar un texto alternativo. Este texto alternativo cumple varias funciones:

  • Es leído por lectores de pantalla en lugar de las imágenes permitiendo que el contenido y función de la imagen sean accesibles a personas con dificultades visuales o cognitivas.
  • Los navegadores web lo muestran en lugar de la imagen si ésta no se ha cargado, o si el usuario tiene las imágenes deshabilitadas.
  • Proporciona un significado semántico y descriptivo a la imagen que puede ser usado posteriormente por motores de búsqueda para determinar el contenido de la imagen.

El texto alternativo debe ser preciso y equivalente, breve, no redundante, no usar frases como "imagen de...".

Cuando una imagen contiene sólo texto, el texto que muestra puede usarse normalmente como texto alternativo.

Toda imagen incluida en una página Web debe proporcionar un texto alternativo que aporte la misma información o función que la imagen. Podemos usar las siguientes técnicas:

  1. Técnica HTML: usar texto alternativo en el atributo "alt" de los elementos "IMG".
  2. Técnica Widget Texto: usar texto alternativo en "Descripción de la imagen".
  3. Técnica PDF: usar texto alternativo en "Establecer texto alternativo".
  4. En el contexto y entorno de la propia imagen.

Si la imagen es simple decoración, es decir, se utiliza únicamente para definir el formato visual, debemos implementarlo de manera que pueda ser ignorado:

  1. Técnica HTML: atributo "alt" vacío.
  2. Técnica Widget Texto: campo "Descripción de la imagen" vacío.
  3. Técnica PDF: Marcar como "Figura decorativa".

Decálogo de calidad web