Texte alternatif des images : écrire un bon attribut alt, du RGAA à WordPress

Accessibilité · Par la rédaction de Gabarit · Publié le 2026-10-31

Paire de lunettes à monture noire posée sur des pages imprimées — Lunettes de lecture. Photographie de Mari Helin-Tuominen, CC0 (Wikimedia Commons).

L'attribut alt est sans doute la règle d'accessibilité la plus connue, et l'une des plus mal appliquées. On le laisse vide quand l'image porte une information, on le remplit du nom du fichier, ou on y empile des mots-clés. Pourtant, la décision tient en une question : si l'image disparaissait, que perdrait la personne qui lit la page ? Voici comment y répondre pour chaque type d'image, ce que disent les référentiels, et où écrire ce texte dans WordPress.

Ce que disent les WCAG et le RGAA

Les WCAG 2.2 posent le principe dès leur premier critère, le 1.1.1 « Contenu non textuel », de niveau A : tout contenu non textuel présenté à l'utilisateur doit avoir un équivalent textuel qui remplit la même fonction, sauf exceptions (contrôles, contenus purement décoratifs, CAPTCHA, tests).

Le RGAA, référentiel français applicable aux services publics et à certaines entreprises (voir notre article sur ce que dit la loi française), consacre sa première thématique aux images. Dans sa version 4.1.2, elle compte neuf critères. Les trois premiers concernent toutes les pages :

Critère	Question posée par le RGAA
1.1	Chaque image porteuse d'information a-t-elle une alternative textuelle ?
1.2	Chaque image de décoration est-elle correctement ignorée par les technologies d'assistance ?
1.3	Pour chaque image porteuse d'information ayant une alternative textuelle, cette alternative est-elle pertinente ?

Les suivants traitent des CAPTCHA (1.4 et 1.5), des descriptions détaillées (1.6 et 1.7), des images texte (1.8) et des légendes (1.9). La différence entre les deux premiers critères est essentielle : le RGAA n'exige pas une alternative pour chaque image, il exige qu'on décide, image par image, si elle informe ou si elle décore.

Première étape : classer l'image

Le W3C propose un arbre de décision pour les alternatives textuelles. En simplifiant, il revient à se poser ces questions dans l'ordre :

L'image contient-elle du texte ? Si ce texte est déjà écrit à côté, l'image est redondante ; sinon, l'alternative reprend le texte de l'image.
L'image est-elle un lien ou un bouton ? L'alternative décrit alors l'action ou la destination, pas l'apparence.
Apporte-t-elle une information absente du texte ? Une photo d'un produit, un schéma, un portrait annoncé dans le texte : l'alternative transmet cette information.
Est-elle purement décorative, ou répète-t-elle ce que dit déjà le texte voisin ? Elle reçoit un alt="".
Est-elle complexe (graphique, carte, infographie) ? Une alternative courte l'identifie, et une description détaillée donne les données.

La même image peut changer de catégorie selon la page. Une photo de bureau en tête d'un article de conseils est décorative ; la même photo dans un article qui compare des aménagements de poste de travail porte une information.

Rédiger l'alternative d'une image informative

Une bonne alternative dit ce que l'image apporte dans son contexte, en une phrase ou moins. Quelques repères :

Pas de « image de » ou « photo de ». Le lecteur d'écran annonce déjà qu'il s'agit d'une image. Le type ne se précise que s'il compte (« capture d'écran de l'éditeur », « carte de France »).
L'information avant le détail. Pour une capture d'écran d'un réglage, « Panneau Typographie de l'éditeur de site, taille de police réglée sur Moyenne » sert mieux que la description des couleurs de l'interface.
Pas de répétition de la légende. Si une légende visible dit déjà tout, l'alternative peut être plus courte, ou vide si l'image n'apporte rien de plus. Le critère 1.9 du RGAA demande, lui, que la légende soit correctement reliée à l'image, par exemple avec figure et figcaption.
Pas de mots-clés. L'attribut alt est lu à voix haute ; un empilement de requêtes rend la page pénible et n'apporte rien au lecteur.

Les WCAG ne fixent pas de longueur maximale : une alternative de plusieurs phrases signale souvent qu'il faut une description détaillée à part.

Les images décoratives

Une image décorative doit être ignorée par les technologies d'assistance. En HTML, la méthode la plus sûre est un attribut alt présent mais vide, sans espace : alt="". Il ne faut pas supprimer l'attribut : en son absence, certains lecteurs d'écran annoncent le nom du fichier, du type « IMG_4021 point jpg ».

Les images de fond appliquées en CSS (background-image) ne sont pas restituées par les lecteurs d'écran. C'est un bon emplacement pour une texture ou un motif, mais un mauvais pour une image qui informe : son contenu serait perdu.

Images-liens, boutons et icônes

Quand une image est le seul contenu d'un lien, son alternative devient l'intitulé du lien. Un logo qui ramène à l'accueil s'annonce « Gabarit, accueil » plutôt que « logo » ; une icône de loupe qui lance une recherche s'annonce « Rechercher ». Si le lien contient déjà un texte visible, par exemple une carte d'article avec son titre, l'image peut recevoir un alt="" : sinon le lecteur d'écran annoncerait deux fois la même chose.

Les icônes en SVG intégré obéissent à la même logique avec d'autres attributs. Une icône décorative reçoit aria-hidden="true" ; une icône porteuse de sens reçoit role="img" et un nom accessible, par un élément title ou un attribut aria-label.

Images texte, graphiques et infographies

Le critère 1.8 du RGAA demande de remplacer, si possible, les images texte porteuses d'information par du texte stylé. Une citation mise en forme dans un visuel, un tableau de tarifs exporté en image ou un titre dans une police décorative se font aujourd'hui en HTML et CSS, avec une police web si besoin. Les logos font exception.

Pour un graphique, l'alternative courte dit de quoi il s'agit et, si possible, sa conclusion (« Évolution mensuelle des inscriptions à la lettre d'information sur un an : hausse continue ») ; la description détaillée donne les valeurs, de préférence dans un vrai tableau HTML placé sous le graphique ou dans une section dépliable. Les critères 1.6 et 1.7 du RGAA vérifient que cette description existe quand elle est nécessaire et qu'elle est pertinente.

Où écrire l'alternative dans WordPress

WordPress propose deux endroits, qui ne se comportent pas de la même façon.

La médiathèque. Chaque fichier a un champ « Texte alternatif ». Ce texte est repris automatiquement quand on insère l'image dans un contenu, et il sert aussi pour l'image mise en avant affichée par le thème.
Le bloc Image. Dans la barre latérale du bloc, le champ « Texte alternatif » vaut pour cette insertion seulement. Le texte est écrit dans le code de la page au moment de l'insertion : corriger plus tard le champ de la médiathèque ne modifie pas les articles qui utilisent déjà l'image. Il faut repasser sur chacun.

La même image peut ainsi avoir une alternative différente selon la page, ce qui correspond à la règle du contexte. Pour une image décorative, il suffit de laisser le champ du bloc vide ; WordPress produit alors un alt="".

Le thème a sa part de responsabilité. Les images qu'il affiche lui-même, comme les images mises en avant des cartes d'articles ou les illustrations des en-têtes, doivent recevoir une alternative cohérente avec leur rôle. Notre liste de vérification d'un thème détaille ce point, et l'article sur les images responsives rappelle que l'attribut alt reste le même quelle que soit la taille de fichier servie par srcset.

Vérifier une page en dix minutes

Lister les images de la page avec les outils de développement du navigateur ou une extension d'audit, et repérer celles qui n'ont pas d'attribut alt du tout.
Pour chaque alt renseigné, lire le texte sans regarder l'image : transmet-il l'information utile dans ce contexte ?
Pour chaque alt="", vérifier que l'image est bien décorative ou redondante avec le texte voisin.
Tabuler sur les liens et les boutons : chacun doit avoir un nom compréhensible, y compris ceux qui ne contiennent qu'une image ou une icône.
Écouter la page avec un lecteur d'écran (NVDA sous Windows, VoiceOver sur macOS et iOS) : c'est le moyen le plus rapide de repérer les noms de fichiers lus à voix haute et les alternatives en double.

Les outils automatiques détectent les attributs absents, pas les alternatives inadaptées : un alt="image" passe la plupart des tests automatiques. La pertinence reste une décision éditoriale.

Sources

DINUM, RGAA 4.1.2, critères et tests, thématique 1 « Images » (consulté le 31 octobre 2026).
W3C, Web Accessibility Initiative, « An alt Decision Tree », tutoriel Images.
W3C, Web Content Accessibility Guidelines (WCAG) 2.2, recommandation du 5 octobre 2023, critère 1.1.1 « Contenu non textuel ».