Attribut Alt dans la balise HTML <img> : Présentation et conseils d'optimisation SEO

Le référencement naturel dans les moteurs de recherche nécessite l’optimisation de nombreux éléments. Par exemple, il va être essentiel de soigner votre rédaction, de travailler l’arborescence de votre site, d’acquérir des liens de qualité… mais avez-vous pensé à vos images ?

À l’heure actuelle, les moteurs de recherche n’arrivent pas encore à lire et interpréter le contenu présent dans vos visuels. Lorsque les différents robots visitent votre site et découvrent des images, il faut donc les aider !

Pour qu’ils puissent les identifier et les classer du mieux possible dans les résultats de recherche, l’élément le plus important à travailler est : l’attribut Alt.

Alors, à quoi sert-il ? Pourquoi est-il si important ? Comment l’optimiser ? Découvrez mes conseils pour travailler au mieux cet élément SEO.

Qu'est-ce que l'attribut Alt d'une image ?

L'attribut Alt est un élément présent dans le code HTML d’une page qui permet d’apporter une présentation succincte d'une image. Il est présent dans la balise <img> :

<img src=”fiche-image.jpg” alt=”balise alt de votre image”>

Il s'agit d'une description textuelle du visuel présent sur votre page. D'ailleurs, le mot « Alt » vient de l'expression : alternative text.

Le rôle principal de l'attribut Alt est de décrire le contenu d'une image sur une page Web. Lorsque les visiteurs ne peuvent pas la voir, ce texte est notamment présent pour apporter une idée de ce qui devrait théoriquement s'afficher sous leurs yeux.

Vous constaterez dans quelques instants que l'attribut Alt possède encore bien d'autres avantages…

La plupart des CMS vous permettent de renseigner facilement le champ de l’attribut Alt sans avoir besoin de coder.

Par exemple, sur notre solution e-commerce WiziShop, dès que vous ajoutez un bloc de mise en page qui possède une image, vous pouvez indiquer l’attribut Alt :

Un gestionnaire d’images qui répertorie l’ensemble de vos visuels vous permet également de définir les attributs Alt de chacun de vos visuels.

Attribut Alt et accessibilité

Initialement, l'attribut Alt n'a pas été créé dans le but d’améliorer le référencement de vos images mais pour répondre à une règle d’accessibilité et d’ergonomie.

Faciliter la visite des malvoyants sur votre site

L’attribut Alt est d’une aide précieuse pour les malvoyants.

Lorsque ces personnes naviguent sur Internet, étant donné qu'ils ne peuvent pas voir ce qui s'affiche à l'écran, leur navigateur est conçu pour lire oralement ce qu'ils devraient normalement percevoir.

Pour indiquer le contenu des images, l'attribut Alt leur est lu, au même titre que le reste de votre texte.

Il s'agit donc d'une aide précieuse pour que l'ensemble de votre public puisse avoir une idée concrète et précise de l'apparence de votre site Web.

Afficher le contenu de l'image lorsque le visuel ne se charge pas

Parfois, des problèmes techniques peuvent venir entraver le bon fonctionnement de votre site. Il arrive que vos visuels ne se chargent pas correctement sur l'écran de vos visiteurs.

Dans ce cas, l'attribut Alt permet de ne pas les laisser seuls face à des images qui n’apparaissent pas.

L'attribut Alt est un texte alternatif qui apparaît lorsque la photo prévue ne s'affiche pas correctement à l'écran. Il fournit donc une description aux visiteurs de ce qu'ils devraient voir. Il est donc une solution de secours en cas de bug technique (lenteur, indisponibilité du serveur, etc.).

Avec un bon attribut Alt, même en cas de souci et à défaut d'affichage correct, le visiteur est informé du contenu de l’image. L'attribut Alt est une attention supplémentaire pour fluidifier la visite de votre site.

Attribut Alt et SEO

En plus de satisfaire les visiteurs de votre page qui ne peuvent pas voir apparaître les visuels de votre site normalement, l'attribut Alt a aussi une vocation SEO.

Il contribue de façon directe à améliorer le référencement naturel et la visibilité des images de votre boutique en ligne sur les moteurs de recherche.

Pour en savoir plus sur le référencement de vos visuels, découvrez notre article complet sur le SEO des images.

Améliorer le référencement de l'image dans les résultats des moteurs de recherche

Selon l'étude de ViSenze, 62% des utilisateurs de la génération Z préfèrent utiliser la recherche d'images. Du côté des internautes, cette méthode de navigation est également de plus en plus plébiscitée.

Avec la recherche universelle, les images sont également présentes directement dans les résultats de recherche.

Il s'agit donc d'un levier de visibilité à ne pas négliger pour générer davantage de trafic vers votre site !

Pour afficher et classifier les images en bonne position, Google utilise le texte présent dans votre attribut Alt. Ce n’est pas le seul critère, mais c’est un des plus importants.

Comme je vous l’ai indiqué plus haut, Google n’a pas encore la possibilité de détecter le contenu des images présentes sur vos pages (enfin pour le moment…).

L'attribut Alt lui indique donc directement ce qui est présent dans l’image. Il s'agit d’une donnée que Google va directement analyser et utiliser.

Améliorer le référencement naturel de votre page

Les moteurs de recherche analysent vos pages dans leur ensemble. Chaque élément a son importance.

Plus votre page paraîtra organisée en respectant les normes HTML et en optimisant les différentes balises, plus cela sera bénéfique pour votre SEO. Voilà pourquoi, il est primordial d'ajouter l'attribut Alt sur vos images.

Si vous souhaitez en savoir plus sur la structure de votre page, je vous invite à lire nos articles sur la balise Title et la balise H1.

Cet élément va également permettre de contextualiser davantage le contenu de votre page pour mieux vous référencer. C’est un excellent moyen d'ajouter des mots-clés supplémentaires et de parfaire le champ lexical.

Si vous souhaitez en savoir plus sur la rédaction SEO, découvrez notre article.

Comment optimiser votre attribut Alt pour le SEO ?

Maintenant que vous avez pleinement conscience de son utilité, voyons comment optimiser au mieux votre attribut Alt pour que celui-ci vous apporte l'effet escompté.

Décrire le visuel tel que vous le voyez

Votre attribut Alt ne doit pas simplement décrire votre image en un seul mot. Il doit s'agir d'une description précise.

Pour rédiger votre attribut Alt, commencez par vous mettre à la place de votre lecteur. Qu'est-il censé voir apparaître à l'écran ? Positionnez-vous dans sa tête et essayez de lui décrire de façon précise votre visuel.

N'oubliez pas l'objectif principal de votre attribut Alt : il sert avant tout aux personnes qui ne peuvent pas visualiser l'image. Dans ce cas, l'attribut Alt doit leur permettre de l'imaginer.

Besoin d'un exemple pour y voir plus clair ?

Sur cette photo, si je vous dis simplement « gâteau », il est très difficile d'imaginer un visuel précis.

En revanche, si je vous dis « Part de gâteau au chocolat avec une fraise posée sur le dessus », l'image devient beaucoup plus claire.

Prenons un autre exemple :

Là encore, si j’annonce « voiture », il est assez compliqué de se représenter l’image.

Pour un attribut Alt optimisé, je vais plutôt renseigner : « Voiture Peugeot modèle 208 garée au milieu des montagnes enneigées »

Rester court pour décrire l'image

Même si je vous conseille vivement d'être précis pour décrire vos images, tâchez de rester concis. Ici, l'idée n'est pas d'écrire un roman. Tout est une question d'équilibre…

Le texte alternatif d'une image ne doit pas être un long paragraphe. Tout au plus, je vous conseille d'utiliser au maximum une centaine de caractères. C'est à la fois peu mais largement suffisant pour se donner une idée suffisamment précise de vos visuels.

Reprenons l'exemple des attributs Alt cités précédemment : « Part de gâteau au chocolat avec une fraise posée sur le dessus » fait 62 caractères, ce qui est largement suffisant pour se donner une idée du visuel qui aurait dû s'afficher.

L'attribut Alt est donc une simple phrase descriptive. Si vous préférez faire un paragraphe, mieux vaut ajouter une légende sous le visuel. Ces deux éléments n'ont pas la même fonction.

L'attribut Alt ne doit pas être une suite de mots clés

Comme je vous l'ai expliqué précédemment, l'attribut Alt joue un rôle dans le référencement de vos images. Il contribue à une meilleure visibilité de votre site et participe à la cohérence de vos pages.

Lorsque vous placez des images dans votre page, c’est qu'elles sont forcément en lien direct avec le sujet de votre contenu. Il est donc intéressant d'y insérer des mots clés lorsque c’est possible.

A contrario, ne vous obstinez pas à glisser un maximum de mots clés dans votre attribut Alt. Là encore, tout est une question d'équilibre et de cohérence avec le visuel.

S'il est pertinent de glisser votre mot clé principal dans votre attribut, placez-le, sinon inutile d'en abuser.

N'oubliez pas : l'attribut Alt est le texte que les internautes verront apparaître à l'écran à défaut de voir votre image. Il doit donc rester un élément agréable, lisible et logique.

Pour reprendre les exemples cités plus haut, évitez des attributs Alt comme :

• « gâteau chocolat recette chocolat cake chocolat fond moelleux facile rapide »
• « voiture peugeot 208 automobile voiture citadine neuve »
• …

Pensez à vos visiteurs et rédigez une phrase !

Unique pour chaque image

Comme pour chaque page de votre site, tous vos attributs Alt devront être différents étant donné que chaque image est différente.

Ce conseil peut sembler banal mais il s'avère parfois beaucoup plus difficile à respecter qu'il n'y paraît…

Si vous avez une boutique en ligne très spécialisée et comportant de nombreux produits quasi-similaires, il vous faudra être plus précis.

Par exemple, si vous vendez des chaussures de danse, évitez les attributs Alt du type « Chaussures de danse noires ». Vous risquez de tourner en rond et de ne plus avoir d'autres options pour varier les attributs Alt.

Préférez « chaussures de tango noires et pailletées avec un talon de 10 cm ». La précision est un précieux allié pour vous aider à varier les descriptifs de vos visuels.

Inutile de préciser dans l'attribut Alt « Image de… »

Enfin, sachez qu'il est inutile de débuter votre attribut Alt par les mots « image de… » ou « photo de… ».

Puisque votre description doit rester courte, ne vous encombrez pas de mots inutiles, n'apportant aucune plus-value à votre texte.

Par définition, il est déjà supposé que votre texte Alt fasse référence à une image. Inutile donc de l'expliquer et de le spécifier une seconde fois.

À ce jour, de nombreux éditeurs de sites Internet ne travaillent pas du tout les attributs Alt des images présentes sur leur site. Pourtant, il s'agit d'un élément susceptible de générer davantage de trafic sur votre boutique en ligne.

Réel apport pour les visiteurs comme pour le référencement, l'attribut Alt contribue grandement à l'amélioration de votre site Web.

Pour profiter de ce manque d’optimisation chez la concurrence, accordez-lui de l’attention ! La description de vos visuels est primordiale et le fait de tirer tout le potentiel possible de votre attribut Alt pourrait bien vous permettre de vous démarquer de vos rivaux.