Alternatives textuelles : écrire un alt qui sert vraiment
C'est le critère le plus connu, le plus mal appliqué, et celui qu'aucun outil ne peut corriger à votre place. Un attribut présent ne vaut rien s'il ne transmet pas l'information que l'image portait. La question n'est jamais « que montre cette image ? » mais « qu'apporte-t-elle au lecteur ? »
La règle en trois temps
- L'image porte-t-elle une information ? Si non, elle est décorative : l'attribut existe et reste vide, pour qu'elle soit ignorée.
- Cette information est-elle déjà dans le texte voisin ? Si oui, l'image est décorative également : la répéter alourdit la lecture.
- Sinon, écrire ce que l'image apporte, dans le contexte de la page.
Le même visuel, trois alternatives
| Contexte de la page | Alternative appropriée |
|---|---|
| Illustration d'un article sur l'accueil du public | Vide : l'image n'ajoute rien au texte |
| Page « Nos horaires d'accueil » | « Guichet d'accueil ouvert, un agent reçoit un usager » |
| Page expliquant où se présenter | « Le guichet se trouve à droite en entrant, sous le panneau Accueil » |
La même image appelle trois traitements différents. C'est pourquoi la génération automatique d'alternatives ne peut pas produire un résultat conforme : elle décrit le contenu de l'image, elle ne connaît pas l'intention de la page. Voir les surcouches d'accessibilité.
Les cas particuliers
| Type | Traitement |
|---|---|
| Image décorative | Attribut présent et vide |
| Image-lien | L'alternative décrit la destination, pas l'image |
| Image-bouton | L'alternative décrit l'action déclenchée |
| Logo | Le nom de l'organisation ; si c'est un lien vers l'accueil, l'indiquer |
| Image de texte | Reprendre le texte à l'identique ; mieux : ne pas mettre de texte en image |
| Graphique, schéma | Alternative courte, plus une description détaillée à proximité |
| Photo d'illustration | Le plus souvent décorative |
| Pictogramme accompagné de texte | Décoratif : le texte porte déjà l'information |
| Image dans un lien contenant aussi du texte | Décorative : le texte du lien suffit |
Les images complexes
Une alternative courte ne peut pas restituer un graphique. La réponse en deux temps : une alternative qui nomme la nature du contenu — « graphique en barres de la fréquentation mensuelle » — et une description détaillée à proximité, visible de tous.
La meilleure description détaillée est souvent un tableau de données, qui sert tout le monde : les personnes aveugles, celles qui veulent les valeurs exactes, et les moteurs. Voir les tableaux accessibles.
Les erreurs les plus fréquentes
- Le nom du fichier. Restitution absurde : « i m g underscore 4 7 2 point j p g ».
- « Image » ou « photo ». Le lecteur d'écran annonce déjà qu'il s'agit d'une image.
- Une liste de mots-clés. Détourner l'attribut pour le référencement dégrade les deux.
- Une alternative sur une image décorative. Bruit inutile dans la lecture.
- Un attribut absent. Certains lecteurs lisent alors l'adresse complète du fichier.
- Une description interminable. Quarante secondes avant d'atteindre le lien suivant.
Poursuivre
Pour l'autre pilier de la restitution, voyez la structure des titres.