Le SEO des images regroupe les optimisations qui permettent aux moteurs de recherche de bien comprendre vos images et de les charger rapidement. Du nom de fichier au texte alternatif, des formats modernes comme WebP et AVIF au chargement différé (lazy loading), chaque détail influence le trafic venant de Google Images ainsi que la vitesse générale de la page. Dans ce guide, nous décrivons le SEO des images étape par étape, avec un exemple pour chaque action.
Pourquoi le SEO des images est-il important ?
Les images ont deux effets distincts. Le premier est la visibilité : Google Images et les encadrés d'images dans la recherche classique constituent un canal distinct capable d'apporter des visiteurs ; pour les produits, les recettes, les lieux ou la décoration notamment, les internautes regardent d'abord l'image. Le second est la vitesse : dans la plupart des pages, les images représentent la plus grande part du poids total des données, et l'élément le plus volumineux de la page est souvent une image. Une seule image principale non optimisée peut dégrader la valeur LCP des Core Web Vitals et faire chuter les performances de toute la page.
Un troisième effet concerne l'accessibilité : le texte alternatif décrit l'image aux visiteurs qui utilisent un lecteur d'écran. Un bon texte alternatif sert à la fois l'utilisateur et le moteur de recherche.
Nom de fichier
Google se sert aussi du nom de fichier pour comprendre de quoi parle l'image. Des noms comme IMG_20260412_0043.jpg, générés par un appareil photo,
ne transmettent aucune information. Les règles sont simples :
- Utilisez des mots courts et significatifs qui décrivent l'image :
canape-gris-deux-places-angle.webp. - Séparez les mots par des tirets (-) ; le tiret bas (_) peut être interprété comme un mot collé.
- Préférez les minuscules et les caractères ASCII ; évitez les accents et les espaces.
- Ne bourrez pas le nom de mots clés :
canape-canape-canape-pas-cher.webpn'aide en rien.
| Mauvais | Bon |
|---|---|
IMG_0043.jpg | canape-gris-tissu.webp |
Nouvelle image (2).png | bureau-entree-lyon-2e.webp |
canape_pas_cher_canape_a_vendre.jpg | salon-angle-cuir.webp |
Comment rédiger le texte alternatif ?
Le texte alternatif (attribut alt) décrit le contenu de l'image avec des mots. Il s'affiche si l'image ne se charge pas, il est lu par les
lecteurs d'écran, et Google s'en sert pour comprendre le contexte de l'image.
- Décrivez l'image telle qu'elle est. « Barista préparant un café sur un plan de travail de cuisine » est un bon texte alternatif ; inutile de commencer par « image » ou « photo ».
- Restez bref. En général, moins de 125 caractères suffisent.
- Placez le mot clé naturellement. Si l'image concerne vraiment le sujet, le mot clé apparaît tout seul ; des listes ajoutées de force peuvent être considérées comme du spam.
- Laissez le texte alternatif vide pour les images décoratives (
alt="") afin que les lecteurs d'écran ne les lisent pas inutilement. Ne supprimez pas complètement l'attribut alt. - Transcrivez les images contenant du texte. Si l'image comporte un slogan ou un prix, reprenez-le dans le texte alternatif ou dans le texte de la page.
Exemple : sur une page produit, au lieu d'écrire alt="canape canape salon ensemble pas cher", écrivez
alt="Canapé gris à tissu, trois places, pieds en bois". La seconde version aide l'utilisateur et donne au moteur de recherche une
information plus précise.
Outre le texte alternatif, le texte qui entoure l'image, le titre et la légende (caption) aident Google à comprendre le contexte. Placer l'image à côté du paragraphe qui la concerne est bien préférable à la placer dans une zone sans rapport en bas de page.
Choix du format : JPEG, PNG, WebP, AVIF
| Format | Point fort | Quand l'utiliser ? |
|---|---|---|
| JPEG | Répandu, bonne compression pour les photos | Solution de repli pour les anciens systèmes |
| PNG | Sans perte, transparence | Logo, capture d'écran, graphique simple |
| WebP | Fichier nettement plus léger que JPEG/PNG, prise en charge de la transparence | Choix par défaut sûr pour la plupart des images |
| AVIF | Fichier généralement plus léger que WebP | Pages riches en photos ; prise en charge large, mais ajoutez un format de repli |
| SVG | Vectoriel, redimensionnable, très léger | Logo, icône, dessin simple |
Pour proposer plusieurs formats, vous pouvez utiliser l'élément <picture> : le navigateur choisit le premier format qu'il prend en charge ;
s'il n'en prend aucun, il se rabat sur la balise <img> qu'elle contient. Ainsi, les navigateurs compatibles reçoivent l'AVIF et les autres
reçoivent le WebP ou le JPEG.
Dimensions et compression
L'erreur la plus fréquente consiste à afficher une photo de 4000 pixels de large dans un cadre de 400 pixels. Le navigateur télécharge tout de même le fichier entier. Appliquez les mesures suivantes :
- Redimensionnez selon la taille d'affichage réelle. Pour le contenu d'un blog, une largeur de 800 à 1200 pixels suffit en général ; pour les écrans à haute densité, proposez le double de cette taille via
srcset. - Compressez. Pour les photos, une qualité de 75 à 85 réduit souvent nettement la taille du fichier sans différence visible à l'œil.
- Supprimez les métadonnées. Les données EXIF (position, appareil) alourdissent le fichier et représentent un risque pour la vie privée.
- Fixez une cible. En règle générale, gardez les images de contenu sous quelques centaines de Ko ; fixez une limite, même pour les grandes images de couverture.
Indiquez toujours les valeurs width et height dans le HTML. Le navigateur sait ainsi quelle place réserver à l'image avant son
chargement, et le contenu ne se décale pas pendant l'affichage de la page.
Images adaptatives : srcset et sizes
Envoyer la même image de 360 pixels de large à un téléphone et une version de 1920 pixels à un écran d'ordinateur est un gaspillage.
srcset permet de définir plusieurs versions de largeurs différentes, et sizes indique la part de l'écran que
l'image occupera ; le navigateur choisit alors le fichier le mieux adapté. Par exemple, produire trois versions de 480, 800 et 1200 pixels
suffit pour la plupart des blogs et des pages produits. Sur mobile, l'économie de données est nette, et cela se traduit directement par un LCP plus court.
Où placer l'image ?
Google déduit aussi le sujet de l'image du texte qui l'entoure. Placez donc l'image à côté du paragraphe qui traite du sujet qu'elle illustre, et ajoutez en dessous une courte légende qui la résume. Le titre de la section où figure l'image renforce son lien avec le sujet. Plutôt que d'utiliser des images d'archive soumises au droit d'auteur, privilégiez autant que possible vos propres photos : une image originale inspire davantage confiance à l'internaute et vous distingue des images génériques répétées partout.
Chargement différé (lazy loading) et CLS
Le chargement différé consiste à ne charger les images situées sous la ligne de flottaison qu'au moment où l'internaute s'en approche. Avec les navigateurs modernes, il s'applique avec un seul attribut :
<img src="kanepe.webp" alt="Canapé gris à tissu, trois places" width="800" height="600" loading="lazy">
- N'appliquez pas le chargement différé à l'image visible au premier écran (au-dessus de la ligne de flottaison). Si la plus grande image de la page arrive tardivement, le LCP se dégrade. Pour cette image, vous pouvez utiliser
fetchpriority="high". - Les images des galeries, des listes de produits et des parties basses des articles longs se prêtent parfaitement au chargement différé.
- Utilisez toujours
width/heightavec le chargement différé ; sinon, l'image chargée décale la mise en page. - Pour que Google puisse trouver l'image, utilisez une vraie balise
<img src>; les images définies uniquement en arrière-plan CSS peuvent ne pas être indexées dans la recherche d'images.
Pour en savoir plus sur les indicateurs de vitesse, consultez notre guide des Core Web Vitals.
Sitemap d'images et données structurées
Google trouve la plupart des images lors de l'exploration normale. Néanmoins, pour les galeries chargées par JavaScript ou les structures complexes, ajouter
les images à votre sitemap peut aider. Dans un sitemap standard, chaque <url> peut contenir des éléments <image:image>
et <image:loc> :
- Ajoutez l'espace de noms des images en tête du sitemap.
- Pour chaque page, listez les adresses des images qui y figurent.
- Soumettez le sitemap dans Search Console et vérifiez les erreurs.
- Assurez-vous que robots.txt n'interdit pas les images.
Pour les contenus tels que les produits, les recettes ou les articles, indiquer l'adresse de l'image dans les données structurées (schema) facilite son utilisation par Google dans les résultats enrichis. Pour l'usage de Search Console, consultez notre guide de démarrage.
Erreurs fréquentes sur les images
- Intégrer le texte dans l'image : écrire une information importante (prix, adresse, promotion) uniquement dans l'image empêche le moteur de recherche et le lecteur d'écran de la lire.
- Copier le même texte alternatif partout : pour les cinq images d'une galerie de produits, décrivez chacune (vue de face, de côté, détail) au lieu de répéter le même texte.
- Des images de couverture trop lourdes : un visuel plein écran pèse parfois plusieurs Mo au lieu de quelques centaines de Ko ; réduisez d'abord sa taille, puis revoyez la conception.
- Bloquer les images dans robots.txt : une règle qui interdit le dossier des images empêche vos images d'apparaître dans Google Images.
- Liens d'images cassés : les images déplacées ou supprimées renvoient une 404 ; réparez-les grâce à une exploration régulière.
Liste de contrôle et mesure
- Le nom de fichier est-il explicite, en ASCII et séparé par des tirets ?
- Le texte alternatif décrit-il l'image brièvement et naturellement ?
- Les images sont-elles au format WebP/AVIF ou dans un format approprié ?
- Ne charge-t-on pas de fichier plus grand que la taille d'affichage ?
- Les images situées sous la ligne de flottaison ont-elles
loading="lazy"? widthetheightsont-ils définis ?- Le sitemap d'images et robots.txt sont-ils corrects ?
Pour mesurer, PageSpeed Insights affiche directement les recommandations « Encoder les images efficacement » et « Dimensionner correctement les images ». Dans le rapport Performances de Search Console, en choisissant le type de recherche « Image », vous pouvez suivre séparément les impressions et les clics venant de la recherche d'images. L'amélioration de la vitesse liée à l'optimisation des images contribue aussi à réduire le taux de rebond.
Conclusion
Le SEO des images n'est pas une action unique, mais une habitude répétée sur chaque image : un nom de fichier significatif, un texte alternatif honnête, le bon format et la bonne taille, le chargement différé pour ce qui est sous la ligne de flottaison et, si nécessaire, un sitemap d'images. Le gain le plus important vient généralement des images les plus lourdes ; commencez donc par repérer avec PageSpeed Insights les quelques images les plus pesantes. Le résultat sera du trafic supplémentaire depuis Google Images et un site plus rapide. Le classement reste déterminé par les algorithmes de Google ; votre travail consiste à rendre vos images compréhensibles et légères.