Essentiel Mis à jour : 2025-05

WordPress FSE : gérer les alt au quotidien

Comment renseigner et vérifier les textes alternatifs dans la bibliothèque médias, les blocs Image et Galerie, les images à la une, et les widgets de navigation. Avec les automatisations possibles.

Table des matières

WordPress offre plusieurs points d’entrée pour gérer les textes alternatifs. Certains sont dans l’éditeur de blocs, d’autres dans la bibliothèque médias, d’autres encore dans les options du thème. Savoir où agir, et quand, fait la différence entre un site qui a des alt corrects et un site qui a des alt vides générés automatiquement.

La bibliothèque médias, le bon endroit

La bibliothèque médias est le point d’entrée le plus efficace pour gérer les alt. Un alt renseigné ici est réutilisé automatiquement chaque fois que cette image est insérée dans le contenu (dans les articles, les pages, les widgets, les blocs de navigation).

Accès : Médias → Bibliothèque → cliquer sur une image → champ “Texte alternatif” dans le panneau de droite.

Règle de base : renseigner le champ “Texte alternatif” à l’import de chaque image. Ne pas confondre avec “Légende” (texte visible sous l’image) ni avec “Description” (champ interne à WordPress, non affiché publiquement).

Champ WordPress          → Sortie HTML
─────────────────────────────────────────
Texte alternatif         → alt="..."
Légende                  → <figcaption>
Titre                    → title="" (attribut HTML title, non lu par les technologies d'assistance (AT))
Description              → non affiché publiquement

Le champ “Titre” est pré-rempli automatiquement avec le nom du fichier image. Il ne correspond pas à l’alt, c’est l’attribut title HTML, qui est affiché au survol de la souris mais ignoré par la plupart des lecteurs d’écran. Ne pas confondre “Titre” et “Texte alternatif”.

Le bloc Image : deux niveaux d’alt

Quand un bloc Image est inséré dans le contenu, WordPress utilise le texte alternatif de la bibliothèque médias par défaut. Mais l’éditeur de blocs permet de le surcharger localement.

Accès : sélectionner un bloc Image → panneau de droite → section “Paramètres de l’image” → champ “Texte alternatif”.

Ce champ local prend la priorité sur le champ de la bibliothèque médias pour cette instance spécifique. C’est utile quand la même image est utilisée dans des contextes différents avec des informations différentes.

<!-- Bibliothèque médias : alt="Logo de la commune de Nom_ville" -->

<!-- Bloc Image dans un article — contexte différent -->
<!-- alt local dans l'éditeur : "Le logo de la commune tel qu'il apparaissait en 1985" -->
<img src="logo-nom_ville.png"
  alt="Le logo de la commune tel qu'il apparaissait en 1985">

La case “Image décorative” : depuis WordPress 5.9, un bloc Image propose une case à cocher “Image décorative” dans le panneau de droite. La cocher génère automatiquement alt="" et cache le champ texte. C’est le mécanisme officiel pour les images décoratives avec le Full Site Editing (FSE).

Case cochée   → <img src="..." alt="">
Case décochée + alt rempli → <img src="..." alt="texte saisi">
Case décochée + alt vide   → <img src="..." alt=""> (WordPress génère alt vide depuis 6.1)

Le bloc Galerie : alt individuels obligatoires

Le bloc Galerie génère une grille d’images. Chaque image de la galerie utilise son texte alternatif de la bibliothèque médias, il n’y a pas de champ alt global pour toute la galerie.

Conséquence pratique : si les images d’une galerie n’ont pas de alt renseignés dans la bibliothèque médias, toute la galerie est en Non Conformité (NC).

Comment vérifier : en mode aperçu, inspecter le HTML généré avec les DevTools, vérifier que chaque <img> dans la galerie a un alt non vide (sauf les images réellement décoratives).

Piège fréquent : une galerie de photos d’un événement municipal avec alt="" sur toutes les images parce qu’elles ont été importées en masse sans renseigner les alt. En masse, WordPress ne remplit pas automatiquement le texte alternatif, c’est à renseigner image par image.

L’image à la une souvent oubliée

L’image à la une (featured image) d’un article ou d’une page est affichée différemment selon le thème, en haut de l’article, dans les listes d’articles, en bannière. Elle utilise le texte alternatif de la bibliothèque médias.

Deux situations fréquentes :

Situation 1 où l’image à la une est décorative : le thème affiche une bannière visuelle en haut de chaque article. Cette bannière n’ajoute pas d’information au contenu de l’article, elle est décorative dans ce contexte. alt="" est la bonne réponse.

Mais si la même image est aussi la photo principale d’une page “Nos événements” et qu’elle identifie visuellement l’événement, elle est informative dans ce contexte.

C’est la difficulté des images à la une : le même fichier peut être décoratif dans un contexte et informatif dans un autre. WordPress ne gère pas ce cas, l’alt est unique dans la bibliothèque médias. La solution est de renseigner un alt pertinent (pour le cas informatif) et d’accepter qu’il soit légèrement redondant dans le cas décoratif, ce qui est moins problématique que l’absence d’alt dans le cas informatif.

Situation 2 où l’image à la une est située dans les listes d’articles : dans une page d’archive ou une liste d’articles, l’image à la une est souvent dans un lien vers l’article. Si l’image est dans un lien qui contient aussi le titre de l’article, l’alt doit être vide pour éviter la double annonce.

<!-- ✗ Double annonce — titre dans le lien ET alt identique -->
<a href="/article/foire-aux-moules-2025">
  <img src="foire-moules.jpg" alt="Foire aux moules 2025">
  <h2>Foire aux moules 2025</h2>
</a>

<!-- ✓ alt vide — le titre du lien suffit -->
<a href="/article/foire-aux-moules-2025">
  <img src="foire-moules.jpg" alt="">
  <h2>Foire aux moules 2025</h2>
</a>

Certains thèmes gèrent automatiquement ce cas, à vérifier dans les DevTools.

Le bloc Navigation : logos et icônes

Le bloc Navigation de WordPress peut contenir un logo (bloc Site Logo) et des icônes de réseaux sociaux (bloc Icônes sociales).

Bloc Site Logo : WordPress génère automatiquement un alt basé sur le nom du site. À vérifier : si le nom du site est explicite (alt="Commune de Nom_ville"), c’est correct. Si le nom est une acronyme ou une abréviation (alt="CCCP"), l’expliciter dans la bibliothèque médias.

Quand le logo est dans le header et qu’il est un lien vers la page d’accueil, l’alt doit décrire la destination :

<!-- WordPress FSE génère souvent ceci -->
<a href="/" class="wp-block-site-logo">
  <img src="logo.png" alt="Commune de Nom_ville">
</a>

C’est conforme, le nom de la commune est suffisant pour identifier la destination.

Bloc Icônes sociales : WordPress génère des liens avec aria-label basé sur le nom du réseau (Facebook, Instagram…). Il ne mentionne pas l’organisation ni l’ouverture dans un nouvel onglet. À compléter via un filtre PHP ou un plugin d’accessibilité.

Vérifier les alt existants : méthodes rapides

Méthode 1 grâce à WAVE sur la page : l’extension WAVE affiche en overlay les alt de chaque image. Les images sans alt sont signalées en rouge, celles avec alt="" en icône verte “image décorative”.

Méthode 2 grâce à la DevTools Console : repérer toutes les images sans alt ou avec alt vide sur une page :

// Images sans alt (NC systématique)
document.querySelectorAll('img:not([alt])')
  .forEach(img => console.log(img.src));

// Images avec alt vide (décoratif — à vérifier)
document.querySelectorAll('img[alt=""]')
  .forEach(img => console.log(img.src));

// Images avec alt trop court (potentiellement insuffisant)
document.querySelectorAll('img[alt]')
  .filter(img => img.alt.length < 5 && img.alt !== '')
  .forEach(img => console.log(img.alt, img.src));

Méthode 3 avec un Plugin Accessibility Checker : des plugins comme WP Accessibility Checker (Equalize Digital) scannent tout le site et listent les images sans alt ou avec des alt potentiellement insuffisants. Utile pour un audit de masse avant livraison.

Automatisations : ce qui est possible et ce qui ne l’est pas

Ce que WordPress peut automatiser :

  • Pré-remplir le champ “Titre” avec le nom du fichier (fait par défaut)
  • Générer un alt vide sur les images décoratives cochées (WordPress 5.9+)
  • Réutiliser l’alt de la bibliothèque médias à chaque insertion (fait par défaut)

Ce qu’aucun outil ne peut automatiser :

  • Rédiger un alt pertinent : c’est une décision éditoriale, pas technique
  • Distinguer automatiquement une image décorative d’une image informative
  • Adapter l’alt selon le contexte d’utilisation de l’image

Les plugins de génération d’alt par IA (quelques extensions WordPress expérimentales) existent mais produisent des descriptions visuelles génériques, comme par exemple “Une femme souriante debout devant un bâtiment”, qui ne transmettent pas l’information éditoriale requise, ou encore “Marie Dupont, adjointe à la culture, devant la mairie de Nom_ville”. Ces outils peuvent être un point de départ, jamais une solution complète.

La seule automatisation efficace : former les personnes qui gèrent le contenu à renseigner l’alt à chaque import d’image. Un guide interne d’une page, plastifié à côté de l’écran de la secrétaire de mairie, vaut plus que n’importe quel plugin.

Récapitulatif : où agir selon le cas

SituationOù renseigner l’alt
Image réutilisée sur tout le site (logo, bandeau)Bibliothèque médias
Image dans un article ou une pageBibliothèque médias + surcharge dans le bloc si contexte différent
Image décorativeCase “Image décorative” dans le bloc Image
Image à la une dans une liste d’articles avec titrealt="", le titre du lien suffit
Image seule dans un lienAlt décrivant la destination, pas l’image
Galerie d’événementAlt individuel sur chaque image dans la bibliothèque médias

Critères RGAA : 1.1 (présence de l’alternative), 1.2 (images décoratives), 1.3 (pertinence de l’alternative).

La lettre de l'Atelier A11Y

Ressources pédagogiques, critères RGAA commentés et retours de terrain : une lettre mensuelle pour progresser sur l'accessibilité numérique, sans jargon.

  • Nouveaux articles et ressources pédagogiques
  • Critères RGAA décortiqués avec des exemples concrets
  • Bonnes pratiques et retours d'expérience terrain
S'abonner à la newsletter (s'ouvre dans un nouvel onglet)

Gratuit. Désabonnement possible à tout moment.