ibin
Tous les articles

Comment rédiger de bonnes descriptions d’images

Ce qu’est le texte alternatif, qui l’utilise et comment l’écrire : une méthode simple, des exemples bons et mauvais, et où le saisir dans votre outil de création de site.

10 min de lecture

Chaque image de votre site peut porter une courte description écrite, appelée texte alternatif (ou « alt », de l’anglais « alternative text »). La plupart des visiteurs ne la voient jamais. Mais pour une personne aveugle qui utilise un lecteur d’écran (un logiciel qui lit l’écran à voix haute), cette description, c’est l’image. Une bonne description dit ce qu’un visiteur voyant saisit d’un coup d’œil. Une description absente ou bâclée laisse un trou, ou pire, une suite de caractères sans sens comme « IMG_4032.jpg ». Cet article explique qui utilise les descriptions d’images, propose une méthode simple pour décider quoi écrire et donne de nombreux exemples bons et mauvais, à reprendre tels quels. Il se termine par l’emplacement du champ de description dans les outils de création de site les plus courants.

Ce qu’est le texte alternatif et qui l’utilise

Le texte alternatif est un petit texte enregistré avec l’image dans le code de la page. Le navigateur ne l’affiche pas à l’écran, mais d’autres outils s’en servent :

  • Les utilisateurs de lecteurs d’écran. Les personnes aveugles ou malvoyantes entendent la description lorsqu’elles arrivent sur l’image.
  • Les personnes dont la connexion est lente ou limitée. Quand une image ne se charge pas, beaucoup de navigateurs affichent la description à sa place.
  • Les personnes qui désactivent les images pour économiser des données ou limiter les distractions.
  • Les moteurs de recherche. Google indique qu’il utilise le texte alternatif, avec l’image et le texte qui l’entoure, pour comprendre ce que montre une image. Voir les consignes de Google sur les images.

Les descriptions manquantes font partie des problèmes les plus fréquents sur le web. Dans le WebAIM Million 2026, un contrôle automatique d’un million de pages d’accueil, 53,1 % des pages contenaient des images sans texte alternatif. Bonne nouvelle : pas besoin de développeur pour cela. Dans la plupart des outils de création de site, vous ajoutez ou améliorez une description vous-même en une minute.

D’abord, décidez : à quoi sert cette image ?

Avant d’écrire quoi que ce soit, demandez-vous ce que fait l’image sur cette page. Le W3C, l’organisation qui élabore les standards du web, publie un arbre de décision pour le texte alternatif construit autour de cette question. En voici une version simplifiée.

  1. L’image contient-elle du texte ? La description reprend alors ce texte.
  2. Est-ce un lien ou un bouton ? Décrivez alors où il mène ou ce qu’il fait, pas son apparence.
  3. Apporte-t-elle une information à la page ? Décrivez alors cette information en une phrase courte.
  4. Montre-t-elle une information complexe, comme un graphique ou une carte ? Donnez une description courte et placez l’information complète sous forme de texte à proximité.
  5. Est-elle purement décorative, ou le texte voisin dit-il déjà la même chose ? Donnez-lui alors une description vide, pour que les lecteurs d’écran l’ignorent.

Une même photo peut demander une description différente selon la page. Une photo de plage est décorative dans un article de blog sur la gestion du temps, et essentielle sur la page de réservation d’une maison de vacances en bord de mer.

Images informatives : dites ce qui compte

La plupart des images sur le site d’une petite entreprise sont informatives : photos de produits, de vos locaux, de votre équipe, de vos réalisations. Décrivez ce qu’un visiteur a besoin de savoir, comme vous le feriez au téléphone avec un ami.

Photos de produits dans une boutique en ligne

Un client ne peut pas prendre le produit en main. La photo répond à des questions : quelle couleur, quelle forme, à quoi ressemble-t-il à l’usage ? Votre description doit répondre aux mêmes questions.

  • Mauvais : « produit1.jpg »
  • Mauvais : « Tasse »
  • Mauvais : « Meilleure tasse acheter tasse pas cher tasse céramique tasse cadeau mug café »
  • Bon : « Tasse en céramique faite main, vert d’eau, émail moucheté et anse large »

Si votre boutique montre plusieurs photos d’un même produit, donnez à chacune sa propre description : « La même tasse vue de dessus, avec le bord non émaillé », « La tasse tenue à deux mains, pour juger de sa taille ». Répéter cinq fois le nom du produit n’apprend rien de neuf à la personne qui écoute.

Une photo d’équipe

  • Mauvais : « Équipe »
  • Mauvais : « Groupe de personnes souriantes »
  • Bon : « Notre équipe de cinq personnes devant l’atelier, avec Lotte, la fondatrice, au centre »

Sur une page « À propos », qui figure sur la photo compte. Sur une page de recrutement, l’ambiance compte peut-être davantage : « L’équipe déjeune ensemble autour d’une longue table dans le jardin ».

Une photo qui plante le décor

Pour quelqu’un qui choisit un restaurant, la photo de la terrasse est une information : « Terrasse ensoleillée de huit tables sous un grand platane ». Le même genre de photo placé en fond derrière un titre est généralement décoratif.

Images fonctionnelles : logos, icônes et boutons

Quand une image est un lien ou un bouton, la description en est le nom. Un lecteur d’écran l’annonce comme « lien » ou « bouton », suivi de votre texte. Ce texte doit donc dire ce qui se passe quand on l’active.

  • Logo menant à la page d’accueil. Mauvais : « Logo ». Mauvais : « Logo feuille verte ». Bon : « Boulangerie Dubois, accueil ». Les gens savent que le logo en haut de page mène à l’accueil ; ils ont besoin du nom de l’entreprise.
  • Loupe sur un bouton de recherche. Mauvais : « Loupe ». Bon : « Rechercher ».
  • Icônes de réseaux sociaux. Mauvais : « Icône Instagram ». Bon : « Boulangerie Dubois sur Instagram ».
  • Une icône d’imprimante. Mauvais : « Imprimante ». Bon : « Imprimer cette recette ».

Si l’image se trouve dans un lien qui contient déjà un texte visible, comme une fiche produit avec une photo et le nom du produit, la photo peut souvent recevoir une description vide, pour que le nom ne soit pas lu deux fois. Notre guide de correction sur les textes de liens explique pourquoi les liens ont besoin d’un nom clair.

Images de texte, décoration et images complexes

Images de texte

Une bannière qui annonce « Soldes d’été, -20 % sur tout jusqu’au 31 août » est du texte, même si c’est une image. La description reprend les mêmes mots : « Soldes d’été, -20 % sur tout jusqu’au 31 août ». Mieux encore : placez ce texte sur la page en vrai texte, par-dessus l’image. Un vrai texte peut être agrandi, traduit et trouvé par les moteurs de recherche, et il reste net sur tous les écrans.

Images décoratives

Les textures de fond, les lignes de séparation, les formes abstraites et les photos d’illustration qui ne servent qu’à créer une ambiance sont décoratives. Elles reçoivent une description vide. Dans le code, c’est alt="", sans rien entre les guillemets. Ce n’est pas la même chose que l’absence totale de description : sans alt, certains lecteurs d’écran lisent le nom du fichier, exactement ce que vous voulez éviter.

Graphiques, schémas et cartes

Un graphique contient trop d’informations pour une seule description courte. Donnez-lui deux parties :

  1. Une description courte qui dit de quel type de graphique il s’agit et quel est son message principal : « Diagramme en barres : les commandes en ligne ont doublé entre 2024 et 2026 ».
  2. L’information complète sous forme de texte près du graphique, par exemple un court paragraphe ou un tableau avec les chiffres.

Cette version en texte aide bien plus de monde que les seuls utilisateurs de lecteurs d’écran. Beaucoup de lecteurs comprennent plus vite une phrase comme « Les commandes sont passées de 1 200 en 2024 à 2 450 en 2026 » que des barres.

Longueur, ton et erreurs à éviter

Il n’existe pas de longueur maximale stricte, mais les descriptions courtes fonctionnent le mieux. Une personne qui écoute ne peut pas survoler le texte, et le lecteur d’écran lit tout d’une traite. Visez une phrase, souvent moins de quinze mots. Certains outils fixent leur propre limite : Shopify accepte jusqu’à 512 caractères mais en recommande 125 au plus, et Squarespace en accepte 250.

Conseils de ton :

  • Écrivez dans la langue de la page, avec des mots simples.
  • Commencez par l’essentiel. « Manteau d’hiver rouge à capuche » vaut mieux que « Un manteau, qui est rouge, pour l’hiver et avec une capuche ».
  • Ne précisez le type d’image que s’il compte : « Peinture à l’huile du port », « Capture d’écran du formulaire de commande », « Carte dessinée à la main ».

À éviter :

  • « Image de » ou « photo de ». Le lecteur d’écran annonce déjà une image, si bien que la personne entend « image, image d’une tasse ».
  • L’accumulation de mots-clés. Une liste de termes de recherche est pénible à écouter et, selon Google, peut faire passer votre site pour du spam. Google cite lui-même une suite comme « puppy dog baby dog pup pups » comme mauvais exemple, et « Dalmatian puppy playing fetch » (un chiot dalmatien qui rapporte la balle) comme le meilleur.
  • Les noms de fichiers et codes d’appareil photo comme « DSC_0045 » ou « banniere-accueil-finale-v2 ».
  • La répétition mot pour mot de la légende ou du texte voisin. Si une légende sous la photo dit déjà « Lotte dans son atelier », la description peut ajouter autre chose ou rester vide.
  • Deviner ou inventer. Si un outil a rédigé une description pour vous, vérifiez-la. Les descriptions automatiques passent souvent à côté de l’essentiel, comme l’identité d’une personne.

Où saisir les descriptions dans votre outil

Les noms de menus changent de temps à autre et peuvent varier selon la langue de l’interface. Cherchez un champ appelé « Texte alternatif », « Alt » ou « Description de l’image » (en anglais « Alt text » ou « Alternative text »). Voici les emplacements actuels dans les outils les plus courants.

  • WordPress. Sélectionnez le bloc Image. Dans le panneau de réglages à droite, sous les réglages de l’image, saisissez le texte dans le champ « Texte alternatif ». Vous pouvez aussi le faire dans la Médiathèque : ouvrez une image et remplissez le texte alternatif dans le détail du fichier.
  • Shopify. Pour les photos de produits : allez dans Produits, ouvrez un produit, cliquez sur une photo pour ouvrir l’aperçu du média, choisissez l’option d’ajout de texte alternatif, saisissez et enregistrez, comme le décrit l’aide de Shopify. Les images de votre thème ont leur propre champ dans l’éditeur de thème, dans le réglage de l’image.
  • Wix. Dans l’éditeur, cliquez sur l’image, puis sur l’icône Paramètres, et remplissez le champ où Wix demande ce que montre l’image (en anglais « What’s in the image? »). Pour les galeries, ouvrez la gestion des médias et sélectionnez chaque image. Pour marquer une image comme décorative, Wix propose une case à cocher dans son assistant d’accessibilité. Voir l’aide de Wix sur les images.
  • Squarespace. Modifiez le bloc image et saisissez le texte dans le champ de texte alternatif de l’onglet Contenu. La page d’aide de Squarespace indique où trouver ce champ pour les galeries et les autres mises en page.
  • Créateurs de sites par IA comme Lovable, Bolt et v0. Pas de champ de formulaire : vous le demandez dans la conversation. Une consigne utile : « Liste chaque image de cette page avec son texte alternatif actuel. Propose une meilleure description pour chacune, selon ce qu’elle montre et la raison de sa présence. Marque les images décoratives pour un alt vide. Attends mon accord avant de modifier quoi que ce soit. » Notre guide pour les créateurs de sites par IA propose d’autres consignes prêtes à l’emploi.

Plusieurs de ces outils peuvent désormais proposer des descriptions grâce à l’IA. C’est un gain de temps, mais considérez chaque proposition comme un brouillon : l’outil voit des pixels, pas votre intention.

Comment ibin vous aide à repérer les descriptions faibles

Un contrôle automatique trouve les images sans aucune description, ainsi que les liens ou boutons faits d’une image sans nom. ibin les montre chacun avec un gros plan de l’endroit concerné sur la page et un guide de correction sur les descriptions d’images.

Ce qu’un contrôle automatique ne peut pas faire, c’est juger si une description est _juste_. « Tasse » passe tous les tests automatiques. C’est pourquoi ibin propose un second regard facultatif de l’IA. Il examine les images et leurs descriptions et note de 1 à 5 leur adéquation, en même temps que les textes de liens, l’usage au clavier et la clarté du langage. Considérez ces notes comme des pistes : elles vous indiquent les images à revoir en priorité, et c’est vous qui tranchez. Les contrôles automatiques trouvent environ un tiers à la moitié des problèmes d’accessibilité ; une personne doit donc vérifier le reste.

Vérifiez vos descriptions d’images

Contrôlez gratuitement une page avec ibin pour voir quelles images n’ont pas de description, puis demandez le second regard pour repérer celles qui méritent d’être améliorées. Commencez par votre page d’accueil et vos produits les plus vendus. En vous connectant, vous pouvez contrôler jusqu’à 200 pages du même site, et les guides de correction expliquent chaque solution pas à pas.

Voyez où en est votre site

Vérifiez gratuitement une page, sans compte. Vous recevez une liste claire de ce qu’il faut corriger en premier, avec des images de l’endroit où se trouve chaque problème.

Par exemple votreboutique.com. Une page prend environ 20 secondes, et c’est gratuit.

Continuer la lecture

Tous les articles