Guide Complet des Formats d'Image : PNG, JPG, WebP, AVIF et SVG

JPG / JPEG  Joint Photographic Experts Group

Créé en 1992 par le Joint Photographic Experts Group, le JPG a été conçu spécifiquement pour compresser efficacement les photographies. Son algorithme divise l'image en blocs de 8×8 pixels et applique la Transformée en Cosinus Discrète (DCT) pour représenter chaque bloc comme une combinaison de fréquences — en éliminant les fréquences à forte variation que l'œil humain perçoit le moins. Le résultat est une compression lossy (avec perte) : une partie des données originales est supprimée définitivement.

Pourquoi ça marche si bien pour les photos : les photographies ont une variation de couleur douce et progressive — exactement le type d'information que le JPG compresse le plus efficacement. Une photo de paysage en JPG à 80 % de qualité peut être 10 fois plus légère que le même fichier non compressé, avec une différence visuelle imperceptible à l'écran.

Où il échoue : l'algorithme de blocs 8×8 crée des artefacts visibles sur les bords nets, les textes et les zones de couleur uniforme. Un logo noir sur fond blanc en JPG montrera des taches grises autour des lettres — les fameux « artefacts JPEG ». Le JPG ne supporte pas non plus le canal alpha (transparence).

Quand l'utiliser : photographies pour le web, l'impression et l'e-mail. Photos de produit, bannières, images de blog. Toute image avec beaucoup de variations de couleur et sans besoin de transparence.

Quand ne pas l'utiliser : logos, icônes, captures d'écran avec texte, images à fond transparent, illustrations aux bords nets, images qui seront rééditées et réenregistrées plusieurs fois.

PNG  Portable Network Graphics

Créé en 1996 comme alternative au GIF (qui avait des restrictions de brevet), le PNG utilise une compression lossless — aucune donnée n'est supprimée. L'algorithme DEFLATE (combinaison de LZ77 et du codage Huffman) réorganise les données de pixel plus efficacement sans rien jeter. Cela garantit que l'image décompressée est parfaitement identique à l'original, peu importe le nombre d'enregistrements du fichier.

Le canal alpha : le PNG supporte un quatrième canal par pixel en plus du RGB — le canal alpha, qui contrôle l'opacité de 0 (complètement transparent) à 255 (complètement opaque). Cela permet une transparence totale, de la semi-transparence et des bords avec anti-aliasing doux sur n'importe quel fond.

PNG-8 vs PNG-24 vs PNG-32 : le PNG-8 utilise une palette allant jusqu'à 256 couleurs (comme le GIF), idéal pour les icônes simples et images à peu de couleurs. Le PNG-24 utilise des couleurs complètes (16 millions) sans transparence. Le PNG-32 utilise des couleurs complètes avec canal alpha — c'est le type le plus courant quand on parle de « PNG transparent ».

Où il échoue : pour les photographies, le PNG est inefficace — les fichiers photo en PNG peuvent être 3 à 10 fois plus lourds que l'équivalent en JPG. La compression lossless ne parvient pas à éliminer efficacement la variation de couleur des photographies.

Quand l'utiliser : logos et icônes à fond transparent, captures d'écran avec texte, infographies, images avec zones de couleur uniforme, art numérique aux bords nets, images devant être rééditées sans perte cumulative.

Quand ne pas l'utiliser : photographies pour le web (utilisez JPG ou WebP), images nécessitant des fichiers légers, e-mail marketing où le JPG a une meilleure compatibilité.

WebP  Web Picture format

Développé par Google à partir du codec vidéo VP8, le WebP a été lancé en 2010 pour être le successeur universel du JPG et PNG sur le web. Il supporte les deux modes : lossy (basé sur VP8, pour les photos) et lossless (basé sur un algorithme propre, pour les graphiques). En mode lossy, le WebP utilise la prédiction de blocs et la transformation adaptative — des techniques plus sophistiquées que la DCT du JPG — pour produire des fichiers 25 à 35 % plus légers à qualité visuelle équivalente.

Le meilleur des deux mondes : en plus de remplacer le JPG pour les photos (mode lossy), le WebP remplace aussi le PNG pour les logos et graphiques (mode lossless avec canal alpha), généralement avec des fichiers 20 à 30 % plus légers. C'est le seul format qui unifie les cas d'usage du JPG et du PNG avec une meilleure efficacité pour les deux.

Compatibilité en 2026 : supporté par Chrome, Firefox, Safari (depuis la 14), Edge et Opera — couvrant plus de 97 % des utilisateurs du web. La principale exception concerne les anciens clients e-mail (notamment Outlook) et les systèmes d'entreprise legacy avec IE11.

Quand l'utiliser : pratiquement toute image pour le web — photos, logos, icônes, bannières. C'est le format standard recommandé pour tout upload sur des sites modernes. Le PageSpeed Insights de Google recommande spécifiquement le WebP quand il détecte du JPG ou PNG là où le WebP pourrait être utilisé.

Quand ne pas l'utiliser : e-mail marketing (compatibilité incohérente), impression graphique, miniatures YouTube (n'accepte pas le WebP), fichiers à télécharger que les utilisateurs finaux ouvriront localement sur d'anciens systèmes.

AVIF  AV1 Image File Format

L'AVIF dérive du codec vidéo AV1 (développé par l'Alliance for Open Media, qui inclut Google, Mozilla, Netflix, Amazon et d'autres). C'est le format le plus récent et techniquement le plus avancé disponible pour les images sur le web — il produit des fichiers 20 à 50 % plus légers que le WebP à qualité visuelle équivalente dans de nombreux cas, surtout à des qualités plus basses où le WebP commence à montrer des artefacts visiblement.

Pourquoi c'est si efficace : l'AV1 utilise des techniques de compression bien plus sophistiquées que le VP8 du WebP — dont des modes de prédiction intra-image, des transformées de taille variable et des loop filters. Le résultat est particulièrement impressionnant sur des photos très complexes et des dégradés subtils.

Le problème de l'encodage : convertir des images en AVIF est significativement plus lent qu'en WebP — un encodeur AVIF peut prendre 10 à 100 fois plus de temps pour traiter la même image. Pour les sites avec beaucoup d'images ou des pipelines de build qui génèrent des versions d'images en temps réel, ce coût de calcul est significatif.

Compatibilité en 2026 : Chrome 85+, Firefox 93+, Safari 16+. Non supporté par IE11 ni par la plupart des clients e-mail. Le support reste inférieur au WebP, et la recommandation est de servir l'AVIF avec un fallback vers WebP et JPG en utilisant la balise <picture>.

Quand l'utiliser : sites à fort trafic où chaque Ko économisé a un impact significatif sur le coût de bande passante ; images haute qualité où la différence visuelle vs WebP est perceptible ; nouveaux projets où le pipeline de build supporte déjà l'AVIF.

Quand ne pas l'utiliser : quand le temps d'encodage est un facteur critique ; pour un usage dans le convertisseur d'ImageTools (l'encodeur AVIF via l'API Canvas dans les navigateurs n'est pas optimisé et peut produire des fichiers plus lourds que l'original — utilisez des outils côté serveur comme sharp pour un AVIF de qualité).

SVG  Scalable Vector Graphics

Le SVG est radicalement différent de tous les autres formats de cette liste. Au lieu de stocker des pixels, il stocke des instructions mathématiques en XML — « dessine un rectangle de largeur 200 à la position X,Y avec la couleur #3ecf8e ». Le navigateur ou le logiciel calcule les pixels en temps réel à la résolution nécessaire. Un SVG de 5 Ko peut s'afficher parfaitement sur un favicon de 16px ou sur un panneau publicitaire de 20 mètres.

Pourquoi c'est le format idéal pour les logos et icônes : les logos et icônes sont composés de formes géométriques — rectangles, cercles, courbes de Bézier, texte. Le SVG décrit exactement ces formes sans aucune perte d'information. Un PNG de logo en 200px devient pixelisé en 2000px ; le même logo en SVG reste parfait à n'importe quelle taille.

Modifiable via CSS et JavaScript : les éléments SVG inline dans le HTML peuvent être manipulés comme n'importe quel autre élément du DOM — couleur modifiée via CSS, animations ajoutées via des transitions CSS ou JS, interactivité avec des événements de souris. C'est comme du HTML pour les images.

Où il échoue : les photographies et images aux nombreuses couleurs et dégradés complexes donnent des SVG énormes et impraticables — et même ainsi, la qualité serait inférieure au JPG car le SVG n'a pas été conçu pour représenter des données photographiques.

Quand l'utiliser : logos, icônes, illustrations géométriques, graphiques de données, cartes, tout art devant s'adapter à plusieurs tailles, icônes interactives dans des interfaces web.

Quand ne pas l'utiliser : photographies, images aux nombreuses couleurs et textures, réseaux sociaux (la plupart n'acceptent pas le SVG à l'upload), e-mail marketing.

GIF  Graphics Interchange Format

Créé en 1987 par CompuServe, le GIF utilise l'algorithme LZW (Lempel-Ziv-Welch) pour une compression lossless — mais avec une limitation fondamentale : il ne supporte que 256 couleurs par image. Chaque pixel est un index dans une palette d'au maximum 256 entrées, ce qui rend le format inefficace pour les photos (qui ont des millions de couleurs) mais adapté aux images simples à peu de couleurs.

Pourquoi le GIF a survécu jusqu'à aujourd'hui : c'est le seul format matriciel largement compatible qui supporte nativement les animations multi-images — et cette caractéristique l'a maintenu en vie des décennies après l'apparition de formats techniquement supérieurs. Le WebP animé et l'AVIF animé sont des alternatives plus efficaces, mais la compatibilité et la présence culturelle du GIF animé garantissent sa présence.

Transparence partielle : le GIF ne supporte qu'une seule couleur « transparente » par image — sans semi-transparence ni anti-aliasing. Le résultat, ce sont des bords « en dents de scie » autour des éléments aux contours courbes, surtout sur des fonds colorés.

Quand l'utiliser : animations simples sur des plateformes ne supportant pas le WebP animé ou le MP4 ; icônes animées à peu de couleurs ; mèmes et contenu de réseaux sociaux où le format GIF est culturellement attendu.

Quand ne pas l'utiliser : photos statiques (utilisez JPG ou WebP), logos statiques (utilisez PNG ou SVG), animations complexes pour le web (utilisez MP4 ou WebP animé — bien plus efficaces).

BMP  Bitmap

Le BMP est le format bitmap de Windows, créé par Microsoft. Dans la plupart des configurations, il n'applique aucune compression — chaque pixel est stocké directement avec sa valeur de couleur. Le résultat, ce sont des fichiers très lourds : une image de 1920×1080 en BMP 24 bits occupe exactement 5,93 Mo, toujours, quel que soit le contenu.

Pourquoi il existe encore : le BMP a une compatibilité garantie dans tout l'écosystème Microsoft — Windows, Office, imprimantes et logiciels d'édition legacy. Pour un usage interne dans des pipelines de traitement d'image où l'absence de compression est un avantage (garantie de données sans artefacts à chaque étape), le BMP a encore sa place.

Quand l'utiliser : quand un système spécifique (surtout legacy) exige du BMP ; comme format intermédiaire dans des pipelines de traitement où la compression introduirait des artefacts indésirables ; impression industrielle sur certains systèmes spécifiques.

Quand ne pas l'utiliser : tout usage web, e-mail, réseaux sociaux ou tout contexte où la taille du fichier compte.