Donner des textes alternatifs à tes images

Ça veut dire quoi ?

Un texte alternatif (qu’on appelle aussi « texte alt ») c’est une petite description écrite de ton image. Elle est là pour être vue si jamais l’image ne s’affiche pas, ou pour être lue à voix haute par un lecteur d’écran.

Cette alternative permet à tout le monde d’accéder à l’information que contient ton image et de comprendre son utilité.

Retour aux bases

Pourquoi ?

Mettre des textes alternatifs, c’est crucial pour plusieurs raisons :

Cela rend tes contenus accessibles à tous et toutes, en particulier aux personnes en situation de handicap visuel. Lorsque tes images délivrent une information importante, celle-ci doit être accessible par un autre biais. Imagine, certaines personnes n’ont pas l’image sous les yeux parce qu’elles naviguent vocalement, utilisent des outils de synthèse vocale, ou n’affichent pas les images du tout. Grâce au texte alt, elles ne manquent aucune information essentielle.
C’est aussi super utile si les images de ton site ne se chargent pas correctement, à cause d’une connexion internet lente ou d’un blocage par exemple. Ton site reste compréhensible même sans les visuels.
Et en bonus, c’est excellent pour ton référencement naturel (SEO) ! Google peut « lire » le texte alternatif de tes images, ce qui l’aide à mieux comprendre et donc à mieux référencer ton contenu.

Comment m’y prendre ?

L’idée n’est pas de décrire l’image dans les moindres détails, mais plutôt de faire passer son message principal ou son utilité dans le contexte de ta page.

Tu peux retranscrire le contenu ou le message essentiel de l’image directement dans le corps du texte visible, juste à côté. Si l’information est trop longue pour être succincte, tu peux la placer sur une page séparée et y faire un lien depuis l’image ou un texte à proximité.

Et si tu veux que le texte alternatif n’apparaisse que si l’image ne se charge pas, utilise l’attribut alt dans la balise <img>. Reste concis, l’alt doit être court (idéalement < 125 caractères). Et pour les images décoratives, laisse l’attribut vide (alt="").

Les astuces

N°1.

Ne propose pas de texte alternatif si l’image est purement décorative. Mettre un texte pour une image qui n’apporte aucune information pourrait faire l’effet inverse et perturber la lecture des vraies informations.

N°2.

Si tu utilises un CMS (comme WordPress, Wix, etc.), c’est très simple ! La plupart proposent directement un champ « texte alternatif » ou « description alt » lorsque tu ajoutes une image. N’hésite pas à consulter leur documentation pour voir comment ça marche chez eux.

Ressources & outils

WebAIM (Web Accessibility in Mind) : La référence légale.

Arbre décisionnel : “Dois-je mettre un texte alternatif ou non à mon image ?” (Anglais)

Guide : Comment écrire un bon texte alternatif ?

Guide : Comment je mets en place mon texte alternatif ?