Entre pixels et réalité : choisir et utiliser le bon format d'image

ℹ️ Lien pour retrouver l’ensemble des articles de cette série “Entre pixels et réalité”.

Après avoir abordé les notions clés des formats d'images dans notre premier volet, nous allons maintenant aborder un enjeu crucial : comment sélectionner le format d'image idéal pour concilier qualité visuelle, performance et impératifs d'écoresponsabilité numérique.

L'époque où l'on se contentait du JPEG ou du PNG est révolue. Le paysage des formats évolue rapidement, stimulé par la quête d'une meilleure expérience utilisateur et d'une efficacité énergétique accrue sur le web. Cet article dresse un bilan exhaustif des formats actuels, des plus anciens comme le JPEG aux standards novateurs tels que WebP, AVIF et JPEG XL. Nous détaillerons leurs atouts, leurs limites et leur degré de compatibilité, afin de vous fournir les éléments nécessaires pour des choix techniques pertinents.

Afin de rendre la lecture agréable, cet article détaillé et argumenté est enrichi de nombreuses illustrations et de tableaux récapitulatifs qui synthétisent les informations clés et facilitent la comparaison des formats d'image. Une infographie « Comment choisir et utiliser le bon format ? », est également disponible en fin d'article. Bonne lecture !

Usage pour les images matricielles actuellement

État des lieux des formats historiques

De nos jours, le format GIF n’est plus préconisé, car il est loin d’être optimisé dans la taille des fichiers. La possibilité de faire des animations a fait largement son succès, il est possible de faire mieux et plus léger directement avec des formats vidéos modernes voire avec des formats de fichier animés modernes.

Le format JPEG (datant de 1992, incluant ses variantes, avec extensions de fichiers .jpg , ou moins rendue : .jpeg, .jpe, …) connaît un bon succès, parce que c’est un bon compromis avec un taux de compression avec perte très bon et une compatibilité très large (photos, web, réseaux sociaux, …). Par contre, il ne gère pas la transparence.

Le format PNG avec une qualité visuelle parfaite, via une compression sans perte, explique son usage pour des logos, schémas, captures d’écran (comme encore de base sous Mac OS), icônes… Il a également été pilier avec une gestion de la transparence. Toutes ces caractéristiques expliquent sa popularité dans les domaines du graphisme / UI. Mais le poids de fichier lourd, voire très lourd, l’a rendu inefficace sur les images complexes, surtout face à des formats plus modernes en croissance que l’on va justement aborder ci-dessous.

État des lieux avec les nouveaux formats

Le format WebP, lancé et mis à disposition par Google en 2010, est rapidement devenu une référence incontournable dans le paysage de l'optimisation d'images sur le web. Son objectif initial était simple et ambitieux : réduire drastiquement la taille des fichiers images pour accélérer le chargement des pages web, tout en maintenant une qualité visuelle suffisante.

WebP

Le WebP atteint cette performance grâce à sa double nature. Il gère :

• La compression avec perte (lossy) : Idéale pour les photographies, cette méthode permet de réduire significativement la taille du fichier, souvent de 25 à 35 % par rapport à un JPEG équivalent, en appliquant des algorithmes de compression avancés basés sur la prédiction de pixels.
• La compression sans perte (lossless) : Essentielle pour les graphiques, logos ou images nécessitant une fidélité absolue (comme le PNG), cette technique assure qu'aucune information de pixel n'est perdue. Contrairement au PNG, le WebP sans perte utilise des techniques de compression plus modernes qui le rendent généralement plus efficace en termes de poids (Google parle de 26% et Cloudinary precise que l'encodage au format WebP peut prendre plus de temps CPU que celui au format PNG).

De plus, un atout majeur qui a renforcé son adoption est sa gestion native du canal alpha pour la transparence, qu'il s'agisse de compression avec ou sans perte. Cette polyvalence a permis au WebP de se positionner comme un successeur crédible et performant face à la fois au JPEG (pour la photo) et au PNG (pour les graphiques transparents). Grâce à l'intégration dans Chrome et l'adoption progressive par la quasi-totalité des autres navigateurs (compatibilité aujourd'hui considérée comme "Très bonne"), WebP est désormais le format privilégié pour les images matricielles sur de nombreux sites internet modernes.

À noter qu'à l'instar des formats modernes (AVIF et JPEG XL), le format WebP prend en charge les animations. Il peut être utilisé comme alternative au format GIF animé, offrant généralement une meilleure compression pour une qualité d'image comparable.

Fort du succès de la première version, le développement du WebP 2 a été envisagé. L'objectif de cette proposition (cf. WEBP2 Proposal: What’s Next After WebP?) était de repousser encore les limites de l'efficacité, en exploitant des techniques d'encodage plus récentes pour offrir un taux de compression encore supérieur. Cependant, malgré des promesses d'amélioration des performances, WebP 2 n'a finalement pas été adopté par Google. La stratégie de Google s'est réorientée vers d'autres formats concurrents de nouvelle génération, notamment l'AVIF (AV1 Image File Format), ainsi que, plus récemment, le JPEG XL. Ces formats étaient perçus comme offrant des avancées plus complètes, notamment la prise en charge native du HDR (High Dynamic Range), et une polyvalence technique jugée plus pérenne pour l'avenir du web, reléguant le WebP 2 au statut de projet abandonné (comme l'indiquait notamment Google drops Webp2 and JPEG-XL en 2022).

AVIF

L'AVIF (AV1 Image File Format) est un format de fichier image basé sur le codec vidéo AV1, dont la spécification a été finalisée en 2019 par l'Alliance for Open Media (AOMedia). Il est conçu pour offrir une meilleure compression et une qualité d'image supérieure par rapport aux formats existants, comme le JPEG ou même le WebP. Il prend en charge la transparence (canal alpha), une profondeur de couleur élevée (jusqu'à 12 bits), ainsi que la gestion des gammes de couleurs étendues (HDR). Il est pressenti pour devenir le successeur du WebP et un standard de nouvelle génération pour la diffusion d'images sur Internet grâce à sa capacité à réduire la taille des fichiers tout en conservant une excellente fidélité visuelle. Son adoption par les navigateurs web a commencé en 2020 (Chrome et Firefox).

JPEG X

Le JPEG XL (JXL) est un format d'image matricielle moderne, conçu comme le potentiel successeur universel du vénérable JPEG. Développé pour offrir une compression significativement plus efficace (avec ou sans perte) que les formats existants (JPEG, PNG, WebP) et une qualité d'image supérieure, il se distingue par sa capacité à gérer nativement le HDR (High Dynamic Range), la transparence (canal alpha) et les animations. Son historique est marqué par un soutien initial fort, suivi d'une "dépréciation" controversée par Google en 2022, bien qu'un regain d'intérêt et des implémentations ultérieures (notamment chez Apple et un possible retour dans Chrome) suggèrent qu'il reste un candidat sérieux pour l'archivage professionnel et la diffusion web de haute qualité, grâce à sa fonctionnalité unique de "reconstruction JPEG" sans perte. Si on reprend une image JPEG et qu'on la transforme en JPEG-XL, on obtiendra un fichier plus léger de (20 à 35%), avec exactement le même rendu. Ce que les autres formats modernes ne permettent pas. Puisque là où les autres formats réencodent l’image JPEG (forcément avec modification de l’image d’origine), le format JPEG-XL utilise un mode spécial (JPEG Reconstruction) pour compresser sans perte directement le contenu binaire du fichier JPEG d’origine.

Performance

Nous allons maintenant aborder les performances, comparer les formats d'images les plus populaires et les plus prometteurs pour le web actuel, en nous concentrant sur l'efficacité de la compression, la qualité visuelle et la vitesse de traitement.

Cf. WebP et AVIF : compresser vos images en quelques clics du 13 Fév 2023

Explication du graphique : en comparaison avec un fichier JPEG de référence de qualité équivalente, les performances de WebP et AVIF sont significatives :

• WebP réduit la taille médiane des images de 31,5 %. Pour le 85ème centile, la réduction est de 20 %, bien que 2,7 % des images puissent être plus grandes que le JPEG original.
• AVIF affiche une performance supérieure, avec une réduction médiane de 50,3 % et une diminution de 39,6 % pour le 85ème centile. Il est important de noter qu'aucune image AVIF n'est plus grande que le fichier JPEG de référence.

Ces chiffres éloquents fournissent une base solide pour l'évaluation de l'impact de ces formats sur les temps de chargement sur le réseau.

D’autres tests de Cloudinary (plateforme leader de gestion d'images et de vidéos dans le cloud) sur un ensemble d’images montrent que l’efficacité (avec le nombre moyen de bits par pixels) de la compression JPEG XL est notoire sur AVIF et encore plus sur WebP comme on peut le voir sur ce graphique ci-dessous (cf. XL Docs / Format comparison et Cloudinary / The Case for JPEG XL ) :

Sur l’analyse de 250 images, ce graphique compare quatre formats d'image selon leur efficacité : la qualité obtenue pour un poids de fichier minimal. L'axe horizontal mesure la taille compressée (en bits par pixel — moins il y en a, plus léger est le fichier). L'axe vertical indique la qualité visuelle perçue (0 à 100). Plus une courbe monte vite vers le haut et la gauche, meilleur est le format. Les résultats parlent d'eux-mêmes :

• JPEG XL (rose) : meilleure compression
• AVIF (jaune) : bon compromis
• WebP (vert) : performance modérée
• JPEG (noir) : moins efficace

Selon Uploadcare (octobre 2025) et Google, AVIF a montré de meilleures performances de décodage que JPEG XL dans Chrome. Cette comparaison est cependant trompeuse. Elle oppose un décodeur AVIF natif à un décodeur JPEG XL exécuté via une extension (WebAssembly) qui était la seule option en 2022 après le retrait de JPEG XL de Chrome. Ce benchmark démontre donc un avantage logiciel (codec natif plus rapide qu'en WebAssembly) plutôt qu'un avantage intrinsèque du codec. Mais quand on compare les bibliothèques elles-mêmes (libjxl / JPEG-XL reference Vs libavif/libaom / AVIF référence), les mesures convergent pour dirent que le décodage CPU JXL est généralement plus rapide (suivant les implémentations, on relève un facteur entre 2 et 10). Car l’AV1 de l’AVIF est un codec vidéo très complexe.

Pour l’encodage, les tests montrent que JPEG XL peut être jusqu’à trois fois plus rapide à encoder qu’AVIF, à qualité visuelle équivalente. Cette différence s’explique en grande partie par la complexité algorithmique plus élevée des encodeurs AVIF actuels.

En matière de rendu, JPEG XL prend en charge nativement le chargement progressif , on y reviendra, permettant à l’image d’apparaître rapidement dans son ensemble avant de gagner progressivement en précision. AVIF, en revanche, ne propose pas de chargement progressif natif comparable, ce qui peut retarder l’affichage perceptible de l’image complète, même lorsque le téléchargement réseau est partiellement avancé.

Compatibilité

un tableau vaut parfois mieux qu'un long discours, voilà ci-dessous une synthèse de la compatibilité sur le Web et de l'adoption des trois formats de fichiers modernes :

Chargement progressif de l’affichage de l’image

Le format JPEG XL (JXL) est conçu pour exceller dans le chargement progressif (progressive rendering), offrant une expérience utilisateur rapide même avec des fichiers volumineux.

Si l’on examine les possibilités des formats d’image modernes (JPEG, PNG, Webp, AVIF et JXL) sur les 4 types de chargement et d’affichage de l’image (vue dans l’article précédent):

• Décodage progressif par résolution : seul le JXL le permet nativement
• Décodage progressif par qualité : seul le JXL le permet nativement
• Streaming-friendly (Données utilisables avant la fin) : seul le JXL le permet nativement sans limites. À noter que potentiellement, l’AVIF le permet également avec une efficacité qui dépend de l'encodeur et du format de conteneur (HEIF).
• Chargement adaptatif (Responsive Images) : c’est indépendant du format d’image car disponible sur les navigateur internet via les attributs srcset et sizes de l’élément HMTL <img>

Cela montre une nette supériorité du JXL pour le chargement progressif qui offre une expérience utilisateur optimisée dès les premiers octets. À l'inverse, des formats comme JPEG (même progressif), AVIF et WebP n'offrent pas de chargement progressif natif comparable, limitant l'affichage rapide des images volumineuses sur le web moderne.

Pour fixer les idées, voilà un exemple de chargement de notre image initialement en JPEG de 42 Ko passée au format JXL en utilisant l’outil de Google Progressive JPEG XL demo :

Changement à 10% du JPEG-XL soit 4 ko	Changement à 25% du JPEG-XL soit 11 ko

Changement à 50% du JPEG-XL soit 21 ko	Changement à 75% du JPEG-XL soit 32 ko

Changement à 100% du JPEG-XL soit 42 ko

Avec cet exemple, on s'aperçoit de plusieurs choses. En cas de navigation dans une page il est donc tout à fait possible de ne pas attendre la fin du chargement de toute l'image pour pouvoir naviguer autre part et donc abandonner le reste du chargement, tout en ayant un rendu préalable. De la même manière, on remarque que le chargement de 75 % de l'image est très proche du résultat final.

Cette capacité de décodage progressif par qualité, où l'utilisateur atteint une perception quasi optimale avec seulement une fraction des données, représente un avantage significatif pour :

• L'expérience utilisateur (UX) : L'affichage rapide d'une version de "bonne qualité" de l'image (dès 75% dans l'exemple) réduit la frustration liée à l'attente et améliore la perception de vitesse du site.
• L'économie de bande passante : Si l'utilisateur quitte la page ou défile au-delà de l'image avant la fin du téléchargement, le navigateur peut stopper le flux de données. L'image est déjà affichée à une qualité satisfaisante, évitant ainsi le gaspillage de bande passante pour des octets non vus.
• La performance des appareils mobiles : Moins de données à télécharger et à décoder réduit la consommation de batterie et la charge CPU, un facteur clé pour l'optimisation sur mobile.

Comparaison performance entre AVIF et JXL

Le JXL est plus prometteur, tant d’un point de vue encodage/décodage, qu’au niveau de la consommation des ressources matérielles et au niveau ressenti utilisateur. L'affichage progressif est un grand plus puisque l'utilisateur peut avoir l'impression que le chargement est encore plus rapide.

Perspective du JPEG XL / XL

Sur le papier, le format ouvert JPEG XL (JXL), basé sur les données de février 2026, s'annonce très prometteur. Il est considéré comme un excellent candidat pour le format d'image d'avenir grâce à ses atouts techniques majeurs : haute qualité, support HDR, et compression significative. Il est particulièrement adapté pour le Web (notamment si Google Chrome le réintègre, suite à son "volte-face" après sa dépréciation fin 2022. cf. aussi Google unkills JPEG XL?), l'archivage, et l'usage professionnel.

Le JXL est le candidat le plus prometteur et polyvalent car il comble les compromis des formats précédents. Il offre une compression compétitive (avec ou sans perte, supérieure à l'AVIF) sans nécessiter une puissance de calcul démesurée pour le codage et le décodage, ce qui va dans le sens d'une exploitation plus responsable des images numériques.

Ses avantages décisifs incluent :

• Performance : des algorithmes plus rapides que l'AVIF, réduisant la charge des serveurs et la consommation des terminaux clients.
• Expérience Utilisateur (UX) et Écoresponsabilité : le chargement progressif natif (par résolution, qualité et streaming-friendly) permet à l'utilisateur de percevoir rapidement l'image, même volumineuse. Cette fonctionnalité minimise la quantité de données échangées et permet d'arrêter le flux dès satisfaction, s'alignant sur les objectifs de sobriété numérique.
• Migration Facile : la fonctionnalité unique de "reconstruction JPEG" permet de moderniser les archives JPEG existantes en JXL sans perte de qualité et avec un gain de poids immédiat, facilitant une transition massive.

Malgré une adoption encore limitée sur le web (en attente de sa réintégration complète et stable dans Chrome suite au récent "volte-face" de Google), le JPEG XL cumule les atouts pour devenir le futur standard universel. Son adoption fait consensus chez les plus grands du Web (Google, Cloudinary) et officieusement chez Apple, qui a ajouté fin 2024 la prise en charge de l'affichage des images JPEG-XL dans iOS 17, macOS Sonoma et watchOS 10 (dixit Macworld).

En attendant on peut regarder JPEG XL Test Page pour verifier le moment ou le JXL sera nativement supporté sur nos navigateurs. Au moment de la publication de cet article, seul Safari le fait par défaut dans la version courante et en accord avec les informations dec CanIUse.

Usage pour des images vectorielles actuellement

Le format SVG est très utilisé sur le web pour les icônes, schémas, dessins et logos car il permet une mise à l'échelle sans perte de qualité. Cependant, les fichiers sont souvent alourdis par des métadonnées et options inutiles (en production) ajoutées par les outils graphiques.

SVGOMG basé sur SVGO ( abréviation de SVG Optimizer qui est une librarie Node.js) est un outil en ligne (ou sous forme de PWA) gratuit qui sert à optimiser (minifier) des fichiers SVG : on y importe un SVG, il propose de supprimer ou conserver différentes propriétés et affiche en temps réel le gain en taille (Ko).

L’outil affiche aussi les différents réglages possibles (selon un profil d’optimisation) et deux modes d’utilisation, ce qui permet d’ajuster le niveau de nettoyage du code SVG avant de télécharger la version réduite.

SVGOMG est une interface conviviale pour optimiser les fichiers SVG. Elle nettoie et réduit leur taille, améliorant leur utilisation sans perte de qualité visuelle.

Nous avons, par exemple, observé sur un site de production un fichier SVG (généré par Adobe Illustrator) de 575 ko pour un visuel simple :

L'utilisation de SVGOMG a permis une réduction spectaculaire de 99.96%, atteignant 244 octets, sans perte visuelle.

Comparatif des formats

Pour résumer, faisons un tableau des formats actuels et pressentis. C’est-à-dire les formats : PNG, JPEG / JPG, JPEG / JXL, Webp, AVIF et SVG.

Conclusion

L'ère du choix binaire entre JPEG (pour la compression avec perte) et PNG (pour la qualité sans perte et la transparence) est révolue. Le paysage actuel des formats d'image matricielle est en pleine mutation, porté par une triple exigence : qualité visuelle irréprochable, performance web optimisée et impératif d'écoresponsabilité numérique.

Cet article a dressé un panorama des acteurs majeurs : le WebP, désormais une référence incontournable pour le web moderne grâce à son bon ratio poids/qualité et la possibilité de transparence. L'AVIF, un concurrent sérieux issu du monde de la vidéo, offrant une compression significative, bien que pénalisé par des temps d'encodage et de décodage CPU plus coûteux.

Une coexistence intelligente et transitoire des formats se dessine, en utilisant :

• SVG pour toutes les images vectorielles (logos, icônes), en n'oubliant pas d'utiliser des outils comme SVGOMG pour une minification indispensable.
• WebP / AVIF pour la majorité des cas d'usage web "grand public" (avec fallback encore nécessaire en début 2026 pour l'AVIF).
• l’AVIF avec les logiciels qui le supporte.
• Une fois que le JPEG XL bénéficiera d'un support généralisé (avec l'espoir que cela arrive rapidement !), il est probablement destiné à devenir le format d'image universel et dominant, remplaçant avantageusement le JPEG, le WebP et l’AVIF dans l'ensemble des services numériques de demain.

Aujourd’hui (2026), adopter une stratégie d'image diversifiée et l'intégrer avec la possibilité de fallback (tel que l'élément HMTL <picture>) est la clé pour concilier performance, qualité et responsabilité environnementale dans les services numériques.

Take away : Comment choisir et utiliser le bon format ?

Pour résumer et avoir une synthèse pratique des formats d’images :

L’article Entre pixels et réalité : pourquoi et comment alléger simplement nos images du quotidien explique concrètement les aspects de redimensionnement, de compression et l’utilisation de l’outil Squoosh.

Pour aller plus loin

• Korben 19 février 2024 / JXL et AVIF - Les nouveaux champions des formats d'image
• Uploadcare / AVIF vs JPEG XL vs JPEG: Which image format is best for you?
• JPEG XL Arrives in PDF: How the New Format Will Revolutionize Web Performance and Image Optimization in 2025
• Complete Guide to Image Formats 2024: JPEG vs PNG vs WebP vs AVIF vs JPEG XL
• U-turn: Google wants to bring JPEG XL back to Chrome
• Mesurer le ressenti des internautes : clé d’un numérique responsable

ℹ️ Lien pour retrouver l’ensemble des articles de cette série “Entre pixels et réalité”.