Base de connaissances — Définition
Optimisation des images
Optimisez vos images pour un site plus rapide : compressez, redimensionnez et servez du WebP pour améliorer vos Core Web Vitals et votre référencement.
Qu’est-ce que l’optimisation des images?
L’optimisation des images consiste à réduire le poids des fichiers d’images tout en préservant leur qualité visuelle, afin que le site Web de votre entreprise torontoise se charge rapidement et se classe bien dans les moteurs de recherche. Des images bien optimisées améliorent vos résultats aux Core Web Vitals, réduisent les coûts de bande passante et offrent une meilleure expérience utilisateur sur tous les appareils.
Les images représentent généralement de 50 à 65 % du poids total d’une page Web. Les images non optimisées sont la principale cause de lenteur des sites Web, et un site lent perd des visiteurs et des positions dans les résultats de recherche. Pour les entreprises de Toronto qui se font concurrence en recherche locale, l’optimisation des images influe directement sur leur classement Google par l’entremise des Core Web Vitals.
Techniques d’optimisation des images
1. Choisir le bon format
Choisissez le meilleur format d’image selon l’usage : JPEG pour les photos et les images complexes aux nombreuses couleurs, PNG pour les images qui exigent de la transparence ou des contours nets, comme les logos, WebP pour les navigateurs modernes (30 % plus léger que le JPEG, à qualité comparable) et SVG pour les icônes et les graphiques simples qui s’agrandissent sans perte de qualité. Le WebP est maintenant pris en charge par plus de 95 % des navigateurs et devrait être votre choix par défaut pour les images Web.
2. Compresser les images
La compression réduit le poids des fichiers sans nuire sensiblement à la qualité. La compression avec perte élimine une partie des données de l’image pour obtenir des fichiers plus légers — idéal pour les photos, où une légère perte de qualité est acceptable. La compression sans perte conserve toutes les données, avec une réduction de poids plus modeste — préférable pour les graphiques et les logos. Des outils comme TinyPNG et Squoosh, ainsi que des extensions WordPress comme Smush ou ShortPixel, automatisent la compression au moment du téléversement.
3. Redimensionner avant de téléverser
Ne téléversez jamais d’images plus grandes que nécessaire. Si votre site Web affiche les images à 800px de large, téléverser un original de 4000px gaspille de la bande passante et du temps de traitement. Redimensionnez vos images à leurs dimensions d’affichage avant de les téléverser. WordPress génère bien des versions plus petites, mais le fichier original reste stocké et il est tout de même servi dans certains contextes.
4. Mettre en place le chargement différé
Le chargement différé (lazy loading) reporte le chargement des images qui ne sont pas visibles à l’écran initial : elles ne se chargent qu’au fur et à mesure que l’utilisateur fait défiler la page. Cela réduit considérablement le temps de chargement initial et économise de la bande passante. WordPress intègre le chargement différé natif depuis la version 5.5 — il suffit d’ajouter loading="lazy" aux balises d’image ou de l’activer par l’entremise de votre thème ou de votre extension de mise en cache.
5. Utiliser des images adaptatives
Les images adaptatives servent des tailles d’image différentes selon la taille de l’écran du visiteur. WordPress génère automatiquement plusieurs tailles d’image et utilise les attributs srcset pour servir la version appropriée. Ainsi, les utilisateurs mobiles téléchargent des images plus légères, tandis que les utilisateurs sur ordinateur obtiennent les versions en pleine résolution.
6. Ajouter un texte de remplacement descriptif
Le texte de remplacement (texte alt) décrit les images pour les lecteurs d’écran et les moteurs de recherche. Rédigez un texte alt descriptif et pertinent sur le plan des mots-clés pour chaque image : il améliore l’accessibilité, aide Google à comprendre vos images et peut générer du trafic par Google Images. Pour les entreprises de Toronto, ajoutez un contexte local pertinent dans le texte alt lorsque c’est approprié.
L’optimisation des images et le référencement
Google utilise la vitesse des pages comme facteur de classement, et les images représentent la plus grande occasion d’amélioration. Optimiser vos images peut réduire le temps de chargement des pages de 30 à 50 %, ce qui améliore directement vos résultats aux Core Web Vitals. La recherche d’images génère aussi un trafic important : des noms de fichiers bien choisis, un texte alt descriptif et un contenu environnant pertinent aident Google à indexer correctement vos images. Pour les entreprises de Toronto, des images optimisées signifient des pages plus rapides, mieux classées et qui convertissent davantage.
Questions fréquentes
Quel est le meilleur format d’image pour un site Web?
Le WebP est le meilleur format pour la plupart des images Web : il est 30 % plus léger que le JPEG à qualité comparable et il est pris en charge par plus de 95 % des navigateurs. Utilisez le JPEG pour les photos si le WebP n’est pas possible, le PNG pour les images transparentes et le SVG pour les icônes et les logos.
Dans quelle mesure l’optimisation des images peut-elle accélérer une page?
L’optimisation des images réduit généralement le temps de chargement des pages de 30 à 50 %. Pour les pages riches en images, le gain peut être encore plus important. Combinées au chargement différé et à un CDN, des images optimisées peuvent faire passer une page de 5 secondes à moins de 2 secondes.
L’optimisation des images influe-t-elle sur le référencement?
Oui, de façon importante. Les images non optimisées ralentissent votre site, ce qui nuit à vos résultats aux Core Web Vitals et à votre classement Google. Le texte alt aide Google à comprendre les images pour les indexer. Des images bien dimensionnées et compressées améliorent à la fois l’expérience utilisateur et la performance dans les moteurs de recherche.
Ressources connexes
Pour en savoir plus : Learn images (en anglais) — web.dev.