Balise alt WordPress : bons et mauvais exemples
La balise alt WordPress, ou texte alternatif, est une courte description de l’image, lue par un lecteur d’écran et qui aide Google à comprendre l’image. Vous la saisissez dans la Médiathèque ou dans le bloc Image. Un bon alt décrit ce que l’on voit en quelques mots. Un alt changé dans la Médiathèque ne corrige pas les images déjà insérées dans les articles.
Auteur: L’équipe TellMyShop. Un guide pour les propriétaires de sites WordPress et de boutiques WooCommerce : la cause, la correction manuelle et le même travail dans une conversation avec le chat.
Dernière mise à jour: · 6 min de lecture
Qui lit l’alt et pourquoi
L’alt a deux lecteurs. Le premier est une personne qui ne voit pas l’image : aveugle, malvoyante ou avec une connexion lente où l’image ne s’est pas chargée. Le lecteur d’écran lit l’alt à la place de l’image. Sans alt, elle entend souvent le nom du fichier, comme « IMG_4471 », ou rien.
Le second lecteur est Google. Selon les consignes de Google sur les images, l’alt est l’une des sources importantes d’information sur ce que montre une image, et il aide Google Images à l’afficher pour les bonnes requêtes. Google note aussi qu’un alt bourré de mots-clés nuit.
Ces deux besoins ne s’opposent pas. Un alt écrit pour une personne est en général bon pour Google aussi.
Bons et mauvais alt, avec des exemples
Les exemples viennent d’une boutique d’éclairage de jardin. Chaque mauvais alt a une erreur typique des sites WordPress.
| Image | Mauvais alt | Pourquoi il est mauvais | Bon alt |
|---|---|---|---|
| Lanterne sur une terrasse le soir | IMG_4471 | le nom du fichier ne dit rien | Lanterne en fer forgé allumée sur une terrasse en bois le soir |
| La même image | lanternes de jardin lanternes pas cher boutique lanternes | bourrage de mots-clés | comme ci-dessus |
| Propriétaire à une table avec des échantillons | l’image montre une femme | « l’image montre » est superflu, aucun contenu | La propriétaire de la boutique dispose des échantillons d’abat-jour sur une table d’atelier |
| Produit sur fond blanc | produit | trop général | Applique murale de jardin LED graphite, vue de côté |
| Ligne d’ornement entre deux sections | ligne | graphisme décoratif | alt vide |
| Graphique dans un guide | graphique | cache l’information | Graphique : consommation annuelle des lampes LED et halogènes, la LED consomme moins |
Plus souvent que de mauvais alt, on trouve des alt absents. Si le site a des centaines d’images sans description, commencez par celles des pages qui ont du trafic : les produits, la page des services, les articles les plus lus.
Quand l’alt doit rester vide
Le conseil « chaque image doit avoir un alt » est une simplification. Les graphismes qui ne font que décorer, comme les ornements, les fonds ou une icône à côté d’un texte qui dit la même chose, doivent avoir un alt vide. Le lecteur d’écran les ignore alors et ne fatigue pas l’auditeur avec la description d’une ligne décorative. C’est ce que recommande le tutoriel du W3C sur les images.
Un alt vide est différent d’un alt absent. Un alt vide dit « ce n’est qu’une décoration ». Un alt absent oblige le lecteur à deviner, souvent en lisant le nom du fichier.
Où saisir le texte alternatif dans WordPress
Vous avez trois endroits. Chacun fonctionne un peu différemment.
- Médiathèque. Médias → Médiathèque, cliquez sur l’image et tapez la description dans le champ Texte alternatif. WordPress enregistre la modification tout seul. Cet alt est proposé à chaque insertion de l’image et sert en général pour l’image mise en avant (plus de détails dans le guide de l’image mise en avant dans WordPress).
- Le bloc Image de l’éditeur. Sélectionnez l’image dans l’article et saisissez le Texte alternatif dans le panneau des réglages du bloc. Cette modification ne vaut que pour cet article. Vous trouverez la description du bloc dans la documentation du bloc Image.
- Images des produits WooCommerce. L’image principale et la galerie du produit viennent de la Médiathèque, vous y saisissez donc l’alt. Dans un thème courant, la fiche produit le reprend directement de la Médiathèque.
Le champ Titre de la Médiathèque est autre chose que l’alt. Le titre sert surtout à retrouver les fichiers et ne remplace pas la description pour un lecteur d’écran.
Le piège : les anciens articles ne voient pas le nouvel alt
C’est là que beaucoup de gens perdent du temps. Vous remplissez les alt dans la Médiathèque, vérifiez un ancien article, et le code source de la page a toujours un alt vide.
La raison est technique mais simple. Quand vous insérez une image dans un article avec l’éditeur de blocs, WordPress copie l’alt dans le contenu de l’article. À partir de là, l’article a sa propre copie. Un changement ultérieur dans la Médiathèque corrige les images mises en avant et les nouvelles insertions, mais ne modifie pas la copie dans les anciens articles.
Avec quelques articles, ouvrez chacun d’eux, sélectionnez l’image et corrigez l’alt dans le bloc. Avec beaucoup d’articles, commencez par ceux qui ont le plus de trafic.
Comment le chat remplit les alt par lots
La tâche « Textes alternatifs des images » de l’extension TellMyShop pour WordPress et WooCommerce commence par la Médiathèque. Votre chat (Claude ou ChatGPT) y trouve les images sans alt et propose une description pour chacune à partir du nom du fichier, du titre et de la page à laquelle l’image est rattachée. Pour les images de produits, il tient compte des données du produit. Quand il ne peut pas dire ce qu’il y a sur l’image, il ne devine pas et ajoute le fichier à une liste pour vous.
Vous: Complète les textes alternatifs manquants des images.
Votre chat: La Médiathèque compte 37 images sans alt. Les trois premières, pour que vous validiez le style :
Je ne peux pas décrire deux fichiers d’après leur nom et leur contexte, je vous les laisse donc. Le style vous convient ?
Vous: Oui, fais le reste.
Votre chat: Aperçu du lot : 35 alt. J’enregistre après votre « oui », et vous pouvez annuler tout le lot depuis l’historique des modifications.
Statut de la carte : attend votre « oui »lanterne-fer-forge-02.jpg
ancienne version : alt : aucun
nouvelle version : alt : Lanterne en fer forgé porte ouverte, vue de face
lanterne-verre-terrasse.jpg
ancienne version : alt : aucun
nouvelle version : alt : Lanterne en verre avec une bougie sur une table de terrasse
DSC_0193.jpg, rattachée au produit Petite lanterne suspendue
ancienne version : alt : aucun
nouvelle version : alt : Petite lanterne suspendue noire sur une chaîne
Dans la version gratuite TellMyShop Free, le chat montre la liste des images sans alt et des descriptions proposées. L’enregistrement demande TellMyShop Pro. Le chat modifie alors les alt dans la Médiathèque, jusqu’à 50 fichiers par lot, après votre accord sur l’aperçu. Les copies d’alt dans les anciens articles sont une modification séparée du contenu des articles : le chat peut les corriger dans les articles choisis, aussi avec un aperçu « avant → après » et la possibilité d’annuler.
Vous trouverez les détails et la liste d’inscription sur la page TellMyShop pour WordPress et WooCommerce, et les prix dans les tarifs. Les alt sont un point d’un bilan plus large du site, que nous décrivons dans le guide de l’audit SEO WordPress.
Un court aide-mémoire
Décrivez ce que vous voyez, comme vous décririez l’image à quelqu’un au téléphone. Évitez « l’image montre ». N’utilisez un mot-clé que s’il correspond à l’image. Donnez un alt vide aux graphismes décoratifs. Après des changements dans la Médiathèque, vérifiez aussi les anciens articles. Vous trouverez d’autres guides sur le blog.
Questions et réponses
Où saisir le texte alternatif dans WordPress ?
À deux endroits. Dans la Médiathèque, après un clic sur l’image, dans le champ Texte alternatif, et ce texte est alors proposé à chaque insertion de l’image. Ou dans le bloc Image de l’éditeur, dans le panneau des réglages du bloc, et vous changez alors le texte alternatif dans cet article seulement.
J’ai changé le texte alternatif dans la Médiathèque, mais l’article a toujours l’ancien. Pourquoi ?
Parce que l’éditeur de blocs enregistre le texte alternatif dans le contenu de l’article au moment où vous insérez l’image. Un changement dans la Médiathèque vaut pour les images mises en avant et les nouvelles insertions, mais ne corrige pas les images insérées auparavant. Dans les anciens articles, vous devez changer le texte alternatif dans le bloc Image ou dans le contenu de l’article.
Chaque image a-t-elle besoin d’un texte alternatif ?
Chaque image qui transmet quelque chose, oui. Les graphismes purement décoratifs, comme les lignes d’ornement ou les fonds, doivent avoir un alt vide pour que le lecteur d’écran les ignore. Un alt vide doit être une décision réfléchie pour un graphisme précis.
Faut-il mettre un mot-clé dans la balise alt ?
Seulement s’il décrit naturellement ce qui est sur l’image. Google met en garde contre le bourrage de mots-clés dans les alt. L’alt « lanterne de jardin en fer forgé sur une terrasse » vaut mieux que « lanternes de jardin lanternes pas cher boutique ».
Le chat reconnaîtra-t-il tout seul ce qu’il y a sur l’image ?
Le chat écrit le texte alternatif à partir du nom du fichier, du titre et de la page à laquelle l’image est rattachée. Quand ces données ne lui disent pas ce qu’il y a sur l’image, il ne devine pas. Ces fichiers vont sur une liste que vous décrirez.
WordPress est une marque de la WordPress Foundation. WooCommerce est une marque d’Automattic Inc. Claude est une marque d’Anthropic PBC. ChatGPT et OpenAI sont des marques d’OpenAI. TellMyShop n’est pas affilié à ces entreprises.