Convertir des photos en WebP et AVIF en ligne : accélérer le site et améliorer le SEO

En studio, nous préparons chaque jour des images pour des sites et des marketplaces et nous voyons à quel point le bon format change la vitesse de chargement. Dans cet article, sans eau, nous expliquons ce que sont WebP et AVIF, quand prendre quel format, comment ils influencent le SEO et comment convertir une photo en ligne en une minute.

Sur un site typique, les images représentent de 50 à 70 % du poids total de la page. Ni les scripts, ni les polices, ce sont bien les images qui tirent vers le bas le trafic et le temps de chargement. Quand nous optimisons des projets, la première chose que nous regardons, c'est dans quel format sont posées les photos. Et presque toujours, on y trouve le bon vieux JPEG ou, pire, un PNG lourd de 2 à 3 mégaoctets. Les formats modernes WebP et AVIF règlent ce problème à la racine : ils montrent la même image, mais pèsent une fois et demie à deux fois moins. Moins de poids veut dire chargement plus rapide, meilleures métriques de comportement et meilleures positions dans les moteurs de recherche. Ci-dessous, nous détaillons : de combien exactement les nouveaux formats sont plus légers, comment ils influencent les Core Web Vitals et le SEO, quels navigateurs les prennent en charge, quand utiliser quoi et comment convertir tout cela sans Photoshop ni ligne de commande.

WebP est un format de Google, apparu en 2010. Il utilise l'algorithme de compression du codec vidéo VP8 et sait travailler aussi bien avec perte de qualité (à la place du JPEG) que sans perte (à la place du PNG). Sa propriété principale : à qualité visuellement égale, un fichier WebP pèse en moyenne 25 à 35 % de moins qu'un JPEG et 25 à 30 % de moins qu'un PNG. En bonus, WebP prend en charge la transparence (canal alpha) et l'animation, il peut donc aussi remplacer le GIF, avec un gain de poids considérable.

AVIF est un format plus jeune basé sur le codec vidéo AV1, ouvert et gratuit. Il compresse plus agressivement que WebP : sur les mêmes photographies, AVIF donne des fichiers 40 à 50 % plus légers qu'un JPEG, parfois davantage. AVIF tient mieux les dégradés (ciel, fond flou, peau), ne donne presque pas les artefacts carrés caractéristiques et prend en charge une plage dynamique étendue (HDR, couleur sur 10 à 12 bits). La contrepartie : l'encodage AVIF est plus lent, et les vieux appareils et navigateurs ne le comprennent pas.

Pour rendre cela plus parlant, voici des chiffres typiques de notre pratique. Une photo de produit de 1200 sur 1200 pixels :

• JPEG qualité 85 pèse environ 280 à 350 Ko ;
• WebP de la même qualité visuelle pèse 180 à 230 Ko, une économie d'environ 30 % ;
• AVIF pèse 130 à 170 Ko, une économie de 45 à 55 %.

Sur une page de catalogue avec 30 à 40 images de ce type, la différence passe des kilooctets aux mégaoctets, et l'utilisateur en connexion mobile le sent aussitôt. Nuance importante : l'économie dépend du contenu. Sur des photos complexes et détaillées (texture de tissu, feuillage), le gain est moindre ; sur des images simples aux aplats et dégradés, il peut au contraire atteindre 70 %. Nous conseillons donc de ne pas croire les promesses moyennes, mais simplement de passer vos vrais fichiers dans un convertisseur et de comparer le poids. Cela se fait en ligne en une minute : vous chargez un JPEG, obtenez les deux formats et voyez vous-même combien pèse chacun.

La vitesse du site n'est pas un confort abstrait, mais un facteur de classement direct. Les moteurs de recherche tiennent compte de la rapidité et de la stabilité de chargement d'une page. Google a formalisé cela dans un jeu de métriques, les Core Web Vitals, et les images influencent presque chacune d'elles.

LCP (Largest Contentful Paint), c'est le temps d'affichage du plus grand élément de la zone visible. Sur la plupart des sites, cet élément est justement une image : la bannière principale, la photo de produit, la couverture d'un article. Plus ce fichier est léger, plus tôt il s'affiche. Remplacer un JPEG par un AVIF pour l'image LCP retranche souvent 0,5 à 1,5 seconde sur mobile. Google considere comme bon un LCP jusqu'à 2,5 secondes, et c'est souvent le passage de la photo principale au format moderne qui sort la page de la zone rouge vers la verte.

CLS (Cumulative Layout Shift), c'est le décalage de la mise en page pendant le chargement. Le format d'image en soi n'influence pas le CLS, mais une habitude liée compte : indiquez toujours les attributs width et height de la balise img, pour que le navigateur réserve la place à l'avance. Des AVIF légers chargent plus vite, le contenu se fixe plus tôt, il y a moins de sauts.

INP et réactivité générale gagnent indirectement : moins d'octets à charger veut dire moins de charge sur le réseau et le processeur, surtout sur les smartphones d'entrée de gamme.

Ce que cela donne pour le SEO en pratique :

• la page entre dans la zone verte des Core Web Vitals, un plus pour le classement dans les résultats mobiles ;
• un taux de rebond plus bas, parce que les gens ne quittent pas une page lente avant son chargement ;
• une meilleure indexation, le robot parcourt plus facilement un site léger dans son budget de crawl ;
• une conversion plus élevée, selon les études chaque 100 ms de chargement en trop rogne sensiblement les ventes.

Notons à part une erreur fréquente : les gens mettent du WebP, mais oublient le chargement paresseux (loading="lazy") pour les images sous le premier écran et le fetchpriority="high" pour l'image LCP principale. Le format et ces attributs fonctionnent ensemble. Et encore : ne compressez pas jusqu'à rendre les artefacts visibles à l'oeil, la sur-optimisation nuit à la confiance dans le produit autant qu'un chargement lent. Quand il faut tenir une limite précise, par exemple 200 Ko pour les exigences d'une plateforme, il est plus pratique de passer par une compression de photo dédiée.

La question principale des webmasters : le site ne va-t-il pas casser pour une partie des visiteurs. Réponse par les faits, à l'horizon 2026.

WebP est pris en charge par absolument tous les navigateurs actuels : Chrome, Firefox, Safari (depuis la version 14, soit 2020), Edge, Opera, ainsi que les navigateurs mobiles sur Android et iOS. La couverture dépasse globalement 97 % de l'audience. En pratique, cela veut dire que WebP peut être servi à tous sans arrière-pensée, le risque de croiser un utilisateur sans prise en charge est minime.

AVIF est plus jeune, mais déjà massivement pris en charge : Chrome et Edge depuis 2020, Firefox depuis 2021, Safari depuis la version 16 (2022). La couverture globale est d'environ 93 à 95 % et continue de croître. Ne prennent pas en charge AVIF seulement les versions très anciennes de navigateurs et certains environnements d'entreprise restes sur des systèmes obsolètes.

La bonne approche, qui lève entièrement la question de la compatibilité, c'est la balise picture avec plusieurs sources. Le navigateur choisit lui-même le premier format qu'il comprend et retombe sur le JPEG s'il ne prend rien de nouveau en charge. Le principe est le suivant :

• on propose d'abord au navigateur une source en AVIF ;
• s'il ne comprend pas, on propose une source en WebP ;
• s'il ne la comprend pas non plus, on charge une img ordinaire en JPEG comme repli.

Avec ce schéma, les navigateurs modernes reçoivent le format le plus léger, et les anciens voient le JPEG habituel sans rien casser. C'est le standard de référence, et nous le recommandons justement pour les sites commerciaux où chaque pour cent d'audience compte.

À part, un mot sur les plateformes et services où vous chargez des photos au lieu de les servir depuis votre serveur. Là, tout est plus strict :

• les marketplaces comme Amazon, eBay et Leboncoin acceptent le JPEG et le PNG dans les fiches produit, on ne peut pas y charger de WebP ni d'AVIF. Ces formats sont pour votre propre site, pas pour la marketplace ;
• les portails administratifs et officiels attendent eux aussi du JPEG ou du PNG en résolution et poids donnés ;
• les réseaux sociaux et messageries recompressent eux-mêmes ce que vous chargez, il est donc inutile de leur donner de l'AVIF.

Conclusion simple : WebP et AVIF sont un outil pour votre site, votre landing, votre blog. Pour les marketplaces et les portails officiels, gardez du JPEG à la bonne taille.

Il existe plusieurs façons, voyons-les de la plus rapide à la plus complexe, en signalant tout de suite les pièges.

Méthode 1 : convertisseur en ligne (recommandé pour la plupart)

La voie la plus rapide, sans installer de logiciel ni connaître la console. Marche à suivre :

• ouvrez un outil de conversion en WebP et AVIF ;
• glissez-y une photo ou un dossier de photos ;
• choisissez le format (les deux d'un coup, possible) et le niveau de qualité ;
• téléchargez le résultat et comparez le poids avec la source.

Cela prend moins d'une minute et convient quand il faut préparer une dizaine d'images pour un article ou une landing. Les fichiers sont traités directement dans le navigateur, les originaux ne partent nulle part.

Méthode 2 : outils de construction du site

Si vous avez un CMS ou un générateur statique, il existe le plus souvent un plugin ou un module qui sert lui-même du WebP et de l'AVIF et pose la balise picture. C'est la bonne voie pour un grand site aux milliers d'images, car la conversion se fait automatiquement au chargement.

Méthode 3 : ligne de commande

Pour les développeurs, il existe les utilitaires cwebp et avifenc, qui lancent une conversion par lot par script. Puissant, mais cela demande de la compétence et du temps de configuration.

Maintenant, les erreurs fréquentes que nous rencontrons sans cesse :

• Conversion depuis un JPEG déjà compressé. Si la source est surcompressée, le WebP ne fera que figer les artefacts au lieu de les enlever. Prenez l'original de qualité maximale ;
• Qualité trop basse pour le poids. Une qualité de 60 et moins donne de la saleté et du flou, surtout sur le texte et les logos. Le couloir optimal pour la photo est 75 à 85 ;
• Remplacer un PNG à transparence par un JPEG. Le JPEG ne sait pas gérer la transparence, le fond deviendra blanc. Pour les images transparentes, prenez du WebP ou de l'AVIF sans perte ;
• Absence de repli. Vous n'avez posé que de l'AVIF sans balise picture, et une partie des utilisateurs voit des trous à la place des images ;
• Oubli des métadonnées. L'EXIF ajoute du poids inutile et révèle parfois la géolocalisation. Avant publication, il vaut mieux nettoyer ces données.

Un convertisseur en ligne couvre 90 % des tâches : passer une dizaine de photos en WebP, compresser une bannière, préparer des images pour un article. Mais il y a des cas où il vaut mieux confier le travail. Le premier, ce sont les grands catalogues : quand vous avez des centaines ou des milliers de photos de produits et qu'il faut non pas seulement convertir, mais aussi détourer le fond, aligner sur une grille, ajouter des ombres et de l'infographie. Là, un travail manuel à la chaîne sans perte de qualité prime sur la vitesse d'un clic. Le deuxième, ce sont les sources complexes : clichés surexposés, troubles, pris au téléphone en mauvaise lumière, qu'il faut rattraper en couleur et en netteté avant conversion, sinon le format léger ne fera que figer le rebut. Le troisième, c'est quand il faut un résultat stable en flux et qu'on n'a pas le temps de s'occuper des balises picture, du repli et des réglages de qualité.

Tirons un trait. WebP est plus léger que le JPEG d'environ 25 à 35 %, AVIF de 40 à 50 %, et les deux formats sont déjà pris en charge par presque tous les navigateurs. Passer les images aux formats modernes améliore directement le LCP et les autres Core Web Vitals, ce qui aide les positions dans la recherche, réduit les rebonds et remonte la conversion. Pour votre propre site, utilisez picture avec la chaîne AVIF, WebP, JPEG, pour obtenir à la fois légèreté et compatibilité. Pour les marketplaces et les portails officiels, gardez du JPEG au bon poids. Ne courez pas après la taille minimale au détriment de la qualité, tenez la qualité dans le couloir 75 à 85 et nettoyez l'EXIF. Et surtout, ne remettez pas à plus tard : vous pouvez vérifier le gain dès maintenant, en passant vos photos dans un convertisseur et en voyant en une minute à quel point vos pages deviendront plus légères.

Convertir les images ne suffit pas, il importe de les brancher de façon que le site s'ouvre chez tous. L'approche moderne, c'est la balise picture avec plusieurs sources : le navigateur choisit lui-même le format le plus léger qu'il comprend, et s'il ne comprend pas le nouveau, il prend le JPEG de repli. Le schéma est simple : on indique d'abord une source AVIF, puis une source WebP, et à la fin une img ordinaire en JPEG comme repli fiable.

Ainsi, un visiteur sur navigateur récent reçoit un AVIF léger, un visiteur sur navigateur plus ancien un WebP, et sur un tout vieux ou dans de rares clients, il voit un JPEG sans rien casser. Ne supprimez pas les JPEG d'origine, ils servent de repli. Beaucoup de moteurs et de plugins savent servir du WebP automatiquement, en substituant le format à la volée selon le navigateur, ce qui est commode pour les grands sites. Règle principale : le nouveau format doit accélérer, pas casser l'affichage des images pour une partie de l'audience, le repli est donc obligatoire.

WebP et AVIF résolvent la même tâche, mais différemment. WebP est nettement plus léger que le JPEG, pris en charge par quasiment tous les navigateurs actuels et rapide à encoder, c'est un choix de travail fiable aujourd'hui. AVIF compresse encore plus fort, surtout sur les photos aux dégradés doux, et donne une meilleure qualité à poids moindre, mais encode plus lentement et est un peu moins bien pris en charge dans les versions les plus anciennes.

Le choix pratique est le suivant : si vous voulez une compatibilité maximale et de la simplicité, prenez du WebP à une qualité d'environ 80 %, c'est déjà moins trente à quarante pour cent de poids par rapport au JPEG sans différence visible. Si vous courez après la vitesse maximale et acceptez un réglage un peu plus complexe, ajoutez l'AVIF en première source à une qualité d'environ 50 à 60 %, son échelle de qualité est décalée et de telles valeurs donnent une image excellente. L'optimal est de servir les deux formats via picture, alors chaque navigateur reçoit le meilleur de ce qu'il sait. Ne poussez pas la qualité à zéro pour le poids, l'économie cessera de valoir la perte de netteté.

Les nouveaux formats sont bons sur votre propre site, mais il y a des endroits où ils poseront problème. Les marketplaces acceptent les photos de produit en JPEG et PNG, et ne prennent souvent pas en charge WebP et AVIF au chargement, préparez donc les fiches en JPEG. Les portails administratifs, les documents et la plupart des formulaires officiels attendent aussi du JPEG ou du PNG. L'envoi de photos à des proches par messagerie et par courriel est plus sûr en JPEG, car WebP ne s'ouvrira pas chez tout le monde.

Autre nuance : le traitement ultérieur et l'impression. Tous les éditeurs et imprimeurs ne sont pas à l'aise avec l'AVIF, pour ces tâches gardez les sources dans les formats habituels. Règle simple : WebP et AVIF pour servir les images aux visiteurs de votre site, où vous contrôlez le branchement et le repli, et tout ce qui part vers des systèmes externes et vers les gens, servez-le en JPEG ou PNG. Vous aurez alors la vitesse là où elle importe et la compatibilité là où elle est critique.

• Pas de JPEG de repli. Les images ne sont servies que dans le nouveau format, et chez une partie des visiteurs elles ne chargent pas. Laissez toujours un repli via picture.
• Chargement de WebP sur une marketplace. La plateforme n'accepte pas le format, la fiche échoue. Pour les marketplaces, uniquement JPEG et PNG.
• Compression extrême. La qualité est poussée au plancher pour le poids, des artefacts apparaissent. Gardez un équilibre raisonnable autour de 80 % pour le WebP.
• Conversion depuis une source floue. Le nouveau format n'améliorera pas une photo déjà gâchée, il la conservera seulement plus légère. Convertissez depuis un original de qualité maximale.
• Double compression. Un JPEG surcompressé est transcodé en WebP, empilant les artefacts. Partez de la source de qualité maximale.

De combien WebP est-il plus léger que le JPEG ?

À qualité comparable, WebP est d'ordinaire 25 à 35 % plus léger que le JPEG, et AVIF encore plus léger. Sur un grand site, cela accélère nettement le chargement et améliore les indicateurs de vitesse.

Tous les navigateurs ouvrent-ils le WebP ?

Quasiment toutes les versions actuelles de Chrome, Firefox, Safari et Edge prennent en charge le WebP. AVIF est un peu moins bien pris en charge dans les versions les plus anciennes, le JPEG de repli reste donc nécessaire.

WebP améliore-t-il les positions dans la recherche ?

Le format ne classe pas directement, mais il accélère le site, et la vitesse est un facteur de classement et de confort. Les pages rapides sont mieux indexées et retiennent le visiteur.

Peut-on charger du WebP sur les marketplaces ?

Non, les marketplaces attendent du JPEG et du PNG. Utilisez WebP et AVIF sur votre propre site, et préparez les fiches produit dans les formats pris en charge.

Pour une boutique en ligne, la vitesse de chargement, c'est de l'argent direct : chaque seconde d'attente en plus réduit la conversion et augmente les rebonds, et le visiteur mobile en connexion faible part simplement. Les images constituent d'ordinaire la part du lion du poids de la page, le passage du catalogue en WebP ou AVIF donne donc le gain de vitesse le plus visible. Des images plus légères chargent plus vite, économisent le trafic de l'acheteur et réduisent la charge sur votre serveur, ce qui compte en période de pic de soldes.

On intègre cela sur le site de la boutique via le service automatique de WebP avec JPEG de repli, pour que les images s'ouvrent chez tous. Important, à ne pas confondre : il s'agit bien de votre site, pas des fiches sur les marketplaces, où les photos se chargent toujours en JPEG. Autrement dit, un même produit, vous le servez aux visiteurs de votre boutique en WebP léger pour la vitesse, et aux marketplaces en JPEG pour la compatibilité. Ce double standard est normal et donne le meilleur des deux mondes : un site rapide et des fiches acceptées par les plateformes.

Configurer le WebP ne suffit pas, il faut s'assurer que le navigateur reçoit bien la version légère et non le vieux JPEG. Cela se vérifie simplement via les outils de développement du navigateur. Ouvrez la page, appuyez sur F12, allez dans l'onglet Network, actualisez la page et regardez les images chargées : dans la colonne du type ou dans le nom du fichier doit figurer webp ou avif, pas jpeg. Si c'est encore du JPEG, la substitution de format ne fonctionne pas et le réglage doit être corrigé.

Deuxième repère : la taille des fichiers dans le même onglet, la version WebP doit peser nettement moins que le JPEG d'origine. Il est aussi utile de passer la page dans des services de test de vitesse, ils indiqueront directement si les images peuvent être servies dans un format plus moderne et montreront l'économie potentielle. Vérifiez sur différents navigateurs, car le service dépend de la prise en charge, et assurez-vous que sur un navigateur sans prise en charge du nouveau format, le JPEG de repli se charge correctement. Cette vérification prend deux minutes et garantit que tout le travail de conversion accélère vraiment le site au lieu de rester lettre morte.

Les nouveaux formats savent faire plus que compresser légèrement des photos, ce qui élargit leur usage. WebP comme AVIF prennent en charge la transparence comme le PNG, on peut donc servir un logo ou une image à fond transparent en WebP et obtenir à la fois la transparence et un faible poids, ce qu'on ne peut pas obtenir d'un JPEG. Pour les sites, cela veut dire que même un graphisme à zones transparentes, autrefois gardé en PNG lourd, peut désormais être allégé en conservant des bords soignés sur tout fond.

WebP sait aussi l'animation, en remplaçant plus légèrement le format GIF vieillissant : un WebP animé pèse bien moins pour une meilleure qualité et fluidité. C'est utile pour de petites bannières animées et des icônes sur un site. Il faut cependant se souvenir du repli : là où une partie de l'audience peut être sur un vieux navigateur, on garde quand même un repli pour l'animation et la transparence, que ce soit un PNG pour le statique ou un autre format pris en charge. Dans l'ensemble, l'alliance du faible poids, de la transparence et de l'animation dans un même format fait de WebP un outil universel pour le graphisme web, et AVIF y ajoute une compression photo encore plus forte.

Le passage massif à WebP et AVIF doit se faire avec soin, pour ne pas casser l'affichage des images chez une partie des visiteurs. Commencez petit : prenez un modèle de page ou une section, configurez le service de WebP avec JPEG de repli et assurez-vous, via les outils du navigateur, que la version légère charge bien et que sur un vieux navigateur le JPEG se substitue correctement. Ce n'est qu'une fois que tout fonctionne que vous étendez l'approche à tout le site. Conservez les JPEG d'origine, ils servent de repli et de base si vous devez régénérer les images dans un autre format ou une autre taille.

Sur un grand site, la conversion manuelle de chaque image est irréaliste, on branche donc d'ordinaire un module ou un plugin qui crée les versions WebP automatiquement et les sert aux navigateurs compatibles, en gardant le JPEG pour les autres. Cela supprime le travail manuel et rend la migration transparente pour les gestionnaires de contenu, qui continuent de charger les JPEG habituels. Après l'intégration, passez les pages clés dans des services de test de vitesse et vérifiez que le poids des images a baissé et que les indicateurs de chargement se sont améliorés. Une migration progressive avec repli obligatoire donne tout le bénéfice de la vitesse sans risquer que des images disparaissent chez certains visiteurs.