JPG, PNG, WebP, AVIF : quel format d’image pour quoi

Une société de gymnastique d’Estavayer-le-Lac a besoin d’images à bien des endroits : sur le site web, dans la newsletter, sur le flyer de la fête de gymnastique, dans le rapport à la commune. La secrétaire reçoit des photos en HEIC, le logo en JPG avec une bordure blanche et des captures d’écran de la page d’inscription en PNG. Jusqu’ici, elle choisit le format au jugé.

Il n’existe pas de réponse unique, mais quelques lignes claires. Elles dépendent de ce que montre l’image et de l’endroit où elle apparaît.

Les formats en un coup d’œil

MDN, la documentation pour développeurs de Mozilla, décrit ainsi les formats courants :

Format	Point fort	Limite
JPEG	photos et images aux dégradés doux	avec perte, pas de transparence
PNG	reproduction exacte, transparence	fichiers volumineux pour les photos
GIF	animations simples	256 couleurs au maximum
WebP	images et animations, plus légères qu’en JPEG ou PNG	pas reconnu partout dans les environnements anciens
AVIF	forte compression pour images et animations	pas d’affichage progressif pendant le chargement
SVG	graphiques qui restent nets à toute taille	seulement pour des formes dessinées, pas pour des photos

Le fonctionnement de la compression sans perte et avec perte est décrit dans l’article Sans perte ou avec perte.

Selon l’usage

Pour la société de gymnastique, il en découle une répartition selon le but :

Usage	Format tout indiqué	Pourquoi
Photos sur le site web	WebP ou AVIF, JPEG en solution de repli	fichiers légers, bonne qualité
Logo sur le site web	SVG, sinon PNG	contours nets, transparence
Captures d’écran, modes d’emploi	PNG ou WebP sans perte	le texte reste net
Photos dans la newsletter ou par e-mail	JPEG	répandu et lisible par la plupart des programmes
Flyers et impression	selon les indications de l’imprimerie	exigences de résolution et de couleurs

Ce que les navigateurs affichent

Pour un site web, la question principale est de savoir si les navigateurs connaissent un format. MDN en recense la prise en charge : WebP est affiché par toutes les versions de Chrome, Edge, Firefox, Opera et Safari, Safari sur Mac exigeant toutefois au moins la version 14 et macOS Big Sur. AVIF est affiché par Chrome dès la version 85, Edge dès la 121, Opera dès la 71, Firefox dès la 93 et Safari dès la 16.1. JPEG XL, un format plus récent, est pris en charge par Safari dès la version 17 ; dans Chrome, selon MDN, il n’est disponible que par un réglage expérimental.

Pour les images matricielles sur le web, MDN recommande donc en premier lieu WebP ou AVIF, et conseille de proposer avec l’élément <picture> une solution de repli en PNG ou en JPEG pour les navigateurs qui ne connaissent pas les formats plus récents.

Logos et graphiques

Le logo à la bordure blanche est un cas typique. En JPEG, il n’a pas de fond transparent — JPEG n’a pas de canal alpha —, et les traces de la compression avec perte apparaissent sur les bords des lettres. Pour les logos, diagrammes et icônes qui doivent être dessinés avec précision à différentes tailles, MDN recommande le format vectoriel SVG. Lorsqu’on ne dispose que d’une image matricielle, un PNG à fond transparent est le meilleur choix suivant.

Pour la société, il vaut donc la peine de demander à la personne qui a conçu le logo à l’époque : une version vectorielle existe souvent quelque part.

Captures d’écran

Les modes d’emploi avec captures d’écran — par exemple « Comment s’inscrire à la fête de gymnastique » — contiennent beaucoup de texte. MDN relève que sur de telles images, le flou et les franges colorées autour du texte et des contours nets sont bien visibles en cas de compression avec perte, et recommande un encodage sans perte. PNG ou WebP sans perte gardent le texte net.

Transparence et mouvement

Deux propriétés restreignent encore le choix :

• Transparence. PNG, WebP et AVIF peuvent enregistrer des zones transparentes, JPEG non.
• Animation. GIF peut animer, mais se limite à 256 couleurs. MDN cite WebP et AVIF comme un bon choix aussi pour les images animées.

Photos de l’iPhone

Beaucoup de photos des membres arrivent au format HEIC, le format par défaut des iPhone récents. Pour le site web, la newsletter et l’impression, elles sont en général converties dans l’un des autres formats. Ce à quoi il faut veiller est décrit dans l’article Convertir un HEIC en JPG.

Convertir n’est pas renommer

Renommer un fichier « photo.heic » en « photo.jpg » ne change pas le format — seulement le nom. Les données restent les mêmes, et certains programmes refusent alors d’ouvrir le fichier, parce que le nom et le contenu ne concordent pas. Pour changer de format, il faut une vraie conversion, dans laquelle l’image est enregistrée à nouveau.

Impression et archives

L’impression a ses propres règles. L’imprimerie indique le format, la résolution et l’espace colorimétrique qu’elle attend. La résolution y est souvent donnée en dpi, en points par pouce sur le papier. Une image réduite pour le site web ne suffit généralement pas pour un flyer — d’où l’intérêt de conserver les originaux.

Il en va de même pour les archives de la société : les originaux restent en pleine taille et dans leur format d’origine, et chaque version pour le site web, la newsletter ou l’impression en est tirée à nouveau.

La taille compte aussi

Le format n’est qu’un levier parmi d’autres. web.dev, un site d’information de Google consacré au développement web, rappelle qu’un écran à densité de pixels double a besoin de quatre fois plus de pixels. Une photo en pleine résolution d’appareil reste lourde, même en WebP. D’abord réduire à la taille nécessaire, puis choisir le bon format : c’est cet ordre qui fait gagner le plus.

Pour la société de gymnastique d’Estavayer-le-Lac

La secrétaire range un petit tableau dans le dossier de la société : photos pour le site web en WebP avec repli en JPEG, photos pour la newsletter en JPEG, captures d’écran en PNG, et le logo en SVG, que la graphiste avait encore. Pour le flyer, elle demande à l’imprimerie. Les originaux HEIC restent dans un dossier à part.

Les outils image que nous développons convertiront les images entre JPG, PNG, WebP et HEIC, les compresseront et les réduiront — traitées en Suisse, en mémoire, sans qu’aucune image ne reste enregistrée, et en mode confidentiel entièrement sur votre propre appareil.