[Résolu] "Transformer" le PNG en GIF pour IE. - Forum Alsacréations : CSS et Standards Web

Auteur
TheReverendEVIL	# 19 Jan 2008 - 10:39:06
Pesni leniny pout 119 Posts	Bonjour à tous. Je n'ai pas vu de sujets a ce propos (peut-être ai-je mal regardé, si c'est le cas, excusez moi). Bref...ce genre de script doit être trés simple je pense. Je cherche simplement un script permetant de permuter une image png, en image gif pour IE (donc en aucun cas un script pour gérer la transparence avec IE), mais de maniere localiser (donc ne pas transformer tous les png en gif). Je ne peux pas mettre l'image en background dans mon CSS (du moins, techniquement, je le peux, mais il risque d'y avoir un affichage aleatoire d'images plus tard, donc j'aimerais savoir faire ca). Ensuite, pourquoi ne pas tout simplement mettre du gif de maniere générale ? C'est simple, le rendu est beaucoup moins bon au niveau des contours. Cela dit, si vous avez une méthode plus éfficace ? J'ai éssayé le script pour gérer la transparence sous IE, mais le resultat n'était pas térrible (mais ca vennait peut-être du script lui-même ? ). Biensur, si possible, j'aimerais comprendre le code, pas seulement faire un bete copier/coller. Je vous donne le lien de mon site : http://www.deathofart.info/ Le script en question est destiné au sofa. (Sinon, le site n'est pas terminé, surtout niveau CSS, donc ne vous inquietez pas si vous voyez des atrocités, c'est juste une multitude de tests. =D). Merci, bonne journée. Modifié par TheReverendEVIL (28 Jan 2008 - 11:33)
Pesni leniny pout 119 Posts
Felipe	# 20 Jan 2008 - 15:59:34
Administrateur 4769 Posts	Bonjour, 1/ IE (IE6) gère parfaitement les PNG qui "ressemblent" à des GIF, c'est-à-dire les PNG-8 comportant une couleur de transparence. 2/ les GIF sont techniquement limités à une palette de 256 couleurs dont une pouvant être transparente. Ton problème est celui qu'IE6 a avec les PNG-24 comportant une couche de transparence (synonymes: PNG-24 avec transparence 8 bit, PNG-24 avec niveauX de transparence, PNG-24 avec couche alpha ou enfin PNG-32) et dont parle la FAQ de ce Forum. Avec les méthodes traditionnelles et si tu ne veux pas recourir à JS ou les filter d'IE6, il ne te reste effectivement qu'à convertir tes images en 256 couleurs dont une transparente. Mais dans ce cas, que tu convertisses des PNG-24 en PNG-8 ou bien en GIF, le résultat sera exactement le même (oui le Gif ça sert vraiment plus à rien, sauf -mauvaise nouvelle- avec les mobiles ) Le problème, c'est qu'on utilise les PNG-24 quand il y a beaucoup de couleurs différentes (plus que 256) et que réduire à 256 couleurs c'est souvent ... moche. Heureusement, il y a des algorithmes plutôt efficaces qui permettent de réduire 'intelligemment' le nombre de couleurs (en tout cas suffisamment bien pour berner l'oeil humain) et Fireworks est un de ceux-là. Il fait même beaucoup mieux puisqu'il permet de conserver la couche alpha (pour les "bons navigateurs") tout en rajoutant la couleur de transparence (qu'IE6 va gérer correctement en passant complètement à côté de la couche alpha, ce qu'on souhaite) Ton image d'origine (PNG-24, 104 ko): L'image créée avec Fireworks (PNG-8 "hybride", 33 ko): Un autre programme PNGnq () est lui gratuit et open source mais malheureusement il fait n'importe quoi avec ton image de sofa , sans que je sache si c'est l'algo utilisé qui est insuffisant ou son implémentation qui est mal faite ... 'fin bref, je le testais pour justement éviter d'utiliser Fireworks $$$ mais c'est mal barré. () pour installer PNGnq, il faut installer 2 fichiers DLLs à la main C'est décrit dans ce billet: http://eriestuff.blogspot.com/2007/11/cross-browser-png8-alpha-transparency.html Ce billet parle aussi d'utiliser OptiPNG pour optimiser quasi-systématiquement le poids des PNG que créent d'autres programmes (idéalement en ligne de commande avec l'option -o7) et il parle d'un SPLENDIDE article de SitePoint sur ces PNG-8 hybrides avec une couleur de transparence ET une couche alpha. Pour info, le résultat "intéressant" obtenu avec PNGnq (à admirer avec IE6 sur un fond coloré) (PNG-8 "hybride" et raté, 54 ko): Il fait mieux qualitativement parlant que Fireworks sur bien d'autres images mais manifestement pas ici Modifié par Felipe (20 Jan 2008 - 16:08) Concours de novembre: racontez-nous une histoire
Administrateur 4769 Posts
TheReverendEVIL	# 28 Jan 2008 - 11:32:37
Pesni leniny pout 119 Posts	Désolé pour le retard. =) Merci beaucoup pour ta réponse. =)
Pesni leniny pout 119 Posts
Felipe	# 16 May 2008 - 20:26:42
Administrateur 4769 Posts	Test avec Web Image Guru: Concours de novembre: racontez-nous une histoire
Administrateur 4769 Posts
Felipe	# 16 May 2008 - 20:27:41
Administrateur 4769 Posts	re sur fond gris Original Fw: pngnq: wig: Modifié par Felipe (16 May 2008 - 20:29) Concours de novembre: racontez-nous une histoire
Administrateur 4769 Posts
Prévenir un modérateur