romy.tetue.net

Développement front et conception web
X-HTML, CSS, SPIP, sémantique et accessibilité

Paris-Web 2010, j’y vais ! (du 14 au 16 octobre).

Image PNG sous IE


6 octobre 2005,
par Romy Duhem-Verdière

Partagez cet article : Voter pour cet artice sur hellocoton.fr Netvibes Yahoo myspace Technorati stumbleupon Digg Del.ico.us

Nouveau format d’image idéal pour les logos et icônes, le PNG gère remarquablement la transparence.

Le PNG est particulièrement approprié lorsqu’il s’agit d’enregistrer des images synthétiques destinées au Web comme des graphiques, des icônes, des images simples comprenant des aplats de couleurs et peu de dégradés, ou des images réprésentant du texte.

Les atouts du PNG ?

PNG fait tout ce que fait un GIF, et même plus. Il le surpasse puisqu’il n’est pas limité à 256 couleurs, mais à 16 millions de couleurs. Il gère de plus le degré de transparence (le fameux canal alpha), en permettant d’échelonner la translucidité d’un pixel, de l’opacité complète à la transparence (256 niveaux de transparence, par opposition à la transparence binaire des GIF).

Concrètement ? les bords de l’image PNG se fondent à la couleur d’arrière-plan sur laquelle elle est affichée... sans plus aucun problème de contours crénelés comme avec le GIF transparent ! Si c’est pas génial ! Regardons cela d’un peu plus prés :

JPGGIFPNG
GIF - 1.4 ko
En JPG, point de transparence : les pixels du bord sont de couleur dégradée vers le blanc.
GIF - 1.7 ko
Le fond du GIF est bien transparent, mais les pixels du bord sont (comme pour le JPG) de couleur dégradée vers le blanc.
GIF - 2 ko
Les pixels du bord sont bien translucides, puisqu’ils laissent transparaître le quadrillage du fond ;)

Tout se gâte avec IE...

Dès avant la sortie d’Internet Explorer 4 (en 1997), Microsoft avait promis le support du PNG-32. Chose qui n’arriva pas. Ni pour IE5, ni pour IE6/Win. Ce navigateur sait afficher les PNG, mais a la fâcheuse habitude d’afficher toute zone partiellement transparente en gris. Démonstration par l’exemple :

Image PNG Ce que vous devriez voir Ce qu’affiche IE
PNG - 7.8 ko
too_cool_corner_fr.png
Voici le fichier PNG testé, sur un damier noir & blanc
(Source : Trop Cool pour Internet Explorer)
JPEG - 4.4 ko
sous Firefox
Les bords de l’image se fondent au noir comme au blanc du damier.
JPEG - 4.1 ko
sous IE
Internet Explorer, qui ne sait pas interpréter le transparence du PNG, l’affiche en gris...

Nombreux sont les designers qui regrettent l’absence de support correct de la transparence Alpha PNG dans IE. Beaucoup évitent tout simplement d’utiliser cet excellent format graphique. Les autres bidouillent pour contourner le bug d’IE : en retravaillant le fichier, incorporant la couleur d’arrière-plan à l’image, en utilisant du Javascript ou des styles en CSS, en ajoutant des plugins barbares, behaviors, et autres bidouillages... en attendant que Microsoft daigne réparer les bogues de son navigateur.

Le PNG est un format d’images numériques libre de droit, qui a été créé pour remplacer le format propriétaire GIF, dont la compression était soumise à un brevet. Ce format n’est pas si nouveau, puisque son histoire commence en 1994.

Vos commentaires

  • Le 24 août 2006 à 02:22, par myahoo

    Là où l’on voit qu’il y a un sacré goût de paradoxe, c’est que Paint, aussi de Microsoft, gère les PNG et même leur transparence ! Bon, il ne faut pas lui en demander trop, puisque les fonctions sont limitées, mais il est bien utile pour une classique capture d’écran. Pourtant, il a été question qu’il disparaisse dans le prochain Paint.

    Après, pour plus de fonctions, PhotoFiltre se débrouille bien sous Windows, et autrement on peut faire appel à Gimp. Pour tout résoudre il a même été question de faire une extension de Firefox étant un éditeur PNG !

    Mais ne rêvons pas trop, tout n’arrive pas en un clin d’oeil !

  • Le 17 septembre 2006 à 19:11, par biloubil

    Nous arrivons à le 7eme version de IE, et rien n’à l’air de changer.Je ne comprend pas ce qui le pousse (bill gates)à freiner l’evolution du web.IL est vraiment temps que le monde prenne conscience et cesse d’utiliser ce p%£µ£$ de navigateur.....

  • Le 2 mai 2007 à 09:59, par gerard

    c’est vraiment nul qu’ie n’interprète pas le png !
    photographe de métier, je trouve que pour le graphisme des sites internet , c’est la solution pour changer des habituels visuels sans pour autant toucher à flash qui est moins bien référencé par les moteurs de recherche !
    à quand une pétition pour faire bouger Bill ?

Un message, un commentaire ?

Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d'abord sur gravatar.com (gratuit et indolore) et n'oubliez pas d'indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici
  • Ce formulaire accepte les raccourcis SPIP [->url] {{gras}} {italique} <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Suivre les commentaires : RSS 2.0 | Atom



© 2000-2010 Romy Duhem-Verdière | Certains droits réservés | Qui suis-je ? | Contact | Aide | Top ↑
Vérifiez vous-même la qualité du code de cette page en la soumettant aux validateurs XHTML et CSS.