Compresser des images PNG

Ce que le PNG fait bien

Le PNG (Portable Network Graphics) a été créé en 1996 comme remplaçant du GIF libre de brevets. Il est sans perte : chaque pixel décodé est exactement le pixel enregistré. Il prend en charge les couleurs complètes, les niveaux de gris, les couleurs indexées avec une palette et un canal alpha complet, ce qui permet aux contours de se fondre en douceur dans n’importe quel arrière-plan. C’est pourquoi le PNG est le choix habituel pour les captures d’écran, logos, icônes, éléments d’interface, graphiques et tout ce qui contient du texte net.

Le prix de l’absence de perte, c’est la taille. Une photo enregistrée en PNG pèse souvent plusieurs fois plus que la même photo en JPEG, car le bruit et la texture fine d’une photographie ne sont pas assez prévisibles pour bien se compresser.

Pourquoi un PNG peut encore maigrir

Le PNG compresse en deux étapes. D’abord, chaque ligne de pixels reçoit un filtre (None, Sub, Up, Average ou Paeth) qui remplace les valeurs des pixels par leur différence avec les voisins ; les zones unies deviennent de longues suites de zéros. Ensuite, les données filtrées sont compactées avec DEFLATE, le même algorithme que le ZIP. Beaucoup de logiciels choisissent les filtres et les réglages DEFLATE vite plutôt que bien : les mêmes pixels peuvent donc souvent tenir dans moins d’octets.

Il y a ainsi deux façons d’alléger un PNG :

• L’optimisation sans perte. L’outil exécute OxiPNG, qui essaie différentes stratégies de filtrage et réglages de compression et garde le résultat le plus petit. L’image reste identique au pixel près. Le gain dépend beaucoup de la façon dont le fichier a été enregistré : l’export d’un outil de capture rapide diminue souvent nettement, un fichier déjà optimisé change à peine.
• La réduction de palette (avec perte). Un PNG en couleurs complètes avec transparence stocke 4 octets par pixel. Le convertir en palette de 256 couleurs au maximum ramène cela à 1 octet par pixel avant même que DEFLATE n’intervienne, d’où des gains généralement bien plus importants avec ce mode. Les graphismes en aplats et les captures d’écran le supportent bien ; les dégradés doux et les photos peuvent montrer des bandes.

La réduction de palette est le réglage par défaut (mode « Intelligent », 256 couleurs avec tramage) ; passez la compression PNG en Sans perte lorsque chaque pixel doit rester exact. Le réglage du nombre de couleurs détermine la taille de la palette ; moins de couleurs, c’est un fichier plus petit et plus de risques de paliers visibles dans les dégradés.

Réglages pour les tâches courantes

Les captures d’écran Retina sont une source fréquente de PNG énormes : une capture plein écran sur un écran d’ordinateur portable de 2 880 × 1 800 compte plus de 5 millions de pixels. Ramener le côté le plus long à 1 600 px divise ce nombre par plus de trois, ce qui compte généralement plus que n’importe quel réglage de compression.

À titre indicatif : lors de nos tests, quatre captures d’écran PNG de pages Wikipédia, MDN et GitHub ont perdu 58 à 60 % de leur taille avec le mode Intelligent par défaut et, en valeur médiane, environ un tiers en mode Sans perte. Vos propres fichiers peuvent diminuer plus ou moins.

Problèmes fréquents

• Des bandes dans les dégradés après le mode Intelligent. Augmentez le nombre de couleurs ou repassez en sans perte.
• Un halo crénelé autour d’un logo transparent. Les contours lissés ont besoin de plusieurs niveaux de transparence ; gardez au moins 128 couleurs pour ce type d’image.
• Presque aucun gain en mode sans perte. Le fichier était déjà bien compacté. Seules la réduction de palette ou des dimensions plus petites feront une vraie différence, et l’outil rend le fichier d’origine quand rien de plus petit ne peut être produit.
• Le PNG est une photographie. Le JPEG ou le WebP conviennent mieux à ce contenu et seront bien plus légers.

Questions sur le PNG

Autres outils d’image

Le compresseur d’images traite un lot de fichiers mélangés. Les graphismes animés relèvent du compresseur GIF, et comment ça marche explique plus en détail ce que signifient « sans perte » et « avec perte ».