Utilisation et compatibilite des images PNG 24

(reprise du message précédent)

imonalsacreations a écrit :
Meme si elle semble correcte sur un fond blanc, elle ne le sera pas sur le site en question, car il y des elements divers dessous (un background texture bois, du blanc, et des photos differentes sur chaque page). Le GIF transparent ca marche sur un fond uni car on peut y appliquer un cache pour se fondre correctement, tout comme j'ai essayé les PNG 8 transparents ca ne fonctionne pas pour mon cas. De plus sur le site j'ai besoin de resoudre se probleme car j'ai d'autres images transparentes avec des ombres donc la le GIF ne marchera pas.

Alors... Pour faire simple : L'image en gif de moins bonne qualité de transparence n'est utilisée que pour IE6 ; donc ce n'est pas grave s'il y a une petite bordure blanche, ou si le découpage n'est pas aussi fluide.

La subsitution d'image est la technique la plus propre et la plus robuste qui existe. Pour t'en convaicre, visite le forum avec IE6, tu verra que la dégradation des icones du menu principal n'est pas gênante.

Laurie-Anne a écrit :


Alors... Pour faire simple : L'image en gif de moins bonne qualité de transparence n'est utilisée que pour IE6 ; donc ce n'est pas grave s'il y a une petite bordure blanche, ou si le découpage n'est pas aussi fluide.

La subsitution d'image est la technique la plus propre et la plus robuste qui existe. Pour t'en convaicre, visite le forum avec IE6, tu verra que la dégradation des icones du menu principal n'est pas gênante.

Je vois pourtant des sites qui s'en sortent sans cette frange blanche autour.
Je vois aussi sur les sites des divers techniques un resultat identique a un autre navigateur.
Il exsite bien une solution je pense.
Personne ne veut essayer avec les fichiers que j'ai mis a dispo ?

Bonjour,

As-tu visité le lien et tenté d'utiliser le script que je te proposais un peu plus tôt ?

Ceci étant dit, si tu tiens réellement "à avancer", et à "passer du bon côté de la force", il ne serait pas inutile de tenir compte des remarques qui t'ont été faites depuis le début de l'ouverture de ton sujet, de reprendre les choses depuis le début...Apprendre ou réapprendre certaines choses, lire et exécuter des tutoriels, regarder comment les autres font et pourquoi ils le font

Si telle est ta démarche, tu es au bon endroit, si tu attends que l'on te donne une solution clé en main (ce qui a pourtant largement été fait depuis le début...) sans "mouiller le maillot", nous allons rapidement arrivé dans une impasse

Concernant les remarques de Laurie-Anne (à relire au besoin !) et notamment en ce qui concerne l'utilisation d'images porteuses de sens et la place qu'elles doivent occupées dans ton code html, je me permets de te signaler qu'elles sont également valable pour ton menu (Pour t'en persuader, tentes de naviguer sur ton site en désactivant les images...)

Fais également le test de navigation en desactivant ta ou tes feuilles de styles...édifiant non ?
Non, ce n'est pas du masochisme, cela peut correspondre à certaines conditions d'utilisation...tenter d'y remédier correspond à certaines valeurs que nous apprécions par ici (accessibilité, interoperabilité, respect des normes, etc...)

Bref, il te reste "un peu" de travail, qu'il faudra peut-être confier à des personnes dont c'est le métier, si tu n'as pas le temps de t'y atteler ou les capacités pour mettre en oeuvre ce qui doit l'être pour un projet qui semble professionnel...

Quoiqu'il en soit, bon courage et bonne continuation,
Cdt,
Sylvain

Merci pour ces conseils.
J'ai pour cela (cf. fichier mis en ligne) fais tous les tests que l'on m'a decrit et divers techniques trouvées a droite et a gauche sur divers images PNG et ca ne marche pas.

J'ai fait cela pour justement essayer avec un fichier tres simple et neuf et non pas un site ou j'ai certainement (aux vues des remarques a droites et a gauche) commis des erreurs CSS.

Mais il semblerait que personne n'ai pris le temps de telecharger ou d'essayer avec le fichier que j'ai mis a dispo. C'est juste 4 images PNG differentes sur un bloc vert.

Deplus comme, je le suggerais dans mon poste initial, pourquoi ne pas faire un ultime tuto, tres didactic s'adressant aux debutants pour resoudre ce probleme d'affichage PNG, puisque rien n'existe expliqué de facon claire sur le net (enfin j'ai pas trouvé).

Avant que je n'oublie, le commentaire placé avant ta déclaration de Doctype dans ta page html fait basculer IE6 en mode Quirk, ce qui n'est pas sans poser certains soucis.
A lire (et liens associés)

Salut,

imonalsacreations a écrit :
Mais il semblerait que personne n'ai pris le temps de telecharger ou d'essayer avec le fichier que j'ai mis a dispo. C'est juste 4 images PNG differentes sur un bloc vert.

Il y a plus de 25000 membres sur ce forum, si à chaque question de chacun d'entre nous il fallait télécharger les fichiers, les décompresser, les réordonner, identifier le problème, le résoudre, supprimer les fichiers ensuite, tu imagine le temps que cela pourrait représenter ?
Tous les gens ici sont bénévoles et ont peut être la volonté d'aider, mais dans une certaine limite. Aussi, de manière générale, si tu as des choses à faire tester par les membres du forum, il est plus simple de mettre un contenu affiché en ligne plutôt qu'un zip à télécharger.

Quand aux tutoriels sur les images transparentes en PNG sur IE6, il en existe un certain nombre en ligne, et si personne ici n'a réalisé de tutoriel sur le sujet, c'est certainement qu'il n'y a pas forcément lieu de le faire.

Je plussoie Laurie-Anne et 6l20... le plus propre et le plus solide étant d'utiliser des gifs pour IE6. A moins que tu aies 50.000 images transparentes ou que ton site soit visité par 80% d'utilisateurs ayant IE6, c'est quand même le mieux.

Ceci dit, je viens de tester iepngfix avec tes fichiers, et ça marche, sauf pour la seconde image (fireworks) qui reste en fond noir.

J'ai fait exactement comme dit plus haut sauf qu'il faut aussi spécifier dans le fichier htc l'emplacement exact du blank.gif.

Mais tu vas pas aimer le "flash gris"

Salut,
Avais-tu essayer le tuto que je t'avais indiqué? Pour moi ça a très bien fonctionné. Mon image d'en-tête sur mon site est en fond transparent sur 2 couche de background. Je n'ais aucune démarcation.

J'avais essayé avec ton image png24 que tu avais mis, et ça fonctionnais très bien via Firework.

Laurie-Anne a écrit :
La subsitution d'image est la technique la plus propre et la plus robuste qui existe.

Oui à 200%. Je me demande d'ailleurs pourquoi certains s'évertuent à utiliser d'autres techniques. Quand IE6 avait 50% des parts de marché, pourquoi pas, mais cette époque est révolue.

imonalsacreations a écrit :
Je vois pourtant des sites qui s'en sortent sans cette frange blanche autour.

Oui, mais les techniques utilisées sont relativement difficiles, et surtout ont des effets secondaires pour le moins prise de tête.

imonalsacreations a écrit :
Je vois aussi sur les sites des divers techniques un resultat identique a un autre navigateur.

Les deux solutions sont l'utilisation d'un filtre DirectX AlphaImageLoader d'une part, et l'insertion de l'image dans la page en VML. (Si tu n'as rien compris à cette phrase, je te suggère de te limiter au remplacement de ton image par un GIF ou un PNG en couleurs indexées. )
Modifié par Florent V. (07 Dec 2009 - 21:11)