28173 sujets

CSS et mise en forme, CSS3

Utilisez vous beaucoup le png?





Pages :
Bonjour,

Voici une question qui me turlupine depuis un certain temps:

J'aimerais savoir si beaucoup de webdesigners utilisent le png dans leurs design de site.
Pour les images ok...mais..

...il faut utiliser nombres de hacks pour les background étant donné qu'avec internet explorer, les images restent collées en haut à gauche.

Je trouve que c'est une perte de temps pour l'instant que de se borner à utiliser du png. Ok c'est plus joli avec des dégradés généralement.

Mais dans l'état actuel des possibilités des browsers(enfin pour etre plus clair-->internet explorer Smiley cligne ) , je pense qu'il vaut mieux encore adapter sa mise en page avec des .gif et des .jpg

Qu'en pensez-vous?
Modifié par Oryo (29 Sep 2006 - 17:18)
Bonjour.

IE7 corrige une partie des problèmes des png. Un obstacle se lève enfin.
Gif est vraiment limité en définition et couleurs.
En gros, png c'est jpg plus le cannal alpha (transparence). Il peux s'y substituer dans la plupart des cas.
Avec png, on est plus libre pour définir les couleurs de fond, et faire des effets.
Salut.

Pour ma part, j'utilise PNG autant que possible. Les "nombreux" hacks à utiliser pour obtenir un rendu convenable sous IE 6 ne sont en fait que 2 (un pour les images en arrière-plan, un pour les images dans le code html), et ne sont nécessaires que si on veut exploiter la transparence ...

GIF est effectivement très limité au niveau des dégradés, mais surtout au niveau des transparences.

Les différences de couleurs qu'on observe parfois entre IE & les autres navigateurs peuvent être supprimées en utilisant PNGOptimizer, par exemple.

Et PNG est un format libre, contrairement à GIF ...

GeorgesM > PNG et JPG ont des différences largement plus importantes que le support ou non de la transparence. A commencer par la compression destructrice de JPG, ce qui n'est pas le cas de celle des PNG-24 ... Les domaines d'utilisation de ces formats sont bien distincts (voir le poids d'une photo "ordinaire" en PNG, comparé à celui de la même photo en JPG)
Il n'y a plus aucune raison d'utiliser le GIF aujourd'hui, et pour régler le problème de rendu des couleurs dans IE, il y a TweakPNG (pour Windows) :
http://www.antp.be/PNG/tweakpng/

Pour rappel, il existe deux types de PNG : le 8 et le 24 bits, le PNG-8 étant équivalent au GIF en nombre de couleurs maximum, mais sa compression est un peu meilleure.

Je ne comprends pas bien le sondage, car le choix d'un format ne se fait pas en fonction de ces critères (logotype, background...), mais en fonction du type de l'image : un image avec peu de couleurs, des à-plats, des répétitions sera idéale pour le PNG-8 ou le GIF. Lorsqu'une même couleur ne se répète pas (typiquement le cas d'une photographie), il faut utiliser le JPEG, ou le PNG-24.
Modifié par pierre6020 (29 Sep 2006 - 14:17)
GeorgesM a écrit :

IE7 corrige une partie des problèmes des png. Un obstacle se lève enfin.


oui, pour ceux qui ont Windows XP ou qui auront Vista, mais pour les autres... Smiley ohwell
Sans compter ceux qui on XP et qui n'installeront peut-être pas IE7



pierre6020 a écrit :
Il n'y a plus aucune raison d'utiliser le GIF aujourd'hui, et pour régler le problème de rendu des couleurs dans IE, il y a TweakPNG (pour Windows) :
http://www.antp.be/PNG/tweakpng/


Et moi qui suis sous Linux, je fais comment ? Smiley cligne


pierre6020 a écrit :

Lorsqu'une même couleur ne se répète pas (typiquement le cas d'une photographie), il faut utiliser le JPEG, ou le PNG-24.


pour une photo c'est tout de même conseillé d'utiliser le jpg, le png produit des fichier avec un poids énorme par rapport au jpg.
J'utilise le format qui m'offre le meilleur rapport qualité/poids de mon image. J'ai une préférence pour le format PNG, même si il m'arrive encore de faire cohabiter GIF et PNG sans scrupules Smiley smile

JuTs a écrit :
Et moi qui suis sous Linux, je fais comment ?

Le problème vient du fait que Photoshop encode un peu maladroitement les PNG-8/PNG-24 et donc ie (maladroit aussi) interprette mal la luminosité des PNG. Toi en bon linuxien tu n'utilise évidemment pas Photoshop mais TheGIMP et tu n'as donc pas ce soucis des PNG sous IE.
noklio a écrit :
J'utilise le format qui m'offre le meilleur rapport qualité/poids de mon image.

Je crois que tu as bien résumé la situation. Smiley biggrin C'est exactement ce que je fait aussi Smiley smile

Je fais tout de même attention quand c'est du PNG qui a la première place (uniquement dans le cas où il y a de la transparence dans l'image évidement) car je n'utilise aucun hack pour mes sites Smiley cligne
JuTs a écrit :
Et moi qui suis sous Linux, je fais comment ? Smiley cligne

Comme moi, tu n'as pas ce problème car tu utilises GIMP (j'utilise également GNU/Linux sur mon poste principal). Smiley cligne

JuTs a écrit :
pour une photo c'est tout de même conseillé d'utiliser le jpg, le png produit des fichier avec un poids énorme par rapport au jpg.

Bien sûr, puisque le PNG-24 est un format de compression sans perte, la différence est logiquement élevée : tout dépend de ce que l'on veut.
pierre6020 a écrit :
Il n'y a plus aucune raison d'utiliser le GIF aujourd'hui, et pour régler le problème de rendu des couleurs dans IE, il y a TweakPNG (pour Windows) :
http://www.antp.be/PNG/tweakpng/

Pour rappel, il existe deux types de PNG : le 8 et le 24 bits, le PNG-8 étant équivalent au GIF en nombre de couleurs maximum, mais sa compression est un peu meilleure.

Je ne comprends pas bien le sondage, car le choix d'un format ne se fait pas en fonction de ces critères (logotype, background...), mais en fonction du type de l'image : un image avec peu de couleurs, des à-plats, des répétitions sera idéale pour le PNG-8 ou le GIF. Lorsqu'une même couleur ne se répète pas (typiquement le cas d'une photographie), il faut utiliser le JPEG, ou le PNG-24.


Je suis entièrement d'accord.
J'utilise tout le temps (surtout au boulot) des images PNG 8 bits et rarement 24bits. Simplement parceque le format dont la dont la compression n'est ou n'était soumise à un breve. Et surtout, un point non ngligeable sur le web, comparé avec le GIF, le PNG 8bits est beaucoup plus legé.
J'avais fait le test pour expliquer à mon chef de projet pourquoi il est intéréssant d'utiliser le PNG au lieu du GIF (qui est hélas encore trop utilisé à mon goût) :
J'ai pris au hasard un fichier GIF assez lourd : 19Ko, je l'ai transformé en PNG 8bits et la ... plus que 54% de taille du départ : ~11Ko !
Après ça dépend, de l'image et surtout du logiciel que vous utilisez : TweakPNG n'est pas le meilleur logiciel pour faire de l'optimisation du PNG : il est préférable d'utiliser PNGout (en ligne de commande) ou PNGGauntlet (en interface graphique utiliant le prog en ligne de comande énoncée ci-dessus).
Modifié par heyman85 (30 Sep 2006 - 12:57)
Plus je vous lis plus je sens votre préférence pas forcément justifiée pour le PNG-8...

Je voudrai rajouter une chose : PNG-8 est effectivement une alternative au GIF, avec une meilleure qualité de compression comme il a été dit mais PNG-24 n'est surement pas relié au JPG !

Son principal atout est sa gestion de la diffusion des couleurs, hors les photos et/ou images complexes sont bien trop détaillées pour du PNG-24. Par contre, là encore à l'inverse de ce qui a été dit, il est dans bien des cas préférable au GIF et au PNG-8 !

Je vais vous donner un exemple simple et en image Smiley smile

> http://img.noklio.org/alsa/png-screen.png

Le fichier .psd est composé de 3 dégradés superposés. L'image (1px par 600px) est destinée à etre répétée sur un axe en fond de page.

PNG-24 : 199 octets
PNG-8 : 767 octets (palette réduite à 134 couleurs)
GIF : 1251 octets (palette réduite à 134 couleurs également)

Voilà toute la force du PNG-24 : 4x plus optimisé que PNG-8, et 6x plus que GIF ! Un format loin d'être désavantagé dès lors qu'il sagit de diffusion de couleur (dégradés) car non seulement plus léger mais aussi de bien meilleure qualité ! Ne sous-estimez pas son utilité Smiley smile
Modifié par noklio (30 Sep 2006 - 13:29)
J'utilise le PNG au maximum.
J'aurais bien voulu l'utiliser à la place des GIFs animés, mais je ne sais pas comment faire. Ou plutôt quel logiciel utiliser...
J'utilise le PNG, car c'est un format qui donne des images de bonne qualité comparé au gif (que j'utilisais avant), de plus, ce n'est pas un format "lourd", et donc utile pour des sites web.
a écrit :
Voilà toute la force du PNG-24 : 4x plus optimisé que PNG-8, et 6x plus que GIF ! Un format loin d'être désavantagé dès lors qu'il sagit de diffusion de couleur (dégradés) car non seulement plus léger mais aussi de bien meilleure qualité ! Ne sous-estimez pas son utilité smile

Merci bien pour l'info, je me suis pas amusé à tester donc je l'ignorais, c'est bon à savoir Smiley smile
a écrit :
Voilà toute la force du PNG-24 : 4x plus optimisé que PNG-8, et 6x plus que GIF ! Un format loin d'être désavantagé dès lors qu'il sagit de diffusion de couleur (dégradés) car non seulement plus léger mais aussi de bien meilleure qualité ! Ne sous-estimez pas son utilité smile


Tout ça est vrai, même si il donne un bien meilleur rendu le png 24 reste quand même nettement plus lourd que le jpeg avec lequel on peut choisir la compression.

Existe il des outils pour choisir la compression d'un png24 pour l'alléger ?

Tout ça est intérressant et me fait me rendre compte que j'utilise pas assez le png, l'habitude...

Cela dit, j'utilise jamais le gif qui est vraiment trop limité quand je dois faire un fichier avec de la transparence, je passe donc par du png24 et m'emmerde avec les hacks que je controle très mal pour le cas ou l'image est dans l'html (et meme en background avec un filter j'arrive à avoir des problèmes...), et géneralement je finis par feinter avec du jpeg. Smiley confused

Je me remet en question là.... Smiley lol
Quitte à feinter, autant le faire avec du PNG en supprimant simplement la transparence ...

Comme indiqué plus haut, e PNG ne peut pas remplacer JPEG pour des photos. Il n'est indiqué "que" pour des images plus simples, avec moins de couleurs. Le terrain de jeu du GIF, en gros, mais avec plus de possibilités.
Modifié par Sopo (30 Sep 2006 - 21:26)
Benjamin D.C. a écrit :
Il y aussi le PNG-32 Smiley cligne


Salut,

Ce que tu appelles le PNG-32 n'est-il pas tout simplement le PNG-24 avec canal alpha ?
Pages :