Optimiser png web

Mage-Li

Membre actif
29 Mai 2004
399
14
42
www.ouf-web.com
Bonjour,
J'ai créé un png transparant pour un logo, mais une foie affiché sur le web il y a des salles pixels blanc qui l'entourre.
J'ai bidouillé toute les optionsdisponible pour l'enregistrement mais rien a faire !

Je pense donc qu'il y a quelque chose a faire (ou ne pas faire) avant l'enregistrement.
Je tiens a présiser que mon logo est du texte, j'ai testé un cout de painseau pour voir et Oh surprice pas de pixelisation blanche !!
Es que ca peut venir du fait que c'est du texte ?
 
Et avec quel logiciel ?

Dans Photoshop, en PNG 24, ça ne pose normalement pas de problème. Mais c'est super lourd le PNG 24 et les transparences ne marchent pas avec Internet Explorer !

En PNG 8 il faut travailler le fond dans la même couleur que le fond de ta page et faire un détourage net (non progressif). Comme pour un gif quoi... mais en plus lourd.

Je me suis appliqué à utiliser le PNG à une période mais je dois dire que j'ai du mal à trouver un cas où il est plus opportun que le Gif ou le Jpeg
 
PNG-8
J'utilise le png pour la transparance de celui-ci. Je ne pense pas que sur le web un autre format le fasse, mais je peux me tromper je ne suis qu'un amateur.

Niconemo, je pense avoir compris grace a toi mon probléme. J'avoue ne pas savoir comment dire a photoshop de faire un :
détourage net (non progressif)
sur du texte (comme sur autre chose !). Par contre avec l'outil netteté, j'arrive a avoir un détourage net qui révélle les fameux pixel blanc une foi que j'enregistre mon png. Donc le prob vient bien de la !

Comment avoir un détourage net sur du texte ?

Merci

EDIT : j'ai trouvé ! C'est dans les options concernant le texte. il faut sélectionner "sans" a coté des deux "aa"
Merci encor a vous deux ;)

EDIT2 : J'ai de nouveau un prob ! Avec l'option "sans" j'obtiens le meme résultat qu'avec l'outil netteté. C'est super crade ! Il faut que j'augmente la résolution de mon *.psd (plus de 300dpi) mais ca reste tjs pas tres net...
 
Fais une petite recherche sur gif, jpeg et png, on en a de nombreuses fois parlé sur ce forum et expliqué ces formats d'image, les stratégies d'usage, les méthodes d'optimisation, pourquoi ça fait des pixels blancs, qu'est-ce que le lissage, comment la transparence est constituée et gérée, etc. Ça te sera utile pour comprendre et savoir ce qu'il te faut faire.

Dans Photoshop, tu peux modifier le lissage des textes voir le supprimer, c'est en bas à droite de la palette Caractère.

Tu peux aussi faire une recherche ce qu'est la résolution, car pour l'affichage à l'écran ça n'a aucune espèce d'importance, ce qui compte ce sont les dimensions en pixels de ton image, sachant que chaque pixel de ton image sera rendu par un pixel à l'écran. Cela correspond à l'affichage à 100 % dans Photoshop, où donc 1 pixel du fichier image correspond à 1 pixel de l'écran.
 
Mais c'est super lourd le PNG 24 et les transparences ne marchent pas avec Internet Explorer !

Niconemo (...et les autres),
tu connais certainement ce "patch" pour afficher les PNG 24 sous IE...
Bloc de code:
width: 80px;
height: 80px;
background-position: top left;
background-repeat: no-repeat;
/* La première ligne permet d'utiliser l'ombre au format png pour la plupart*/
/* des navigateur. La seconde utilisera le format gif pour IE. */
background: url("image.png") !important; 
background-image:url(no-image);
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src="image.png");
ça marche bien, nan ???