PNG vs GIF vs JPEG

Dernière mise à jour : 2007-06-27


Introduction

J'ai créé ces pages pour expliquer pourquoi le PNG mériterait d'être mieux connu, et en même temps réunir quelques informations qui peuvent être utiles à ceux qui créent des fichiers PNG.

Il s'agit d'un format de compression d'images sans perte (lossless), du même type que le GIF ou le PCX, contrairement au JPEG.

Contrairement au GIF, il supporte des images en 24 bits (16 millions de couleurs), et contrairement au JPEG il supporte des images 32 bits (16 millions de couleurs + 256 niveaux de transparence).

Sommaire :


Quand utiliser le PNG ?

Une première chose : Le PNG n'est pas le choix ultime dans tous les cas. C'est le meilleur choix lorsqu'il s'agit de sauver :

Ce n'est par contre pas le meilleur choix lorsqu'il s'agit de sauver :

Pour ces trois cas, le JPEG est souvent un meilleur choix pour ce qui est de la taille du fichier. Par contre on a une perte plus ou moins importante de la qualité, selon le taux de compression.

Souvent le PNG donne un fichier plus petit, pour une qualité d'image non altérée, contrairement au JPEG qui dégrade et au GIF qui oblige un passage en 256 couleurs maximum.


Questions fréquentes

Pourquoi remplacer le GIF par le PNG ? La différence de taille n'est pas si grande pour une même image en 256 couleurs...

En fait le GIF est soumis à une license de Unisys (il utilise l'algorithme LZW), donc tout programme créant des GIF doit payer une license. C'est pourquoi certains programmes gratuits ne proposent pas toujours de sauver des GIF (même si souvent les programmes gratuit obtiennent la licence d'Unisys sur simple demande). Un format tout à fait libre existe, et est plus efficace, donc autant l'utiliser !

Oui mais PNG c'est pas aussi compatible que GIF, non ?

En fait c'est vrai, mais bon, il faut relativiser les choses. Le PNG est donc destiné à être utilisé pour les pages web. Il fonctionne sous Internet Explorer 4 et + (sur le 4 il ne fonctionne que "inline"/"embedded", mis dans une page, et pas à part), Netscape 4.5 (les versions 3.x et 4.x peuvent les afficher grace à un plug-in), Opera 4 et +, Mozilla, et bien d'autres browsers récents. Sachant que beaucoup de monde crée des pages "Compatible IE 5", on peut dire que le fait de réduire la compatibilité des images aux browsers de version 4 n'est pas un trop gros problème.

Quels autres programmes l'acceptent ?

Quasi tous les programmes d'image un rien importants. Même Paint le supporte depuis la version inclue dans Windows XP.

Quand je sauve en PNG, j'obtiens toujours un fichier nettement plus gros, même pour un nombre de couleurs égal.

Les fichiers créés par certains programmes sont anormalement gros :

Et pour les GIF animés ?

Il existe une version animée du PNG : le MNG. Malheureusement seul les anciennes versions de Mozilla le supportent (la version actuelle de Mozilla/Firefox ne les lit plus). Ni Opera, ni Internet Explorer, ni Netscape 4 ne savent lire ces fichiers. Pour les animations le GIF reste donc obligatoire en attendant qu'un format d'animation plus simple que le MNG soit répandu (APNG par exemple).

Mes images apparaissent plus foncées dans Internet Explorer, les couleurs ne correspondent pas avec les codes HTML/CSS alors que dans mon programme de retouche d'image les couleurs correspondaient.

Il semblerait qu'Internet Explorer 5/6 lise mal les infos d'un des blocs contenus dans les fichiers PNG, c'est un des nombreux bugs de ce navigateur. Il s'agit du bloc "gAMA". Vous trouverez sur cette page des explications sur la manière de supprimer des blocs.


Tests & Exemples

Comparaisons PNG / GIF / JPEG :


Mozilla : mozilla-europe.org/fr. Navigateur réécrit à partir de zéro, destiné au départ à faire Netscape 6 (étant donné que Netscape 5, basé sur la version 4, a été abandonné). En plus du navigateur, il comporte des clients mail, news, irc, et un éditeur web. Il s'agit d'un des navigateurs les plus respectueurs des standard, et il est libre (gratuit + code source ouvert). Une grande quantité de plugins existent, permettant de modifier pas mal de choses dans l'interface et les fonctionnalités.

Mozilla Firefox : mozilla-europe.org/fr/products/firefox. Partie "navigateur web" de Mozilla. Si vous n'avez pas besoin des autres modules, Firefox est peut-être plus adapté. Il supporte la plupart des plugins créés pour Mozilla et a un look plus moderne.

K-Meleon : kmeleon.sourceforge.net. Navigateur très léger utilisant le moteur de Mozilla pour l'affichage des pages web, mais ayant sa propre interface. Si Mozilla et Mozilla Firefox semblent trop lourd sur votre machine, K-Meleon vous plaira peut-être plus. Tout comme Mozilla, ce navigateur est libre. Malheureusement les majorité des nombreux plugins modifiant l'interface de Mozilla ne pourront pas s'adapter à K-Meleon.

Opera : www.opera.com. Ce navigateur-ci possède son propre moteur, et est également très respectueux des standard. Dans certains cas la compatibilité avec les pages mal écrites (c'est-à-dire "optimisées pour Internet Explorer") est parfois meilleure. Le plus gros désavantage face à Mozilla est qu'il s'agit d'un logiciel commercial. Une version gratuite est disponible, mais une publicité est alors affichée en permanence dans le haut de l'écran (ce n'est pas trop gênant).


Liens utiles

PNG Home Site : www.libpng.org/pub/png. Site officiel regroupant des informations sur le PNG, des exemples d'images et des librairies de programmation.

Burn All Gifs : www.burnallgifs.org. Le "combat" contre le GIF.

PNG Crush : pmt.sourceforge.net/pngcrush. Programme optimisant les fichiers PNG, permettant de réduire leur poids tout en n'altérant pas l'image. Un programme de conversion de BMP vers PNG est également disponible sur ce site.

SuperPNG : www.fnordware.com/superpng. Plugin pour PhotoShop permettant de sauver des PNG nettement plus optimisés au niveau de la taille du fichier.

PNG Behavior : webfx.eae.net/dhtml/pngbehavior/pngbehavior.html. Astuce pour faire fonctionner les PNG 32 bits (avec niveaux de transparence) dans Internet Explorer 5.5 et 6. Ça fonctionne dans la majorité des cas, mais malheureusement pas 100%.

PNG in Windows IE : homepage.ntlworld.com/bobosola. Une autre manière de faire fonctionner les PNG 32 bits dans Internet Explorer.

PNG24 et PNG8 dans IE : midiwebconcept.free.fr/PNG_IE.htm. Encore une.

PNGShot : pngshot.sourceforge.net. Un soft qui sauve automatiquement les captures d'écrans dans des fichiers PNG lors de l'appui de la touche "Print Screen". Il peut également les uploader sur un serveur web et placer l'URL dans le presse-papiers.

TweakPNG : entropymine.com/jason/tweakpng. Affiche le contenu des fichiers PNG, mais sous forme de blocs de données, et non d'image. Cela permet de voir exactement ce qu'il y a comme données en plus de l'image elle-même et d'éventuellement faire des modifications (par exemple pour supprimer le bloc "gAMA" mal interprêté par Internet Explorer 5/6).

PNG Now ! Valid XHTML 1.0 ! Valid CSS !


Contact

Pour tout commentaire ou question, vous pouvez me contacter.