Images, qualité, poids et dilemme

Le
romer
Hi,

J'ai une banière aux 2 coins supérieurs arrondis sur un fond foncé :
pour que la découpe de ces 2 coins ne se voit pas et se fonde sur le
fond de la page, deux solutions :
1) Je fais les coins de la même couleur que le fond et évidemment ça
marche.
2) Je fais des coins transparents en gif ou png.
ou alors 3) Je ne fais pas de coins arrrondis ;-)

Inconvénient à 1) : si je change ou si on me fais changer le fond, faut
aussi changer le fond des coins. De plus avec un dégradé horizontal du
fond de la page , c'est presque infaisable.

J'ai donc choisi 2) mais

- le format gif me donne une image dégradée et pour une banière, c'est
pas top (poids 60 Ko)
- le format png 8 bits : idem gif
- le format png 24 bits (poids 250 ko), c'est top mais l'image est
lourde à charger ! Trop. De plus tous le navigateurs vont-ils la traiter
?

Donc dilemme :
Comment améliorer un gif sans l'alourdir ou comment réduire le poids
d'un png 24 bits sans l'altérer ?

Que feriez-vous ?

Merci.
--
A+

Romer
Vidéos High-Tech et Jeu Vidéo
Téléchargements
Vos réponses Page 1 / 2
Gagnez chaque mois un abonnement Premium avec GNT : Inscrivez-vous !
Trier par : date / pertinence
METIS
Le #22073161
Bernd wrote:
...
Donc dilemme :
Comment améliorer un gif sans l'alourdir ou comment
réduire le poids d'un png 24 bits sans l'altérer ?



==> Les coin arrondis, c'est toujours un peu galère.
Il faut les réaliser sur un arrière plan de la couleur
définitive du fond, comme ça, la frange de bord est raccord.
Si tu les fais sans fond, avec transparence, en fonction de
la teinte des fond qui peuvent se changer, ça n'ira que sur
des fonds clairs ou des fonds foncés, selon les cas.
- Les transparences de PNG ne marche avec IE6 au moins.
Si ta cible de clientèle n'utilise pas du tout IE, ok, ça
peut le faire...(;o))))))))

--
<|[;o)) METIS
Rakotomandimby (R12y) Mihamina
Le #22073151
Bernd wrote:
1) Je fais les coins de la même couleur que le fond et évidemment ça
marche.
2) Je fais des coins transparents en gif ou png.
ou alors 3) Je ne fais pas de coins arrrondis ;-)


[...]
Que feriez-vous ?



Je suggererais une méthode supplémentaire purement javascript:
http://www.html.it/articoli/niftycube/index.html
Désolé c'est en anglais...

--
Serveurs infogérés:
http://www.infogerance.us/infogerance/packs-serveurs-infogeres
Patrick 'Zener' Brunet
Le #22073141
Bonsoir.

"Rakotomandimby (R12y) Mihamina" message de news: g3m2av$280q$
Bernd wrote:
> 1) Je fais les coins de la même couleur que le fond et
> évidemment ça marche.
> 2) Je fais des coins transparents en gif ou png.
> ou alors 3) Je ne fais pas de coins arrrondis ;-)
[...]
> Que feriez-vous ?

Je suggererais une méthode supplémentaire purement
javascript:
http://www.html.it/articoli/niftycube/index.html
Désolé c'est en anglais...




Bon, en gros ça consiste à rajouter des lignes de 1px d'épaisseur et avec
une suite de longueurs en sinus pour dessiner l'arrondi.
Ca peut se faire en CSS et sans Javascript.
Au besoin avec un bout de PHP pour insérer automatiquement les minilayers
supplémentaires.

--
Cordialement.
--
* Patrick BRUNET www.ipzb.fr
* E-mail: lien sur http://zener131.eu/ContactMe
romer
Le #22073121
METIS
==> Les coin arrondis, c'est toujours un peu galère.
Il faut les réaliser sur un arrière plan de la couleur
définitive du fond, comme ça, la frange de bord est raccord.
Si tu les fais sans fond, avec transparence, en fonction de
la teinte des fond qui peuvent se changer, ça n'ira que sur
des fonds clairs ou des fonds foncés, selon les cas.



Là je ne comprends pas très bien - je les ai fait sans fond - c'était le
but - et ça marche sur tous les arrière-plans quels qu'ils soient. Tu
veux dire que le contraste est meilleur sur du clair si la photo/image
est foncée et vice-versa ? C'est vrai mais c'est valable pour toute
surface sur une autre - Faut un certain contraste de ton entre elles.

- Les transparences de PNG ne marche avec IE6 au moins.
Si ta cible de clientèle n'utilise pas du tout IE, ok, ça
peut le faire...(;o))))))))



Ça le fait effectivement mais le point de départ est que du png 24 bits,
c'est lourd à charger. Faut donc une clientèle avec ADSL et sans IE !
Je sens que ça limite grave les choses...
--
A+

Romer
romer
Le #22073131
Patrick 'Zener' Brunet
Bon, en gros ça consiste à rajouter des lignes de 1px d'épaisseur et avec
une suite de longueurs en sinus pour dessiner l'arrondi.



Ça je connais et en ai fait pour des cadres arrondis avec fond de
couleur ou pas mais sans photo à l'intérieur.
Vous pensez que ça marche aussi avec une photo ?
Faudra essayer mais je ne sais pourquoi, j'ai un doute.
--
A+

Romer
Denis Beauregard
Le #22073111
Le Sun, 22 Jun 2008 21:01:41 +0200, (Bernd)
écrivait dans fr.comp.infosystemes.www.auteurs:

METIS
==> Les coin arrondis, c'est toujours un peu galère.
Il faut les réaliser sur un arrière plan de la couleur
définitive du fond, comme ça, la frange de bord est raccord.
Si tu les fais sans fond, avec transparence, en fonction de
la teinte des fond qui peuvent se changer, ça n'ira que sur
des fonds clairs ou des fonds foncés, selon les cas.



Là je ne comprends pas très bien - je les ai fait sans fond - c'était le
but - et ça marche sur tous les arrière-plans quels qu'ils soient. Tu
veux dire que le contraste est meilleur sur du clair si la photo/image
est foncée et vice-versa ? C'est vrai mais c'est valable pour toute
surface sur une autre - Faut un certain contraste de ton entre elles.



Agrandis de beaucoup ces images. Tu verras que le bord n'est pas
uni s'il a été fait en créant une image plus grande et en la
réduisant. D'où le commentaire sur le clair et le foncé.

Par contre, si c'est fait immédiatement à l'échelle finale, la
couleur sera unie et cela ne fera pas de différence selon le fond.

- Les transparences de PNG ne marche avec IE6 au moins.
Si ta cible de clientèle n'utilise pas du tout IE, ok, ça
peut le faire...(;o))))))))



Ça le fait effectivement mais le point de départ est que du png 24 bits,
c'est lourd à charger. Faut donc une clientèle avec ADSL et sans IE !
Je sens que ça limite grave les choses...



Moi je regarderais ce que font les sites à grand volume dans ce
cas, ainsi que les blogs de série.


Denis
romer
Le #22073101
Denis Beauregard wrote:

>> ==> Les coin arrondis, c'est toujours un peu galère.

Moi je regarderais ce que font les sites à grand volume dans ce
cas, ainsi que les blogs de série.



Dernière question : en bricolant une image .jpg dans tous les coinsavec
un soft d'image, ne peut-on vraiment pas la rendre transparente bien que
cela soit démenti partout sur le web et ailleurs ?
--
A+

Romer
Denis Beauregard
Le #22073091
Le Sun, 22 Jun 2008 22:42:39 +0200, (Bernd)
écrivait dans fr.comp.infosystemes.www.auteurs:

Denis Beauregard wrote:

>> ==> Les coin arrondis, c'est toujours un peu galère.



Moi je regarderais ce que font les sites à grand volume dans ce
cas, ainsi que les blogs de série.



Dernière question : en bricolant une image .jpg dans tous les coinsavec
un soft d'image, ne peut-on vraiment pas la rendre transparente bien que
cela soit démenti partout sur le web et ailleurs ?



Les formats GIF et PNG permettent la transparence, mais pas JPEG.


Denis
SAM
Le #22073071
Bernd a écrit :

Dernière question : en bricolant une image .jpg dans tous les coinsavec
un soft d'image, ne peut-on vraiment pas la rendre transparente bien que
cela soit démenti partout sur le web et ailleurs ?



Je pense qu'en effet c'est peine perdue.

Si le truc de coin arrondi fonctionne avec un fond en couleur, ne
peut-on imaginer avoir l'image (jpg) en image de fond du div à coins
arrondis ?

Non ça ne fonctionne pas, le truc-bidule rajoute une bande de hauteur
égale au rayon de l'arrondi.

De ttes façons c'est pour justement se passer d'images :

AMHA il faut une image la plus légère possible
Si la bannière n'est pas belle en gif, la revoir en mode 256 couleurs ?
(au lieu de la traiter en millions pour en baisser le nbre après)

--
sm
Sergio
Le #22073061
Bernd a utilisé son clavier pour écrire :

==> Les coin arrondis, c'est toujours un peu galère.
Il faut les réaliser sur un arrière plan de la couleur
définitive du fond, comme ça, la frange de bord est raccord.
Si tu les fais sans fond, avec transparence, en fonction de
la teinte des fond qui peuvent se changer, ça n'ira que sur
des fonds clairs ou des fonds foncés, selon les cas.



Là je ne comprends pas très bien - je les ai fait sans fond - c'était le
but - et ça marche sur tous les arrière-plans quels qu'ils soient. Tu
veux dire que le contraste est meilleur sur du clair si la photo/image
est foncée et vice-versa ? C'est vrai mais c'est valable pour toute
surface sur une autre - Faut un certain contraste de ton entre elles.



Deux problèmes différents peuvent arriver :
- T'as mis une zone transparente. Néanmoins, ton logiciel de dessin
aura "antialiasé" le contour. Du coup, sur les bords il y aura des
pixels qui seront entre ta couleur de bordure et ta couleur de fond
(donc non-transparents). Si ta couleur de fond change par rapport à la
couleur initiale, ça se verra.

- T'as dessiné sur un fond égale à la couleur de fond sans mettre de
transparence. À moins que ce ne soit une couleur primaire, suivant les
réglages colorimétriques de l'ordinateur, il se peut que le rendu de
l'image et de ton fond soient différents (dur !).

--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org
Publicité
Poster une réponse
Anonyme