Balise Alt :
6 conseils pour l’optimiser au maximum [+Exemples]

illustration de la balise alt en SEO

Vous souhaitez optimiser le SEO de vos images simplement ?
L ‘attribut alt aussi appelée à tort “balise alt” est un moyen efficace de le faire. 

Dans cet article, je vous explique pourquoi et comment bien rédiger cette balise en fonction du CMS que vous utilisez (WordPress, Wix, Shopify).

C’est parti. 

Définition de la Balise alt  

La balise ALT ou “attribut alt” est utilisée dans un code HTML pour décrire l’apparence et la fonction d’une image sur une page web. Concrètement, c’est un texte alternatif qui vient aider un moteur de recherche comme Google à mieux comprendre ce qu’est l’image en question. 

Pourquoi la balise alt est-elle importante ?

1-Amélioration du référencement des images

Il est plus que jamais essentiel de soigner le SEO de vos images. 

Selon Sparktoro, 22% des recherches sur Google sont des recherches d’images

➡️ Se retrouver dans les résultats de Google Images peut vous apporter beaucoup de trafic et mener à des conversions. 

Techniquement, le texte Alt fournit un meilleur contexte/une meilleure description de l’image aux robots d’exploration des moteurs de recherche, ce qui les aide à indexer correctement une image.

exemple d'une balise alt pour un produit

Par ailleurs, la recherche visuelle est en pleine explosion. L’application “Google Lens” peut identifier à présent plus d’un milliard d’objets.

Les résultats de recherche sont corrélés avec le SEO des images.

➡️ Vous l’avez compris, c’est un “quick win” à ne pas négliger

Que se passe-t-il si vous ne mettez pas de balise alt ?

Bien que la technologie de reconnaissance d’images des moteurs de recherche se soit considérablement améliorée au fil des ans, les robots d’exploration ne peuvent toujours pas “voir” les images d’une page Web comme nous le pouvons. 

Le risque ?

Que votre image ne soit pas référencée ou le soit pour un mot clé non souhaité…

Voici un exemple avec l’image ci-dessous : 

personnage de dwight dans the office

Si vous n’indiquez rien, Google peut décrire simplement l’image comme un homme avec une cravate. 

Par contre, si vous rédigez la balise alt suivante “Personnage de Dwight Schrute dans la série The Office”, vous aidez Google à comprendre exactement de quoi il s’agit avec à la clé un référencement dans Google Images: 

résultats dans google images

➡️ Attention toutefois, les images purement décoratives n’ont pas besoin d’être décrite.

2- Amélioration de l’accessibilité de votre page web

L’objectif initial (et toujours principal) est de décrire les images aux visiteurs malvoyants. En effet, ces derniers utilisent des lecteurs d’écran qui se basent sur les attributs alt pour décrire les images. 

Il est important de proposer la meilleure expérience possible pour TOUS les visiteurs. 

Comment bien rédiger une balise alt ?

1-Décrivez l’image aussi précisément que possible

Le texte alternatif est, avant tout, conçu pour fournir des explications textuelles des images aux utilisateurs qui ne peuvent pas les voir

Soyez (relativement) bref. Les lecteurs d’écran les plus populaires coupent le texte alt à environ 125 caractères, veillez donc à ne pas dépasser ce nombre de caractères.

➡️ Pour les images comportant du texte, le plus simple consiste à reprendre ce dernier dans l’attribut alt.

2-Insérez vos mots clés 

Intégrer votre mot clé cible principal dans une balise alt fait partie des bonnes pratiques en référencement naturel. 

➡️ Par exemple si vous écrivez un article qui cible le mot clé “marketing de contenu”, incluez ce dernier dans l’attribut alt d’au moins une image présente dans cet article. 

3-Évitez le bourrage de mots clés

Comme pour vos balises Title et méta description, évitez d’insérer une liste de mots clés à rallonge, ça ne fonctionne pas.

4-N’utilisez pas les images à la place du texte

Je le répète, un moteur de recherche sait lire du texte, mais ne voit pas les images comme un humain. Il faut donc privilégier le texte pour votre SEO et utiliser les visuels en complément. 

5-N’indiquez pas “image de“, “photo de“, etc. dans votre texte alternatif

Votre attribut alt fait référence à une image, il n’est donc pas nécessaire de le préciser.

6-Prévoyez une balise alt pour vos boutons sous forme d’image

Il est fréquent de voir des boutons/cta sous forme d’image.
Si c’est votre cas, n’oubliez pas de leur attribuer un attribut alt qui décrit la fonction du bouton, par exemple “recherche”, “postuler maintenant”, “s’inscrire”, etc.

3 exemples de bonnes balises alt

coq avec crète rouge chantant

❌ Mauvais texte alt : <img src=”bird.png” alt=”Coq”>

✔️ Bon texte alt : <img src=”bird.png” alt=”Coq à crête rouge chantant“>

couple discutant sur un escalator

❌ Mauvais texte alt : <img src=”escalator.jpg” alt=”couple discutant sur un escalator”>

✔️ Bon texte alt : <img src=”escalator.jpg” alt=”homme portant un sac à dos descendant un escalator“>

jupe noire avec motifs à fleurs blanches

❌ Mauvais texte alt : jupe noire

✔️ Bon texte alt : <img src=”jupe.png” alt=”jupe noire avec motifs à fleurs blanches“>

Comment mettre une balise alt sur WordPress ?

La solution manuelle

Pour remplir votre balise alt dans WordPress, rendez-vous dans “Médiathèque :

galerie d'images dans wordpress

Puis sélectionnez l’image souhaitée et remplissez le champ “texte alternatif” : 

champ texte alternatif dans wordpress

Lorsque vous rédigez un article ou une page, insérez une image grâce au bloc Gutenberg ou autre : 

bloc image gutenberg wordpress

Cliquez sur “Téléverser” ou “Médiathèque” pour sélectionner votre image :

téléverser une image dans wordpress

Puis remplissez le champ “texte alternatif”.

Automatiser le remplissage de la balise alt avec un plugin

Si vous avez des centaines d’images, il peut être très chronophage de les traiter une à une. 

Dans ce cas, l’utilisation d’un plugin comme BIALTY est recommandée. 

plugin wordpress bialty

Ce dernier ajoute automatiquement à vos images (de façon rétroactive) des textes alt à partir des titres de page / article / produit ou des mots-clés de Yoast.

Comment mettre une balise alt sur Wix ?

Rendez-vous dans votre Wix Pro Gallery :

  • Cliquez sur la galerie
  • Cliquez sur « Gérer les Médias »
  • Sélectionnez une image
  • Insérez votre Texte Alt sous le « Titre – Texte Alt »
  • Cliquez sur Ok
galerie d'images wix

Pour ajouter du Texte Alt à une seule image :

  • Cliquez sur l’image
  • Cliquez sur l’icône des paramètres
  • Entrez votre attribut Alt sous « Décrivez votre image pour Google – Ajouter du Texte Alt ici »
texte alt dans wix

Comment mettre une balise alt sur Shopify ?

Source: https://www.codeur.com/tuto/shopify/optimiser-shopify-referencement/ 

Sur les pages pré-enregistrées de Shopify

Rendez vous dans « Online Store » puis dans « Themes” et cliquez sur « Customize ».

changer balise alt dans shopify

Choisissez dans le menu déroulant une page puis allez dans une section avec une image, puis cliquez sur « Edit ».

remplir balise alt shopify

Rédigez votre balise Alt et cliquez sur “Save”.

Sur les pages produits

Rendez-vous dans « Products » puis cliquez sur un produit.

Dans la section Images, passez votre souris sur une image afin de voir les différentes options qui s’offrent à vous puis cliquez sur « Alt ».

modifier attribut alt dans shopify

Différence entre la balise alt, la balise Title et la légende d’une image

Un moteur de recherche type Google, Bing ou Yahoo ne sait pas lire les images.
Pour l’aider à comprendre de quoi s’agit un visuel, des balises avec du texte sont ajoutées dans le code HTML. 

Voici une explication des différences entre les balises existantes: 

La balise alt  

C’est une balise qui explique à Google le contenu et la fonction de vos images. Grâce à ce texte alternatif, le moteur de recherche contextualise l’image. 

Voici un exemple dans le code HTML: 

<img src=”glace.png” alt=”Glace à la vanille”>

À savoir : le texte alt s’affiche à la place de l’image si le fichier image ne peut être chargé.

La balise title

Il s’agit du titre de votre image qui servira au référencement dans les résultats du moteur de recherche. Ainsi si votre fichier à une balise title “glace-vanille” et qu’un internaute tape “glace vanille” dans Google, votre image à de grandes chances d’apparaître dans les résultats. 

➡️ Ce titre, tout comme le nom du fichier, doit contenir un mot clé court et descriptif. 

La légende d’une image

Tout comme l’attribut alt, la légende d’une image décrit plus en détail le visuel en utilisant des synonymes. Elle est aussi bien utile à Google qu’à l’internaute pour apporter des informations supplémentaires.

exemple d'une légende d'une image de fleurs

Partagez si vous aimez ❤️

À lire également : Comment optimiser l’accessibilité de son site ?

5 réflexions au sujet de “Balise Alt : 6 conseils pour l’optimiser au maximum [+Exemples]”

  1. Hello,
    dans le cas d’une page produit, si elle possède 2 ou 3 photos du produits en question, peut-on réutiliser le même texte alt en ajoutant simplement 2 / 3. Ou au contraire doit-on utiliser des mots-clés différents?
    Bonne journée.

  2. Bonjour Jay, le but de la balise alt est de décrire le contenu de l’image aux personnes malvoyantes et aux moteurs de recherche. Donc si les photos sont différentes, l’idéal est d’avoir une balise alt unique pour chacune . Par exemple :”baskets blanches de profil”, “baskets blanches de dessus”. Un chiffre n’apporte pas grand chose en terme de description.

  3. Hello,

    Merci pour cet article et les exemple.

    J’ai cependant remarqué une grosse coquille :
    « La balise alt aussi appelée “attribut alt” » 😱
    -> La balise ALT n’existe pas. C’est un attribut. Vous devriez donc dire : « l’attribut alt, aussi appelé à tort balise alt ».

    Enfin, il est important de préciser que dans un souci d’accessibilité il n’est important de décrire QUE les images nécessaires à la compréhension du contenu. Les images purement décoratives n’ont pas besoin d’être décrite.
    Là où en SEO il est utile de renseigner l’attribut alt de toutes les images.

  4. Bonjour Laurent,
    Merci pour vos précisions, vous avez raison, j’ai ajouté vos remarques à l’article.

  5. Bonjour Vlad.

    Merci pour ce retour.

    Par contre, je pense que vous êtes allé un peu vite : vous avez écrit « La balise alt aussi appelée à tort “attribut alt”».
    C’est l’inverse. ^^

    Comme je le disais, la balise alt n’existe pas, c’est un abus de langage.

    C’est certes un détail, mais je trouve ça dommage dans un article qui se veut pédagogue (et qui l’est) de ne pas utiliser la bonne terminologie.

Laisser un commentaire