Rédiger des textes alternatifs : règles, exemples et aide de l'IA

Le texte alternatif manquant fait partie des infractions que n'importe quel outil de test trouve en quelques secondes. C'est exactement pour cela qu'il figure en tête des rapports d'audit automatiques, dans les scans de l'autorité allemande de surveillance comme dans les rapports joints aux courriers d'avocats. La bonne nouvelle : presque aucune infraction ne se corrige aussi vite, et les règles d'un bon texte alternatif tiennent sur une fiche. Ce guide les présente avec des exemples concrets bons et mauvais, explique le test du contexte et dit honnêtement où l'IA aide et où elle se trompe. Vous pouvez générer un premier brouillon pour une image réelle dès maintenant.

Pourquoi les textes alternatifs sont repérés en premier

La base se trouve dans les WCAG 2.2 : le critère de succès 1.1.1 « Contenu non textuel » exige pour chaque image une alternative textuelle qui remplit le même objectif que l'image elle-même. Ce critère est de niveau A, le plus bas des trois niveaux de conformité. Qui le rate, rate du même coup toute conformité WCAG, aussi soigné que soit le reste du site.

S'y ajoute le contrôle. Savoir si une image possède un attribut alt est trivial pour une machine. En Allemagne, l'autorité de surveillance du marché MLBF utilise des scans automatisés pour ses pré-vérifications au titre du BFSG, la loi allemande sur l'accessibilité, et les rapports de test WCAG joints à certaines mises en demeure allemandes (Abmahnung) listent précisément ces constats détectables à la machine. La loi européenne sur l'accessibilité applique la même logique dans toute l'UE. Si vous vendez à des consommateurs allemands ou européens, le texte alternatif manquant est la partie la plus visible de l'obligation : trouvé en premier, contesté en dernier.

Techniquement, le texte alternatif est un attribut de l'élément img dans le HTML. Un lecteur d'écran le lit à l'endroit où les voyants voient l'image. Si l'attribut manque, beaucoup de lecteurs d'écran se rabattent sur le nom de fichier, et la photo produit devient un « IMG_4032.jpg » lu à voix haute. Qui l'a entendu une fois dans une démonstration de lecteur d'écran ne l'oublie plus.

Les règles de base : un bon texte alternatif en sept points

La référence qui fait foi est le tutoriel sur les images de la Web Accessibility Initiative du W3C. Ses règles essentielles tiennent en sept points :

• La fonction avant l'apparence : décrivez ce que l'image accomplit à cet endroit, pas chaque détail visible. Pour une icône de loupe dans un champ de recherche, « Rechercher » est juste, « loupe sur fond gris » ne l'est pas.
• Court et précis : une phrase concise comme règle générale. Ce qui demande plus de place appartient au texte environnant, pas à l'attribut alt.
• Supprimer « image de » et « photo de » : le lecteur d'écran annonce de toute façon les images comme des graphiques. « Photo d'une basket rouge » gaspille les trois premiers mots.
• Les images liées décrivent la destination : si le logo mène à l'accueil, le texte alternatif est « Vers l'accueil », pas « Logo ». C'est la cible qui compte, pas le motif.
• Les images décoratives reçoivent un texte alternatif vide : alt="" fait que les lecteurs d'écran sautent complètement l'image. Comment tracer la frontière, c'est plus bas.
• Les noms de fichiers ne sont pas des textes alternatifs : « header-final-v3.jpg » n'aide personne, recherche d'images comprise.
• Les graphiques complexes demandent plus : un diagramme reçoit un texte alternatif court avec le message principal, plus une description complète dans le texte environnant ou un tableau de données.

Le tableau montre ce que cela donne en pratique. Les cinq cas couvrent les types d'images les plus courants, de la photo produit au diagramme :

Le motif derrière les cinq lignes : un bon texte alternatif répond à la question de ce qu'un visiteur voyant retire de l'image à cet endroit. Ni plus, ni moins. C'est aussi pourquoi il n'existe pas de dictionnaire de textes alternatifs où piocher : la réponse dépend de la page, pas de l'image.

Le test du contexte : une photo, trois textes alternatifs corrects

L'erreur de raisonnement la plus fréquente consiste à croire qu'une image possède une description fixe et objective. Ce n'est pas le cas. Le tutoriel du W3C fait explicitement du contexte le critère déterminant : la même photo demande un texte alternatif différent selon la page, et parfois aucun.

Prenez une photo : une femme avec un casque-micro à un bureau. Sur la page contact d'un service client, c'est de la pure illustration, le texte alternatif reste vide. Dans l'article de blog sur la nouvelle responsable du support, la même photo devient informative : « Anna Berger, responsable du service client, à son poste de travail ». Et comme vignette cliquable menant au formulaire de support, le texte alternatif décrit la destination : « Vers le formulaire de support ». Trois pages, trois bonnes réponses, une seule image.

Décorative ou informative ? Comment trancher

Les images décoratives reçoivent un texte alternatif vide : alt="". Ce n'est pas de la négligence, c'est le balisage correct. Le lecteur d'écran saute alors complètement l'image, et personne ne perd de temps sur du remplissage. La différence avec l'attribut manquant est importante : sans attribut alt, beaucoup de lecteurs d'écran annoncent quand même l'image, souvent avec le nom de fichier. Vide veut dire explicitement vide, pas omis.

• L'image est-elle liée ou déclenche-t-elle une action ? Alors il lui faut toujours un texte alternatif qui nomme la destination.
• L'image contient-elle du texte, par exemple une bannière avec un code promo ? Alors le texte complet appartient au texte alternatif.
• Retirer l'image ferait-il perdre de l'information ? Alors elle est informative et demande une description.
• Le message de l'image figure-t-il déjà entièrement dans le texte environnant ? Alors l'image est le plus souvent décorative.
• Est-ce une photo d'ambiance, un motif, un séparateur sans message propre ? Texte alternatif vide, terminé.

Les textes alternatifs en boutique en ligne : là où l'argent est en jeu

Dans une boutique en ligne, le texte alternatif compte doublement. Juridiquement, parce que les boutiques B2C qui vendent à des consommateurs allemands relèvent du BFSG comme services de commerce électronique, que la loi européenne sur l'accessibilité étend la même obligation à toute l'UE, et que les photos produit sans texte alternatif comptent parmi les constats typiques des audits automatiques. Et commercialement, parce qu'un client aveugle sans texte alternatif ne sait tout simplement pas ce qu'il achète : la couleur, la coupe et la matière ne figurent souvent que sur l'image, pas dans la description produit.

En pratique : le texte alternatif d'une photo produit complète les données produit au lieu de les répéter. Si « Basket modèle Vento, blanche » figure déjà en titre à côté, le texte alternatif décrit ce que l'image apporte en plus, par exemple la vue de profil avec la semelle rouge. Avec cinq images de galerie du même produit, chaque texte alternatif nomme sa propre perspective : gros plan sur la couture, semelle vue de dessous, portée au pied. Cinq fois la même phrase n'aiderait personne.

L'effet SEO est réel, mais ce n'est pas un blanc-seing : les moteurs de recherche utilisent les textes alternatifs pour comprendre les images, de bons textes améliorent donc vos chances dans la recherche d'images. Mais bourrer « acheter baskets pas cher baskets homme baskets blanches » dans l'attribut alt n'aide aucun utilisateur et n'est pas de l'accessibilité, c'est du spam lu à voix haute. Rédigez le texte alternatif pour des humains, le moteur de recherche suivra.

Quand l'IA aide, et quand elle se trompe

La reconnaissance d'images par IA excelle dans ce qui épuise les humains : elle reconnaît les objets de façon fiable, produit une première phrase utilisable et le fait pour 500 photos produit aussi vite que pour cinq. Pour une boutique au catalogue qui a grossi au fil des ans, c'est la différence entre un projet de week-end et un projet de trimestre.

Ce que l'IA ne sait pas faire, c'est le contexte. Elle voit la photo, mais pas la page : elle ignore si la femme au casque-micro est une décoration, la nouvelle responsable du support ou un lien vers un formulaire. C'est précisément ce manque de contexte que critique Aktion Mensch, l'une des plus grandes organisations d'inclusion en Allemagne, chez les outils généralistes entièrement automatiques, et la critique est fondée. Elle vaut aussi pour les overlays d'accessibilité qui tentent de deviner les textes alternatifs manquants à la volée.

La méthode honnête compte donc trois étapes, et celle du milieu n'est pas optionnelle :

1. Générer un brouillon IA : chargez l'image dans le générateur de texte alternatif et recevez une proposition. Cela règle la reconnaissance d'objets et la première formulation.
2. Vérifier contre le contexte de la page : pourquoi l'image est-elle sur cette page ? Est-elle décorative, informative ou liée ? La description correspond-elle à la fonction ? C'est un humain qui répond à ces questions, pas un modèle.
3. Ajuster et adopter : ajouter la fonction, couper le superflu, et publier seulement ensuite.

Cela vaut expressément aussi pour notre propre générateur. Il produit des brouillons, pas des textes alternatifs finis, et nous ne le vendons délibérément pas autrement. Un outil qui promet de traiter les textes alternatifs de façon entièrement automatique, sans regard humain, promet quelque chose qui ne fonctionne pas avec la technique actuelle.

Questions fréquentes sur les textes alternatifs

Le texte alternatif est ce rare sujet d'accessibilité où l'effort et l'effet s'entendent bien : les règles tiennent sur une fiche, les lacunes se trouvent vite et se comblent vite. Faites scanner votre site une fois, traitez la liste avec brouillon IA plus regard sur le contexte, et vérifiez au passage vos documents PDF. Vos utilisateurs de lecteurs d'écran sentiront la différence dès la première visite.