Texto alternativo para las imágenes

Entre premios y eventos hacia mucho tiempo que no escribia ningún articulo, así que se me ha ocurrido hablar del texto alternativo (atributo “alt”) de las imágenes. Esta es una de las cosas más importantes y que primero se aprenden en la Accesibilidad Web, pero ¿lo usamos correctamente?. Pues aquí voy a tratar de explicar un poco el uso de este atributo desde mi propia experiencia.

Lo primero que hay que hablar es de qué longitud debe tener el texto alternativo. Pues no hay ninguna norma oficial, sólo alguna recomendación en el mundo anglosajón, y además no puede existir norma alguna porque no es lo mismo ponerlo en español que en inglés. Por tanto, el texto alternativo debe ser lo más corro posible pero a la vez lo más explícito posible.

Algunas herramientas de revisión automática te advierten cuando el texto alternativo es menor de 7 caracteres o mayor de 80, pero esto sólo puede tomarse como un aviso para que revises si realmente ese texto alternativo es adecuado o no.

Una vez visto este punto de discusión respecto al texto alternativo, vamos a ver el otro punto de discusión importante, que es el usar un atributo “alt” nulo (vacío) o sólo un espacio. Respecto a esto hay que tener en cuenta si realmente es aplicable a la imagen en cuestión y también el comportamiento de los diversos lectores de pantalla ante esas situaciones.

  1. Atributo “alt” nulo: alt=”". Cuando la imagen cumple una función únicamente decorativa y no tiene significado en sí misma, como por ejemplo un gráfico transparente que cumple la función de espaciador, una imagen que crea la ilusión de una curva en una tabla, etc.
  2. Vacío o en blanco: alt=” “. Para imágenes decorativas cuyo significado no aporta nada importante para la comprensión de la página. La diferencia entre ésta forma de marcar la información alternativa y la anterior es que, en el primer caso la mayoría de los lectores de pantalla no dicen nada y aquí el lector avisa que existe una imagen, de manera que el usuario, si lo desea, puede descargarse esa imagen si está navegando sin descargarlas y con la ayuda de un lector de pantalla. Pero, por otra parte, esto puede ser molesto para algunos usuarios, pues algunos lectores de pantalla o navegadores con conversión texto-voz, leen: “imagen sin texto alternativo” cada vez que encuentran una. De igual modo, en los navegadores que presentan una tooltip con el primer caso no ofrecen nada y en este segundo caso presentan la tooltip vacía.
Enviar a: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • del.icio.us
  • Google
  • Live
  • Meneame
  • Technorati

Entradas relacionadas:

  1. Imágenes y leyendas
  2. Diagnostic CSS: CSS para diagnosticar estilos
  3. Málaga apuesta por la Accesibilidad Web

Tags:

Si te gustó esta entrada anímate a escribir un comentario o suscribirte al feed y obtener los artículos futuros en tu lector de feeds.

Comentarios

Excelente artículo.
Sólo como referencia complementaria, para descripciones largas de algun grafico (mapas, gráficas de estadísticas, etc.) es recomendable el uso del atributo “longdesc”. Es decir, en un archivo htm poner el texto de la descripcion del grafico y en el grafico, despues de img src poner londesc=descripcion.htm, por ejemplo.

Hola Luis Alfonso,

muy buen apunte, muchas gracias.

Escribe un comentario

(requerido)

(requerido)