Référencer ses images : nom de fichier, texte alternatif et poids
Référencement images SEO : comment nommer vos fichiers, écrire un texte alternatif utile et alléger vos photos pour Google, les IA et vos visiteurs.
Une photo bien choisie fait vendre un plat, une coupe de cheveux ou une cuisine sur mesure. Mais pour Google et pour les assistants IA, une image reste un fichier muet tant que rien ne dit ce qu’elle montre. Le référencement des images tient à quatre réglages : un nom de fichier qui décrit la photo, un texte alternatif utile, un format moderne et un poids raisonnable. Voici ces quatre points, avec les règles de Google et de web.dev, et notre avis de studio.
Pourquoi le référencement des images compte
Les images comptent pour deux raisons : elles peuvent amener des visiteurs par Google Images, et elles pèsent lourd dans la vitesse de la page, qui compte elle-même pour le classement. Bien réglées, elles servent les deux à la fois.
Google l’écrit dans sa documentation : il extrait le sujet d’une image « à partir du contenu de la page, y compris les légendes et les titres », et conseille de placer les images « près du texte pertinent ». Une photo de votre salle de restaurant sous le titre « Notre salle », avec une légende courte, devient un vrai signal.
Une limite à connaître : Google « n’indexe pas les images CSS ». Une photo posée en fond de bloc par une règle de style n’existe pas pour Google Images, seules les balises <img> du HTML sont lues. Beaucoup de thèmes WordPress mettent la photo principale en fond. Les assistants IA (ChatGPT, Perplexity) lisent eux aussi ce texte, pas la photo.
Le nom du fichier : décrire, en minuscules, avec des tirets
Un bon nom de fichier dit ce que montre l’image en trois à six mots, séparés par des tirets, sans accents ni majuscules. Google donne l’exemple lui-même : « my-new-black-kitten.jpg vaut mieux que IMG00023.JPG », et déconseille les noms génériques comme « image1.jpg » ou « pic.gif ».
Le piège est le nom donné par le téléphone, « IMG_4821.HEIC », qui part tel quel sur le site, souvent par centaines. Trois règles suffisent :
- Un nom qui décrit la photo, pas la page :
salle-restaurant-terrasse-lyon.jpgplutôt queaccueil-1.jpg. - Pas d’espaces, pas d’accents, pas de majuscules. Les espaces deviennent
%20dans l’adresse. - Site en plusieurs langues : Google conseille de traduire aussi les noms de fichiers.
Notre avis : renommez les fichiers avant de les envoyer. Un renommage une fois l’image en ligne change son adresse, et Google conseille de référencer une image « toujours avec la même URL » pour la garder en cache.
Le texte alternatif : une phrase qui décrit, pas une liste de mots-clés
Le texte alternatif (l’attribut alt) décrit l’image pour qui ne la voit pas : un lecteur d’écran, un navigateur qui n’a pas chargé la photo, un robot. Il dit ce que l’image montre, en une phrase courte. La documentation de Google donne une échelle claire :
- Mauvais :
<img src="puppy.jpg"/>, sans attributalt. - Mauvais aussi : un
altdu type « chiot chien bébé chien chiots... ». Google parle de bourrage de mots-clés et prévient que cela « peut faire passer votre site pour du spam ». - Mieux :
alt="chiot". - Le meilleur :
alt="Chiot dalmatien qui joue à la balle".
Pour un artisan : alt="Cuisine en chêne massif avec îlot central, réalisée à Nantes", pas alt="menuisier nantes cuisine bois pas cher".
Le texte alternatif est aussi une question d’accessibilité
Le texte alternatif est le premier critère du référentiel français d’accessibilité. Le RGAA 4.1.2 demande, critère 1.1, que « chaque image porteuse d’information » ait une alternative textuelle, et au critère 1.3 que cette alternative soit « pertinente ». La règle internationale WCAG 1.1.1 dit la même chose. Deux cas particuliers :
- Les images de décoration (un motif, un filet, une icône qui double un texte) doivent être « correctement ignorées par les technologies d’assistance » (RGAA, critère 1.2). Concrètement : un
alt=""vide, pas unaltabsent. - Le texte dans une image (une affiche, une promotion faite dans Canva) doit, « si possible », être remplacé par du texte stylé (RGAA, critère 1.8). Google ne lit pas un prix écrit en pixels.
Nous détaillons les obligations dans notre guide sur l’accessibilité d’un site web en France. Pour les images, accessibilité et SEO sont la même action.
Le poids : format moderne, bonne taille, chargement différé
Une image doit être livrée à la taille où elle s’affiche, dans un format récent, et chargée seulement quand elle approche de l’écran. Le Web Almanac 2024 de HTTP Archive donne l’ordre de grandeur : en octobre 2024, la page mobile médiane pesait 2 311 Ko, dont 900 Ko d’images (2 652 Ko et 1 054 Ko sur ordinateur). Une seule photo de téléphone non retouchée dépasse souvent ce poids à elle seule.
Choisir le format
Selon web.dev, « WebP et AVIF offrent en général une meilleure compression que les formats plus anciens et devraient être utilisés quand c’est possible », et les navigateurs modernes les lisent. Google accepte dans la balise <img> les formats BMP, GIF, JPEG, PNG, WebP, SVG et AVIF.
| Type d’image | Format conseillé | Pourquoi |
|---|---|---|
| Photo (plat, salle, chantier, portrait) | AVIF ou WebP, JPEG en secours | Meilleure compression, qualité proche |
| Logo, icône, pictogramme | SVG | Net à toute taille, fichier très petit |
| Capture d’écran avec du texte fin | PNG ou WebP sans perte | Pas de flou sur les lettres |
| Animation courte | <video> muet en boucle | web.dev : le GIF est limité à 256 couleurs et bien plus lourd qu’une vidéo |
Livrer la bonne taille
Une photo de 4 000 pixels de large affichée dans une colonne de 600 pixels fait télécharger six fois trop. Google recommande les attributs srcset et sizes, qui proposent plusieurs tailles du même fichier, avec toujours un src classique en secours, car « certains navigateurs et robots ne comprennent pas ces attributs ». WordPress, Webflow ou Shopify le font d’eux-mêmes.
Réserver la place : largeur et hauteur
Chaque image doit porter ses attributs width et height. web.dev le dit sans détour : « Incluez toujours les attributs de taille width et height sur vos images et vidéos », ou réservez l’espace avec la propriété CSS aspect-ratio. Sans cela, le navigateur réserve zéro pixel, puis pousse le texte vers le bas quand la photo arrive. C’est ce saut que mesure le CLS, l’un des trois Core Web Vitals, avec un seuil « bon » à 0,1 ou moins.
Charger plus tard ce qui est plus bas
L’attribut loading="lazy" demande au navigateur de ne charger une image que lorsqu’elle approche de l’écran. Google confirme que cette méthode lui convient, parce qu’elle ne dépend pas d’un défilement ou d’un clic, que son robot ne fait jamais.
Deux réserves, de web.dev et de Google : ne différez jamais les images visibles à l’ouverture de la page, surtout la plus grande (celle qui compte pour le LCP), sinon vous ralentissez la page. Et si un script de votre thème gère le chargement différé, vérifiez dans la Search Console, avec l’outil d’inspection d’URL, que les adresses des images apparaissent dans l’attribut src du HTML rendu. Sinon, Google ne voit pas vos photos. Notre guide pour tester et corriger la vitesse d’un site montre comment les trouver.
Faut-il un sitemap d’images ?
Rarement pour un site vitrine : le texte autour des images et un bon alt suffisent. Le sitemap d’images sert aux sites avec beaucoup de photos, ou dont les images sont affichées par un script. Il liste, pour chaque page, les images que Google pourrait ne pas trouver seul, jusqu’à 1 000 par page. Le principe est expliqué dans notre guide sur le sitemap XML.
Ce que fait l’agence Resolve
Chez l’agence Resolve (Re:solve), les images passent par la même chaîne sur chaque site : renommées et redimensionnées avant l’envoi, exportées en AVIF et WebP avec un JPEG de secours, posées en balise <img> avec largeur, hauteur et srcset, et différées sous la ligne de flottaison. Le texte alternatif est écrit à la main : un outil qui le génère produit souvent des phrases vides.
Exemple générique : un cabinet de kinésithérapie avec trente photos de 4 Mo, nommées par l’appareil, en fond CSS. Après traitement, elles pèsent quelques dizaines de kilo-octets, portent un nom et une description, et existent pour Google Images. Nous ne promettons pas une position : nous enlevons ce qui empêchait d’être compris.
Pour savoir où en sont vos images, l’analyse gratuite de site de Re:solve relève les photos sans texte alternatif, les formats anciens et le poids de la page.
Questions fréquentes
Faut-il mettre le mot-clé de la page dans chaque texte alternatif ?
Non. Le texte alternatif décrit l’image, pas la page. Si le mot-clé décrit vraiment la photo, il y a sa place. Répété dans vingt images, il devient du bourrage, que Google cite comme à éviter.
Le titre de l’image (attribut title) sert-il au référencement ?
Google indique qu’il lit « les légendes et les titres » parmi le contenu de la page, mais le title n’apparaît qu’au survol de la souris. Mettez l’effort dans le alt et dans une légende visible sous l’image.
Dois-je convertir toutes mes anciennes images en WebP ou AVIF ?
Commencez par les images les plus vues : page d’accueil, pages de services, photos de produits. Convertir le reste est utile, mais le gain est plus petit, et vous pouvez le faire au fil des mises à jour.