PNG : Problème de couleur sous Safari 1.x

(reprise du message précédent)

Une question : tu es sur quelle version de Safari?

Parce que justement, au départ j'avais fait une image pour Internet Explorer avec la bidouille, et l'image sans bidouille pour les autres (via le hack !important).

Ca passait donc très bien sur Safari 2.0 et Internet Explorer 6 Windows.

C'est à ce moment-là que l'on m'a averti que ça ne passait pas sous Safari 1.2.3.

J'ai donc mis l'image "bidouillée" pour tout le monde, et là, après quelques actualisations/vidages de cache, on s'est aperçu que ça ne fonctionnait toujours pas.

J'ai Safari 1.0 pour Jaguar et Safari 1.2.4 pour Panther. Le 2 viendra plus tard quand j'évoluerai vers Tiger.
Mais ton problème de couleur ne vient pas de Safari. Il vient de ton "système Tweakpng"
J'ai vu un truc bizarre en mesurant la couleur de l'image "corrigée" sur Photoshop :
A l'ouverture il annonce "profil couleur manquant" je l'ouvre comme il vient sans demander à Toshop d'appliquer "une rectification" et le bleu est un peu plus sombre que le bleu de référence. Donc s'il est plus sombre il s'affichera plus sombre... Logique.
Autrement dit : ton "hack important" est nuisble pour un affichage correct sous ces versions Safari.
Sauf sur IE qui semble aimer cette complexité et l'affiche plus clair quand le png est pareillement bricolé... et plus sombre... quand il est plus clair et non bricolé !
Je joins ici une vignette "non hackée".png8 grise qui mesure exactement #ccc. Et tu fais ton test ?

D'accord, alors je vais faire un essai, si tu veux bien, je vais remettre les bonnes versions des PNG, sans hack ni rien du tout (tant pis pour IE pour le moment), et peux-tu me dire si l'affichage est toujours incorrect?
En tout cas, je suis formel, le problème de couleur apparait bien sur Safari 2.0, j'ai bien vidé le cache, et l'image n'a pas été modifiée.

Aureance a écrit :
Autrement dit : ton "hack important" est nuisble pour un affichage correct sous ces versions Safari.

Le hack !important consiste simplement à utiliser la propriété !important, ce qui a pour effet de préciser que tout changement ultérieur ne devra pas être pris en compte.
Internet Explorer ne comprend pas !important, ce qui permet de lui donner la propriété souhaitée, les navigateurs ayant un comportement normal doivent le prendre ne compte, ça ne doit donc aucunement gêner Safari.

par exemple :

body {
   background-image: url(fondEnPng8.png) !important;
   background-image: url(fondEnPng8SansLaLigneGamaPourIE.png);
}

En faisant quelques recherches, j'ai trouvé quelqu'un qui avait le même problème :
http://forum.macbidouille.com/index.php?showtopic=79478

Et exactement l'inverse :
http://forums.macgeneration.com/vbulletin/showthread.php?t=58081

Encore merci pour ces réponses

pierre6020 a écrit :
Le hack !important consiste simplement à utiliser la propriété !important, ce qui a pour effet de préciser que tout changement ultérieur ne devra pas être pris en compte.
Internet Explorer ne comprend pas !important, ce qui permet de lui donner la propriété souhaitée, les navigateurs ayant un comportement normal doivent le prendre ne compte, ça ne doit donc aucunement gêner Safari.

Je me permets une petite rectification, car cette explication pourrait être mal comprise, et causer de mauvaises surprises à qui en déduirait qu'IE ignore les règles !important.

IE respecte parfaitement la règle !important.

Là où il bugue, et où on peut le hacker comme dans l'exemple ci-dessus, c'est lorsqu'il y a répétition de la même propriété avec deux valeurs différentes et un !important sur la première, [b]dans le même bloc de règles[/i].

Normalement, la règle !important l'emporte, qu'elle soit en premier ou en second.

Mais IE oublie le !important lorsqu'il est suivi de la même propriété répétée dans le même bloc de règle.

Exemple :

p {
color: #000 !important;
color: red;
}

-> le texte du paragraphe sera rouge dans IE : il a oublié le !important.

p {
color: #000 !important;
}
p {
color: red;
}

-> là, le texte est noir dans IE, comme dans les autres navigateurs : il n'a pas oublié le !important.

Deux confusions dans ce post :
1/ J'ai une connection restreinte et je suis obligé de préparer mes réponses hors-ligne. La page de référence restant ouverte hors connection... d'ou la confusion et la dérive vers les transparences png. ( le post à changé par la suite, fini l'alpha en question... et je n'ai pas relu ce qui était déjà écrit )
2/ Quand je fais référence à l'histoire de "hack important" je ne parle pas du "hack ! important.... je pensais au "truc" de l'exemple qui enlève quelque chose dans l'image ( comme dans l'exemple mis en lien par Pierre6020.
Par contre pour une fois que j'ai une explication claire en français sur le sujet du ! important pour I-E. Merci à Laurent Denis.
( Car, quand on passe des explications un peu techniques au traducteur en ligne le résultat est impossible à comprendre )

Encore une fois merci Laurent Denis, j'ignorais cela.

L'auteur de la page en question m'a répondu, il n'a pas plus de précisions sur le comportement de Safari avec les couleurs du Png.

Je pense que je vais passer au Gif, en attendant des jours meilleurs.

Aureance : Je comprends mieux maintenant!
Modifié par pierre6020 (06 Jul 2005 - 00:10)

Bon ! Tout est pour le mieux... Si je comprends bien, tu n'as pas fait le test du carré gris#ccc ( joint plus haut ) sur un background #ccc. Je l'ai fait hier au soir et c'est une reussite. ( j'ai lu aussi les liens MacBidouille et MacAddict ) une des personnes utilise Photoshop et n'a pas plus de chance.
Si ta question n'avait jamais été posée je n'aurais jamais vérifié la chromie à ce point. En Fait : J'ai noté un problème : Je tape dans la palette des couleurs #cccccc et remplis ma selection avec ce gris. La pipette Photoshop m'indique #cccccc mais le colorimètre ( utilitaire Macintosch ) m'indique #c1c1c1. Si j'enregistre ce gris ( pour le web ) sous Photoshop il mesure #c1c1c1. Si je l'envoie sous ImageReady il retombe à #cccccc. C'est un comble.

Tchô. prochain contact sur AIM

Bonsoir, en définitive j'ai supprimé les lignes "Gama" des png, ça passe maintenant bien, excepté sur Safari 1.x.

Une solution serait peut-être d'utiliser Javascript ( ) pour modifier le fond, uniquement pour Safari 1.x.
Encore faudrait-il pouvoir l'identifier à coup sûr, si tant est que Javascript soit activé...

Désolé de ne pouvoir t'en dire plus, mais si tu trouves une solution, n'hésites pas à la poster ici, ça pourrait m'être très utile.

Quatre plages de couleur pour l'exemple de zzzazzz (ayayouuuuuuu)
De gauche à droite, normalement c'est la même couleur ( je crois ?)
#8A1713 #8F1F14 #9F2821 #911B14 ( ê pourquoi toschop y nous enculasse? heing? )

Je n'ai pas essyé de générer un PNG avec autre chose que Photoshop, dois-je essayer avec The Gimp (mac) ?
Je rappelle qu'en GIF les 4 coul sont homogènes
Modifié par zzzazzz (08 Aug 2005 - 09:37)

Tu n'as pas ImageReady avec ton Photoshop ? Moi je fabrique mes images sur Photoshop, et pour les images web, je les envoie sur ImageReady pour l'optimisation et l'enregistrement. En faisant comme ça, les couleurs sont toujours telles qu'elles devraient être. En définitive, pour l'enregistrement, je garde Toshop uniquement pour les .psd et les .tiff.
PS: j'ai encore un vieux Safari d'installé sur une partition. Si tu mets en ligne, je te donnerai des nouvelles du résultat.

Voici le lien qui permettra d'expérimenter. J'y ai ajouté une capture du reglage PNG (par défaut). Je me demande s'il ne faut pas toucher au "aligner sur le web n%"

Le lien en question

Voilà

Et bin même en triturant les options dans Image Ready je n'obtiens pas mieux qu'un PNG généré par GimpShop…
Modifié par zzzazzz (08 Aug 2005 - 14:10)

Avec Safari 1.0 et 1.2 résultats identiques. De gauche à droite et de haut en bas au colorimètre :
#7F110C ( beaucoup plus foncé le GimpShop ) #901B15 #911C16 #911C16
Peut être que ton réglage à 2 couleurs est un peu "léger", je choisirais plûtot 256 ? Et au lieu de PNG-8 je préfèrerais PNG-24 ?
En fait quelle mesure "doit" avoir ta couleur ?

La bonne couleur est la #911C16.
C'est étrange car chez moi tout est en #911C16 sauf la 2ème (toshop+png) qui donne du #902015

Mon reglage en 2 coul est suffisant puisque le pixel fait 1 sur 1. Une seule couleur donc. Je ne vois pas pourquoi le png8 ne ferait pas l'affaire.

Je ne comprend absolument plus rien à cette histoire… Je prendrai le temps de revoir tout ça en profondeur plus tard…
Modifié par zzzazzz (08 Aug 2005 - 15:33)