SEO des images
Les images pèsent dans deux directions : elles sont la première cause de pages lentes, et elles constituent une surface de recherche à part entière.
Pourquoi ce module existe
Format, dimensions, texte alternatif, données structurées — chacun est une action distincte parce que chacun échoue séparément.
Module O 18 actions n° 257 à 274 sur 410
-
257
Nommer les fichiers image de façon descriptive, avec des mots-clés : chaussure-running-bleue-profil.avif, et non IMG_2931.jpg
- Comment
- Avant de téléverser une image, renommez le fichier en minuscules avec des tirets, décrivant son contenu : chaussure-running-bleue-profil.avif.
- Mettez le sujet principal en tête, sans empiler de mots-clés.
- Gardez le même nom pour les variantes de taille (chaussure-running-bleue-profil-800.avif).
- Appliquez la règle aux nouvelles images ; ne renommez pas les images déjà indexées sans raison forte (action 273).
- À éviter
- IMG_2931.jpg, image1.png, capture-d-ecran-2026-09-14
- Des noms bourrés de mots-clés (chaussure-running-pas-cher-meilleure-chaussure.jpg)
- Des espaces et accents dans le nom de fichier
- Vérifier
- Screaming Frog → Images : les noms de fichiers des nouvelles images sont descriptifs.
- Aucune image téléversée ce mois-ci avec un nom par défaut d’appareil photo.
-
258
Écrire un texte alternatif précis, qui décrit l’image et son contexte sans bourrage de mots-clés : « Graphique : ventes de véhicules électriques aux États-Unis, 2020-2026 »
- Comment
- Écrivez l’alt comme si vous décriviez l’image au téléphone à quelqu’un qui ne la voit pas, dans le contexte de la page.
- Pour un graphique, indiquez le type et ce qu’il montre (« Graphique : ventes de véhicules électriques aux États-Unis, 2020-2026, en hausse chaque année »).
- Restez sous ~125 caractères, sans « image de » au début.
- Laissez alt="" pour les images décoratives.
- À éviter
- « voiture électrique pas cher meilleure voiture électrique »
- Un alt identique sur toutes les images d’un produit
- Un alt qui décrit l’image sans rapport avec la page
- Vérifier
- Screaming Frog → Images → Missing Alt Text et Alt Text Over 100 Characters : traités.
- Lecteur d’écran sur une page : les images sont compréhensibles dans leur contexte.
-
259
Ajouter une légende visible sur les images importantes (les légendes sont plus lues que le texte qui les entoure)
- Comment
- Pour les images qui portent une information (graphiques, photos de produit en situation, captures, schémas), ajoutez une légende visible.
- Utilisez <figure> et <figcaption>.
- Rédigez une légende qui dit ce qu’il faut remarquer ou retenir, pas seulement ce qu’on voit.
- Ajoutez la source ou le crédit dans la légende quand nécessaire.
- À éviter
- Une légende qui répète l’alt mot pour mot
- Des légendes sur des images décoratives
- Des légendes insérées en tant qu’image
- Vérifier
- Le HTML des images informatives utilise <figure> et <figcaption>.
- Chaque légende apporte une information ou un repère.
-
260
Servir des images nettes et en haute résolution ; éviter le flou et les artefacts (fuite : défauts DocumentPageImageQualityScores)
- Comment
- Exportez les images à la résolution nécessaire à leur plus grand affichage, multipliée par la densité d’écran (2× pour les écrans rétina), en partant d’un original de bonne qualité.
- Évitez de réencoder plusieurs fois une image avec perte.
- Contrôlez visuellement à 100 % : pas de flou, de pixelisation ou d’artefacts de compression.
- Remplacez les images de mauvaise qualité (captures floues, photos sombres) par des versions nettes.
- À éviter
- Agrandir une image trop petite : elle devient floue
- Compresser à une qualité trop basse pour gagner quelques Ko
- Réutiliser des vignettes comme images principales
- Vérifier
- Inspectez les images principales à 100 % et sur un écran haute densité : nettes.
- Largeur intrinsèque ≥ largeur affichée × 2 pour les images principales.
-
261
Utiliser des images uniques et originales autant que possible ; l’usage massif de banques d’images est un signal plus faible et redondant
- Comment
- Remplacez en priorité les images de banques d’images sur les pages importantes par des photos originales : équipe, locaux, produits réels, réalisations, captures de vos outils.
- Créez des schémas et graphiques propres à partir de vos données.
- Si vous utilisez une banque d’images, choisissez des images moins diffusées et retouchez-les (recadrage, contexte).
- Tenez un registre des images originales et de leurs droits.
- À éviter
- La même photo « poignée de main » que des milliers de sites
- Présenter une photo de banque comme votre équipe
- Utiliser des images sans droits
- Vérifier
- Recherche d’image inversée (Google Lens) sur les images des pages principales : peu ou pas d’autres occurrences.
- Registre des images avec origine et droits à jour.
-
262
Fournir un sitemap d’images (ou des <image:image> dans le sitemap) avec les images clés de chaque page
- Comment
- Ajoutez dans le sitemap existant l’espace de noms image (xmlns:image="http://www.google.com/schemas/sitemap-image/1.1") et, sous chaque <url>, un <image:image><image:loc>URL absolue</image:loc></image:image> par image importante.
- Ou générez un sitemap d’images séparé référencé dans l’index de sitemaps.
- N’incluez que les images de contenu (pas icônes, logos répétés).
- Vérifiez que les URLs d’images ne sont pas bloquées par robots.txt.
- À éviter
- Lister des images sur un CDN bloqué au robot
- Inclure toutes les icônes du gabarit
- Des URLs d’images relatives
- Vérifier
- Search Console → Sitemaps : le sitemap est lu sans erreur.
- Recherche Google Images avec site:votresite.com : les images clés sont indexées.
-
263
Garder l’image principale, la plus pertinente, en haut de page et dans le contenu principal
- Comment
- Placez l’image la plus représentative de la page dans le contenu principal, près du titre.
- Utilisez une balise <img> dans le HTML (pas un fond CSS) pour cette image.
- Donnez-lui un alt, une taille suffisante et la priorité de chargement si elle est dans le premier écran.
- Déclarez-la aussi comme image principale dans le schema (primaryImageOfPage ou image de l’Article/Product).
- À éviter
- Une image principale reléguée en bas de page
- Une image de couverture en arrière-plan CSS
- Plusieurs images concurrentes sans hiérarchie
- Vérifier
- Premier écran de la page : l’image principale y figure en <img>.
- L’image déclarée dans le schema est la même que celle affichée en haut.
-
264
Ajouter les métadonnées IPTC/ImageObject de licence et de créateur pour obtenir les badges d’images sous licence
- Comment
- Pour vos images originales, renseignez les métadonnées IPTC du fichier : Creator, Credit Line, Copyright Notice, Web Statement of Rights (URL de licence), Licensor URL (page pour obtenir une licence).
- Utilisez un outil comme ExifTool, Lightroom ou Photo Mechanic, et vérifiez que votre compression ne supprime pas ces métadonnées.
- Ou ajoutez ces informations dans le JSON-LD ImageObject (action 160).
- Créez réellement les pages de licence référencées.
- À éviter
- Des métadonnées effacées par l’optimisation d’image
- Revendiquer des droits sur des images qui ne vous appartiennent pas
- Des URLs de licence en 404
- Vérifier
- exiftool image.jpg : les champs IPTC sont présents dans le fichier servi en ligne.
- Google Images : badge « Licence » affiché sur vos images.
-
265
Renseigner og:image (1200 × 630) et twitter:image pour les aperçus sociaux et dans les résultats
- Comment
- Créez pour chaque page importante une image de partage de 1200 × 630 px, lisible en petit (texte court, contrasté).
- Déclarez-la dans og:image (URL absolue), avec og:image:width, og:image:height et og:image:alt.
- Ajoutez twitter:card summary_large_image et, si besoin, twitter:image.
- Générez-la automatiquement depuis le gabarit pour les articles si vous en publiez beaucoup.
- À éviter
- Une og:image en format carré ou vertical recadrée de façon absurde
- La même image générique sur toutes les pages
- Une image de plus de 5 Mo
- Vérifier
- Débogueur de partage Facebook et LinkedIn Post Inspector : image affichée correctement.
- Aperçu dans une messagerie (WhatsApp, Slack) : image et titre corrects.
-
266
Utiliser des images responsives avec srcset et sizes (c’est aussi un gain de vitesse)
- Comment
- Générez plusieurs largeurs de chaque image (par exemple 400, 800, 1200, 1600).
- Déclarez-les dans srcset avec les descripteurs w.
- Renseignez sizes selon la largeur réellement occupée dans la mise en page (sizes="(max-width: 760px) 100vw, 720px").
- Contrôlez que le navigateur télécharge la bonne taille à chaque largeur d’écran.
- À éviter
- Un srcset sans sizes : le navigateur suppose 100vw et télécharge trop grand
- Des variantes qui sont en fait le même fichier redimensionné par le HTML
- Oublier width et height
- Vérifier
- DevTools → Network à 390 px : l’image téléchargée a une largeur proche de 390 × densité, pas 1600.
- Lighthouse : « Dimensionner correctement les images » ne liste plus d’image.
-
267
Compresser vers les formats de nouvelle génération (AVIF, WebP) — voir le module D
- Comment
- Appliquez les réglages du module D (actions 49 à 52) à toutes les images de contenu : AVIF pour les photos, WebP en repli, JPEG en dernier recours.
- Utilisez <picture> avec <source type="image/avif"> et <source type="image/webp">.
- Automatisez la conversion au téléversement ou au build.
- Contrôlez régulièrement le poids des images des nouvelles pages.
- À éviter
- Téléverser des PNG de 3 Mo directement dans le CMS
- Convertir sans garder de format de repli
- Une conversion automatique désactivée après une mise à jour de plugin
- Vérifier
- DevTools → Network → Img : formats AVIF ou WebP servis.
- Poids des images de la page conforme aux budgets du module D.
-
268
Entourer les images d’un texte thématiquement pertinent ; Google se sert du contexte de la page pour classer les images
- Comment
- Placez chaque image à côté du texte qui en parle.
- Écrivez un titre de section, une phrase d’introduction et une légende en rapport avec l’image.
- Évitez les galeries sans texte sur les pages qui visent la recherche d’images.
- Utilisez des pages dédiées pour les images importantes (fiche produit, réalisation) avec leur description.
- À éviter
- Une galerie de 50 photos sans un mot de texte
- Des images insérées au hasard entre des paragraphes sans rapport
- Des pages images avec seulement un titre
- Vérifier
- Chaque image importante est entourée d’un texte qui décrit son sujet.
- Google Images : vos images apparaissent sur des requêtes liées au texte qui les entoure.
-
269
Éviter le texte dans l’image pour les contenus importants ; reprenez-le aussi en vrai texte HTML
- Comment
- Repérez les images qui contiennent du texte important : bannières, tableaux de prix, infographies, citations, menus.
- Reprenez ce texte en HTML sur la page (paragraphe, tableau, liste) ou remplacez l’image par du HTML stylé.
- Gardez l’image si elle apporte un intérêt visuel, avec le texte en HTML à côté.
- Pour les bannières, écrivez le texte en HTML par-dessus une image de fond.
- À éviter
- Des tarifs uniquement dans une image
- Un menu de restaurant en JPEG
- Un titre de page intégré dans l’image de couverture
- Vérifier
- Désactivez les images (ou lisez le code source) : toute l’information importante reste accessible en texte.
- Recherchez une phrase de ce texte dans Google : la page sort.
-
270
Donner un titre et un contexte descriptifs aux infographies, et une transcription HTML de leurs données
- Comment
- Donnez à chaque infographie un titre HTML descriptif et une phrase de contexte (ce qu’elle montre, source, date).
- Ajoutez sous l’infographie une transcription : les données principales en liste ou en tableau HTML.
- Mettez un alt court qui renvoie à la transcription (« Infographie : ventes 2020-2026, détail des chiffres ci-dessous »).
- Citez les sources des données.
- À éviter
- Une infographie sans aucun texte sur la page
- Un alt de 500 caractères qui recopie toute l’infographie
- Des chiffres sans source
- Vérifier
- Les données de l’infographie sont lisibles en HTML sous l’image.
- Recherchez un chiffre de l’infographie dans Google : la page sort.
-
271
S’assurer que les visuels importants sont explorables (<img src>, et non un fond CSS)
- Comment
- Repérez les visuels importants posés en background-image CSS (couvertures, photos produit, portfolios).
- Remplacez-les par des balises <img> (ou <picture>) dans le HTML, stylées avec object-fit: cover si besoin.
- Réservez le CSS aux motifs et fonds décoratifs.
- Vérifiez que les images chargées en JavaScript (sliders, lazy-load) ont bien un <img src> ou srcset dans le HTML rendu.
- À éviter
- Une photo produit en fond CSS : invisible pour Google Images
- Un lazy-load qui stocke l’URL dans data-src sans jamais la rendre au robot
- Un slider dont seule la première image est dans le HTML
- Vérifier
- Search Console → Inspection de l’URL → HTML rendu : les visuels importants sont des <img> avec src.
- Google Images site:votresite.com : les visuels principaux sont indexés.
-
272
Fournir un ImageObject dans le schema Product ou Article, avec un contentUrl en haute résolution
- Comment
- Dans le JSON-LD de chaque article ou produit, déclarez image comme un tableau d’URLs absolues ou d’ImageObject (url ou contentUrl, width, height).
- Fournissez une image en haute résolution (au moins 1200 px de large) et, si possible, plusieurs formats (16:9, 4:3, 1:1).
- Utilisez les mêmes images que celles affichées.
- Vérifiez qu’elles sont explorables et non bloquées.
- À éviter
- Un logo en guise d’image d’article
- Des images de 300 px
- Des URLs d’images qui redirigent
- Vérifier
- Test des résultats enrichis : aucune alerte sur la propriété image.
- Les URLs d’images du JSON-LD répondent 200 et correspondent aux images affichées.
-
273
Garder des URLs d’images stables ; ne renommez pas les fichiers à chaque déploiement (cela préserve le capital acquis en recherche d’images)
- Comment
- Figez l’URL de chaque image publiée : ne changez ni le nom ni le chemin à chaque déploiement.
- Pour le cache, versionnez par un paramètre ou un nom de fichier contenant un empreinte du contenu, qui ne change que si l’image change.
- Si vous devez déplacer des images (migration, CDN), redirigez en 301 les anciennes URLs vers les nouvelles.
- Évitez les URLs d’images signées ou temporaires pour le contenu public.
- À éviter
- Un build qui renomme toutes les images avec un horodatage
- Une migration vers un CDN sans redirection des images
- Des URLs signées qui expirent au bout de 24 h
- Vérifier
- Comparez les URLs d’images avant et après un déploiement sans changement d’image : identiques.
- Anciennes URLs d’images après migration : 301 vers les nouvelles.
-
274
Optimiser le cadrage des miniatures pour que le sujet soit centré et lisible (cela alimente les signaux de clic sur les images)
- Comment
- Pour chaque image importante, vérifiez son aperçu en petit (vignette de 150 px) : le sujet doit être centré et reconnaissable.
- Recadrez les images pour que le sujet occupe l’essentiel du cadre, sans détails parasites.
- Évitez que les recadrages automatiques (carré, 16:9) coupent le sujet : définissez le point focal (object-position ou réglage du CMS).
- Préférez un fond simple et un bon contraste.
- À éviter
- Un produit minuscule au milieu d’un grand décor
- Des recadrages automatiques qui coupent les têtes
- Des vignettes sombres ou peu contrastées
- Vérifier
- Réduisez les images principales à 150 px : le sujet reste identifiable.
- Search Console → Performances → type Image : CTR des pages concernées avant/après.
Continuer
Module suivant
← Module N / 21 actions
Entités, Knowledge Graph et E-E-A-T
Google rattache votre marque et vos auteurs à des entités qu’il connaît déjà. Ces actions rendent ce rattachement sans ambiguïté, et attachent…
Module P / 14 actions →
SEO vidéo
La vidéo se classe dans sa propre verticale, apparaît dans les résultats web, et est lue par les assistants IA à travers les transcriptions…