Optimiser les images WordPress en 2026 : WebP, AVIF, lazy load et compression

Sur WordPress, les images sont le levier d’optimisation le plus impactant : 5 minutes d’optimisation sur les images peuvent faire gagner 20 points de PageSpeed. Voici la méthode complète pour 2026.

Les formats d’images en 2026 : JPEG vs WebP vs AVIF

Recommandation 2026 : servez AVIF en priorité avec WebP en fallback et JPEG en dernier recours via la balise <picture> :

<picture>
    <source srcset="image.avif" type="image/avif">
    <source srcset="image.webp" type="image/webp">
    <img src="image.jpg" alt="Description" width="800" height="450">
</picture>

Convertir les images WordPress en WebP/AVIF automatiquement

Plusieurs plugins WordPress gèrent la conversion automatique :

ShortPixel Image Optimizer

Convertit en WebP et AVIF, compresse les images existantes et futures, sert le bon format automatiquement. Version gratuite limitée à 100 images/mois, payant à partir de 4,99 $/mois (ou achat de crédits).

Imagify

Développé par l’équipe WP Rocket. Interface simple, compression agressive ou douce selon votre choix, conversion WebP incluse. 25 Mo gratuit par mois, puis à partir de 4,99 €/mois.

Squoosh CLI (avancé)

Pour une conversion batch sans plugin, utilisez Squoosh CLI en ligne de commande :

# Installer Squoosh CLI
npm install @squoosh/cli -g

# Convertir un dossier en WebP
squoosh-cli --webp '{}' ./wp-content/uploads/2026/

# Convertir en AVIF (plus lent, meilleure compression)
squoosh-cli --avif '{"quality":60}' ./wp-content/uploads/2026/

Lazy loading : charger les images uniquement quand nécessaire

Le lazy loading natif HTML5 permet de ne charger les images below-the-fold qu’au moment où elles approchent du viewport :

<!-- Images below-the-fold : lazy -->
<img src="image.webp" loading="lazy" width="800" height="450" alt="...">

<!-- Image LCP (au-dessus du fold) : eager + fetchpriority -->
<img src="hero.webp" loading="eager" fetchpriority="high" width="1200" height="630" alt="...">

WordPress 5.5+ ajoute loading="lazy" automatiquement à toutes les images. Vérifiez que votre image hero est bien en loading="eager" — certains plugins l’écrasent en lazy.

Images responsive : srcset et sizes

WordPress génère automatiquement plusieurs tailles d’images (thumbnail, medium, large, full) lors de l’upload. La balise srcset permet au navigateur de choisir la taille optimale selon la résolution de l’écran :

<img src="image-800.webp"
     srcset="image-400.webp 400w,
             image-800.webp 800w,
             image-1200.webp 1200w"
     sizes="(max-width: 768px) 100vw, 800px"
     width="800" height="450"
     alt="...">

Sur mobile, le navigateur chargera image-400.webp au lieu de image-1200.webp — économie de 60 à 80 % de poids.

Objectifs de poids par type d’image

Questions fréquentes sur l’optimisation d’images WordPress

AVIF est-il vraiment meilleur que WebP en 2026 ?

En qualité/poids, oui : AVIF compresse 40 à 55 % mieux que JPEG contre 25 à 35 % pour WebP. Mais l’encodage AVIF est 10 à 50x plus lent. Pour un site WordPress avec des centaines d’images, le plugin ShortPixel gère l’encodage côté serveur. Le support navigateur est à 93 % — suffisant pour l’utiliser avec WebP en fallback.

Mon plugin d’optimisation convertit en WebP mais Google ne voit pas l’amélioration — pourquoi ?

Vérifiez que votre serveur sert bien le WebP : dans Chrome DevTools → Network → filtrez par « Img » et vérifiez la colonne Type. Si vous voyez « jpeg » au lieu de « webp », le plugin ne fonctionne pas correctement ou Cloudflare sert une version cachée en JPEG.

Faut-il réoptimiser toutes les images existantes après avoir installé un plugin ?

Oui. La plupart des plugins d’optimisation proposent un « bulk optimization » pour traiter toutes les images déjà uploadées dans votre médiathèque WordPress. Cette étape est essentielle : vos nouvelles images seront optimisées automatiquement, mais les anciennes restent en JPEG lourd sans cette action.