Temps de lecture 14 minute(s)
Ce qu’il faut retenir
- L’optimisation commence avant l’intégration : choisissez un format adapté, redimensionnez l’image à sa taille d’affichage et compressez-la sans dégrader sa lisibilité.
- L’attribut ALT doit décrire la fonction de l’image dans son contexte. Une image décorative reçoit un attribut vide
alt="", pas une liste de mots-clés. - Les images visibles dès l’ouverture de la page doivent être chargées rapidement ; le lazy loading est surtout utile pour celles situées plus bas.
- Il n’existe pas de poids idéal valable pour toutes les images : la bonne décision dépend de leur taille affichée, de leur rôle et de la qualité attendue.
Optimiser les images pour le SEO ne consiste pas simplement à renseigner une balise ALT ou à convertir tous les fichiers en WebP. Une image doit être utile, compréhensible, accessible et suffisamment légère pour ne pas ralentir la page qui l’accueille.
Le travail porte donc sur plusieurs niveaux : le choix du visuel, son format, ses dimensions, son poids, son intégration HTML et sa priorité de chargement. Ce guide présente une méthode concrète pour traiter ces points dans le bon ordre, sans appliquer mécaniquement les mêmes réglages à toutes les images.
Sommaire
Pourquoi optimiser les images pour le SEO ?
Les images peuvent enrichir un contenu, faciliter sa compréhension et attirer des visiteurs depuis Google Images. Elles peuvent aussi représenter une part importante du poids d’une page et retarder l’affichage de son contenu principal.
Leur optimisation agit ainsi sur trois dimensions complémentaires :
- la performance, en limitant les octets transférés et en chargeant chaque ressource au bon moment ;
- l’accessibilité, en fournissant une alternative pertinente lorsque l’image ne peut pas être perçue ;
- la compréhension du contenu, grâce au nom du fichier, au texte alternatif, à la légende et surtout au contexte éditorial qui entoure l’image.
Une image optimisée n’améliore pas automatiquement le classement d’une page. En revanche, elle évite de dégrader l’expérience, peut contribuer aux performances mesurées par les Core Web Vitals et aide Google à comprendre les visuels susceptibles d’apparaître dans ses résultats.
Le bon raisonnement
Ne cherchez pas à « faire du SEO » sur chaque image. Commencez par déterminer son rôle : informer, illustrer, décorer, servir de lien ou présenter des données. Les choix techniques et le texte alternatif découlent de cette fonction.
Comment optimiser une image avant sa mise en ligne ?
Une grande partie du travail doit être réalisée avant l’envoi dans WordPress ou dans un autre CMS. Corriger après publication des centaines de fichiers surdimensionnés est toujours plus coûteux que d’adopter une méthode simple dès le départ.
1. Vérifier que l’image apporte une information utile
Une image pertinente doit compléter le texte, montrer un produit, expliquer une étape, présenter un résultat ou aider le lecteur à se repérer. Ajouter un visuel générique uniquement pour occuper de l’espace augmente le poids de la page sans nécessairement améliorer sa valeur.
Placez l’image près du passage qu’elle illustre. Google utilise notamment le contenu environnant, la légende et les autres informations de la page pour comprendre son sujet. Un bon contexte éditorial est généralement plus utile qu’une répétition artificielle du mot-clé dans plusieurs attributs.
2. Adapter les dimensions à l’affichage réel
Une photographie de 4 000 pixels de large n’a pas besoin d’être envoyée dans cette définition si elle ne dépasse jamais 900 pixels dans la mise en page. Le navigateur peut certes la réduire visuellement, mais il doit quand même télécharger le fichier d’origine si aucune variante adaptée n’est prévue.
Avant l’intégration, identifiez la largeur maximale utile, en tenant compte des écrans à forte densité de pixels. Le CMS peut ensuite générer plusieurs tailles pour que le navigateur sélectionne la ressource la plus appropriée.
3. Choisir le format selon le type de visuel
Le meilleur format dépend du contenu de l’image, de la transparence, de l’animation éventuelle et du niveau de qualité attendu. WebP et AVIF offrent souvent une meilleure compression que JPEG ou PNG, mais la comparaison doit être faite sur vos propres visuels.
| Format | Usage courant | Point de vigilance |
|---|---|---|
| JPEG | Photographies et visuels comportant de nombreux dégradés | Compression avec perte ; à comparer avec WebP ou AVIF |
| PNG | Visuels nécessitant une transparence ou une restitution sans perte | Peut devenir très lourd pour une photographie |
| WebP | Photographies, illustrations et images avec transparence | Contrôler la qualité obtenue après conversion |
| AVIF | Images pour lesquelles une compression élevée est recherchée | Encodage plus lent et résultat à vérifier selon le visuel |
| SVG | Logos, pictogrammes et illustrations vectorielles | À sécuriser et à réserver aux contenus réellement vectoriels |
Les navigateurs modernes prennent largement en charge WebP et AVIF. Un fallback JPEG ou PNG peut rester utile si vous devez couvrir un environnement ancien ou particulier, mais il ne doit plus être présenté comme une obligation systématique. Le format est un moyen de réduire le poids, pas une finalité.
4. Compresser sans viser un seuil arbitraire
Il n’existe pas de règle universelle imposant qu’une image pèse moins de 100 Ko. Une vignette, une photographie pleine largeur et un schéma détaillé n’ont ni les mêmes dimensions ni les mêmes exigences de lisibilité.
La bonne méthode consiste à comparer plusieurs niveaux de compression et à retenir le fichier le plus léger dont la dégradation reste imperceptible dans les conditions réelles d’affichage. Vérifiez en particulier les textes intégrés dans les captures d’écran, les contours, les dégradés et les visages.
- Supprimez les dimensions inutiles avant de compresser.
- Choisissez le format en fonction du contenu du visuel.
- Comparez le rendu sur mobile et sur ordinateur.
- Automatisez la conversion si votre volume de publication le justifie.
5. Donner un nom de fichier descriptif
Préférez un nom court et compréhensible, comme audit-images-pagespeed.webp, à un identifiant tel que IMG_8472.webp. Les mots peuvent être séparés par des tirets et doivent décrire ce que montre réellement le fichier.
Il n’est pas utile d’accumuler des variantes du mot-clé. Le nom sert d’indication complémentaire ; il ne remplace ni le contexte de la page ni un texte alternatif correctement rédigé.
Comment rédiger l’attribut ALT d’une image ?
L’attribut alt fournit une alternative textuelle lorsque l’image ne peut pas être vue. Il aide les technologies d’assistance et peut également donner du contexte aux moteurs de recherche. Sa rédaction dépend toutefois de la fonction du visuel, pas seulement de ce qu’il représente.
Image informative
Décrivez brièvement l’information nécessaire à la compréhension du passage. Par exemple, pour une capture montrant un rapport PageSpeed Insights, « Rapport PageSpeed Insights signalant des images surdimensionnées » est plus utile que « Capture d’écran SEO ».
Image purement décorative
Utilisez alt="". L’attribut doit être présent mais vide afin que les lecteurs d’écran puissent ignorer l’image. Inventer une description ou répéter le mot-clé ajouterait du bruit sans apporter d’information.
Image utilisée comme lien ou bouton
Le texte alternatif doit indiquer la destination ou l’action, surtout si aucun libellé textuel n’accompagne l’image. Pour un logo qui renvoie vers l’accueil, « Accueil de Frédéric Kabouche » décrit mieux la fonction que la seule apparence graphique du logo.
Graphique, schéma ou image complexe
Un attribut ALT ne peut pas restituer un tableau de données ou un processus complexe. Donnez une alternative courte, puis rendez les informations importantes accessibles dans le texte voisin, une légende développée ou un tableau HTML.
ALT et mot-clé
Le mot-clé peut apparaître lorsqu’il décrit naturellement l’image dans son contexte. Il ne doit pas être ajouté de force ni répété dans toutes les illustrations. L’arbre de décision de la W3C Web Accessibility Initiative permet de choisir l’alternative adaptée au rôle du visuel.
L’attribut title d’une image est facultatif. Il peut afficher une information au survol dans certains environnements, mais il ne remplace pas l’attribut ALT et ne constitue pas une optimisation SEO prioritaire.
Comment intégrer des images responsive sans ralentir la page ?
Une image responsive permet au navigateur de choisir une ressource adaptée à la largeur d’affichage et à la densité de l’écran. Les attributs srcset et sizes évitent ainsi de livrer systématiquement la version la plus lourde.
WordPress génère généralement plusieurs variantes lors de l’import et renseigne automatiquement ces attributs. Il faut néanmoins vérifier que le thème ou le constructeur de pages ne force pas une image originale surdimensionnée.
Indiquer la largeur et la hauteur
Les attributs width et height permettent au navigateur de réserver l’espace nécessaire avant le téléchargement de l’image. Ils contribuent ainsi à limiter les déplacements de mise en page mesurés par le CLS. Le CSS peut conserver une présentation fluide avec une largeur maximale adaptée et une hauteur automatique.
Cette vérification complète plus largement l’optimisation des Core Web Vitals, car les images peuvent affecter aussi bien le LCP que le CLS.
Faut-il appliquer le lazy loading à toutes les images ?
Non. Le lazy loading diffère le chargement des images qui ne sont pas immédiatement visibles. Il est pertinent pour les visuels situés sous la ligne de flottaison, car il réduit les ressources demandées au chargement initial.
En revanche, l’image principale visible dès l’ouverture de la page peut être l’élément LCP. Lui appliquer loading="lazy" retarde sa découverte et peut dégrader la performance. Elle doit rester directement accessible dans le HTML et être chargée normalement. Dans certains cas, fetchpriority="high" permet d’indiquer sa priorité, mais cet attribut doit être réservé aux ressources réellement critiques.
- Image principale ou LCP probable : ne pas utiliser le lazy loading.
- Images situées plus bas : utiliser le lazy loading natif lorsque cela est pertinent.
- Carrousels et images injectées par un script : vérifier leur découverte et leur comportement réel.
- Toutes les images : éviter de multiplier les priorités élevées, qui finiraient par ne plus rien prioriser.
Comment faciliter la découverte des images par Google ?
Google doit pouvoir explorer l’URL du fichier et comprendre l’image dans le contexte de la page. Vérifiez que les ressources importantes ne sont pas bloquées par le fichier robots.txt, qu’elles disposent d’URL stables et qu’elles sont intégrées dans un HTML accessible au moteur.
Les bonnes pratiques de Google Images insistent également sur la qualité du visuel, sa proximité avec un texte pertinent, le nom du fichier et le texte alternatif. Une légende peut apporter une information utile au lecteur, mais elle ne doit pas répéter artificiellement l’attribut ALT.
Un sitemap d’images est-il indispensable ?
Pas systématiquement. Si les images sont déjà présentes dans des pages facilement explorables, Google peut les découvrir sans sitemap spécialisé. Celui-ci devient surtout utile lorsque les fichiers sont difficiles à trouver, chargés par des mécanismes particuliers ou très importants pour l’activité du site.
Sur WordPress, commencez par vérifier le fonctionnement du sitemap existant, l’indexabilité des pièces jointes et la façon dont le thème charge les médias. Cette démarche s’intègre à l’optimisation SEO globale d’un site WordPress.
Quel rôle jouent les données structurées ?
Certains balisages, notamment pour les produits, les recettes ou les actualités, utilisent une propriété image et peuvent rendre la page éligible à des présentations enrichies. Il ne s’agit pas d’ajouter systématiquement un objet Schema.org à chaque illustration, mais de fournir les images attendues par le type de contenu réellement présent.
Cache et CDN : sont-ils toujours nécessaires ?
La mise en cache évite de télécharger à nouveau une image inchangée lors des visites suivantes. Pour des fichiers statiques versionnés, une durée de cache longue est généralement pertinente. Si l’image change, modifier son URL ou son nom permet de faire récupérer la nouvelle version sans réduire inutilement la durée de cache de toutes les ressources.
Un CDN peut réduire la latence pour une audience géographiquement dispersée et automatiser le redimensionnement ou la conversion de formats. Il n’est toutefois pas obligatoire pour tous les sites. Avant d’ajouter un service, vérifiez le gain attendu, le volume d’images, la localisation du public, les coûts et la maîtrise des URL.
Comment contrôler l’optimisation des images ?
Un audit utile ne se limite pas à compter les attributs ALT manquants. Il doit identifier les images qui ont un effet réel sur l’expérience ou sur la découverte du contenu.
| Contrôle | Question à poser | Priorité |
|---|---|---|
| Image LCP | Est-elle découverte rapidement, sans lazy loading, et correctement dimensionnée ? | Élevée |
| Poids transféré | Le navigateur télécharge-t-il une image beaucoup plus grande que son affichage ? | Élevée |
| Dimensions HTML | L’espace est-il réservé avant le chargement pour limiter le CLS ? | Élevée |
| Texte alternatif | Correspond-il à la fonction réelle de l’image ? | Élevée pour les images informatives |
| Format et compression | Une variante WebP ou AVIF apporte-t-elle un gain visible ? | Moyenne à élevée |
| Nom de fichier | Le nom est-il lisible sans accumulation de mots-clés ? | Secondaire sur l’existant |
Commencez par PageSpeed Insights et les données de terrain des Core Web Vitals, puis inspectez les requêtes réseau dans les outils du navigateur. Un crawler permet de repérer les images lourdes, les dimensions manquantes et les attributs ALT absents, mais chaque anomalie doit ensuite être interprétée selon le contexte.
Pour la visibilité, la Search Console permet de comparer les performances issues de la recherche Web et de la recherche d’images. Suivez les impressions, les clics et les pages concernées après une modification importante, sans attribuer automatiquement chaque variation à un seul changement.
Checklist avant publication
1) image réellement utile ; 2) dimensions adaptées ; 3) format et compression vérifiés ; 4) nom de fichier descriptif ; 5) attribut ALT choisi selon la fonction ; 6) variantes responsive ; 7) largeur et hauteur indiquées ; 8) lazy loading réservé aux images hors écran ; 9) rendu contrôlé sur mobile.
Dans quel ordre corriger les images d’un site existant ?
Sur un site ancien, renommer tous les fichiers ou réécrire tous les attributs ALT n’est pas forcément le chantier le plus rentable. Il vaut mieux commencer par les pages qui génèrent du trafic, des conversions ou qui présentent des problèmes de performance.
- Repérez les pages dont le LCP est une image lente ou mal priorisée.
- Corrigez les fichiers surdimensionnés qui pèsent fortement sur le chargement.
- Ajoutez les dimensions manquantes responsables de déplacements visuels.
- Revoyez les attributs ALT des images informatives et des images-liens.
- Automatisez ensuite les formats, les variantes responsive et la compression pour les prochaines publications.
Cette hiérarchisation évite de consacrer du temps à des corrections marginales pendant que quelques images critiques continuent de ralentir les pages les plus importantes.
Pour conclure
L’optimisation des images pour le SEO repose sur un ensemble de décisions cohérentes. Le format et la compression réduisent le poids, les variantes responsive évitent les téléchargements inutiles, les dimensions stabilisent la mise en page et la priorité de chargement protège le LCP.
Le texte alternatif conserve un rôle essentiel, mais il doit être rédigé pour l’accessibilité et selon la fonction du visuel. En traitant d’abord les images qui affectent les pages stratégiques, vous obtenez des améliorations plus utiles qu’en appliquant une checklist identique à toute la médiathèque.
Foire aux questions (FAQ)
Quel poids doit faire une image pour le SEO ?
Faut-il mettre un mot-clé dans chaque attribut ALT ?
WebP ou AVIF : quel format choisir ?
Le lazy loading améliore-t-il toujours les performances ?
Passionné pas le SEO depuis 2004, je vous propose de mettre mes compétences à votre service.