[Accessibilité Web] Bien rédiger le texte alternatif des images

Publié le 11/12/2013 à 00h13

Sur un site web, pour l'accessibilité du contenu il convient d'associer à chaque image un texte alternatif. Ce texte est connu pour être utile pour le référencement, particulièrement pour Google Images, mais est initialement prévu pour être utilisé par les logiciels d'assistance aux mal-voyants. En d'autres mots, il faut compléter le texte alternatif des images pour que les lecteurs d'écran décrivent les images aux mal-voyants. Et en bonus, ce texte peut être affiché si les images ne peuvent pas s'afficher sur un site, pour une raison ou pour une autre.

Toutefois, ce texte alternatif doit être compléter avec soin pour qu'il ai réellement une utilité pour les personnes ayant une déficience visuelle et non uniquement pour le référencement sur Google Images. Cet article est justement là pour venir en aide à toute personne susceptible d'écrire du contenu sur internet.

pictogramme d'une personne mal voyante

pictogramme d'une personne mal voyante

Voici quelques conseils à respecter pour bien écrire le texte alternatif des images :

  • Le texte ne doit pas commencer par "photo de ...", "image de ..." ou même "ceci est une image de ...". En effet, les lecteurs d'écran ont déjà leurs méthodes pour annoncer qu'il s'agit d'une image. Ce serait ridicule que le lecteur d'écran doive se répéter
  • Il faut savoir être concis, surtout si l'image n'apporte pas un grand intérêt. Il n'est pas nécessaire décrire une longue phrase avec tous vos mots-clés, c'est déjà une perte de temps de lire un contenu alternatif pour ces utilisateurs. Seul bémol tout de même, si l'image a une réelle utilité il faut la décrire suffisamment pour donner les mêmes explications aux utilisateurs ayant une déficience visuelle
  • Une image sans réelle utilité (exemple : utilisé pour le design) n'a pas nécessairement besoin d'avoir un texte alternatif. L'attribut HTML doit toutefois rester présent dans le code de l'image
  • Une image utilisée uniquement pour le webdesign devrait plutôt être insérée en CSS
  • Les images iconographiques peuvent être ajoutées grâce au CSS
  • Idéalement il est inutile de répéter la description mot pour mot si l'image est déjà expliquée dans le contenu
  • Il n'est pas nécessaire non plus de données des indications sur le format de l'image (cf. jpg, png, gif …) ou les effets visuels utilisés (noir et blanc, effet polaroid …)
  • Si l'image est cliquable il faut décrire où mène le lien

Ces conseils sont relativement simple à respecter, il suffit juste de s'en souvenir lorsque vous rédigerez le texte alternatif des images.

Auteur: Tony Archambeau

Développeur web passionné par le référencement et l'ergonomie d'utilisation des sites et applications web, j'édite plusieurs sites web dont infowebmaster.fr.

Commentaires »


Agence 77
Le 10 janvier 2014

En effet, toutes les images doivent contenir de courtes descriptions la représentant. Nous l’utilisons d’habitude pour le référencement, les handicapés sont parfois délaissés, mais merci pour le rappel.


WEB MAG
Le 15 janvier 2014

Très bon article :) Donner aux images un texte alternatif est la plus importante chose à faire pour l’accessibilité sur le web.


fabien [site]
Le 9 mai 2014

C’est un bon rappel il y a peu de wemaster qui mettent un bon texte alternatif

Leave a comment