Lazy Loading : le chargement différé des images WordPress
En bref
Le lazy loading (chargement différé) est une technique qui charge les images et vidéos de votre page uniquement quand le visiteur fait défiler jusqu’à elles. Au lieu de tout charger d’un coup, votre site charge d’abord ce qui est visible. Résultat : un affichage initial beaucoup plus rapide. WordPress l’active par défaut depuis la version 5.5.
Le principe du chargement intelligent
Imaginez que vous lisez un journal de 40 pages. Vous ne dépliez pas toutes les pages d’un coup sur la table — vous lisez page par page. Le lazy loading fonctionne de la même façon : votre site ne charge que ce que le visiteur voit à l’écran, puis charge la suite au fur et à mesure du défilement.
Sans lazy loading, une page avec 20 images les charge toutes simultanément, même celles tout en bas que personne ne verra peut-être jamais. C’est du gaspillage de bande passante et de temps de chargement.
Comment ça fonctionne techniquement
Le lazy loading repose sur un mécanisme simple. Au lieu de charger l’image immédiatement, le navigateur place un espace réservé (placeholder) à son emplacement. Quand le visiteur fait défiler la page et que l’image entre dans la zone visible (le « viewport »), le navigateur déclenche alors le téléchargement réel de l’image.
Depuis WordPress 5.5, l’attribut loading="lazy" est automatiquement ajouté à toutes vos images. Vous n’avez rien à faire : c’est activé par défaut.
Ce que le lazy loading concerne
- Les images : photos, illustrations, infographies intégrées dans vos articles et pages.
- Les iframes : vidéos YouTube, Google Maps, contenus embarqués de réseaux sociaux.
- Les avatars de commentaires : les Gravatars chargés pour chaque commentaire affiché.
Les bonnes pratiques
Le lazy loading est bénéfique dans la majorité des cas, mais il y a une exception importante : les images visibles immédiatement en haut de page (« above the fold »). Ces images-là doivent se charger tout de suite. Si vous les retardez, votre LCP (la métrique de vitesse de Google) en souffre. Les bons plugins de cache comme WP Rocket gèrent automatiquement cette exception.
Ce qu’il faut retenir
- Le lazy loading charge les images uniquement quand elles deviennent visibles à l’écran.
- WordPress l’active par défaut depuis la version 5.5 — vous n’avez rien à configurer.
- Ne pas appliquer le lazy loading aux images situées en haut de page.
- C’est un gain de performance gratuit et automatique pour tout site WordPress.