Comment savoir quel type d'image utiliser?

8

Je travaille sur un site Web qui utilisera des images dans plusieurs applications différentes, des boutons d'action aux avatars en passant par des images plus détaillées. Quels facteurs dois-je prendre en considération pour décider si ces images doivent être jpgs, gifs ou pngs?

website-design images png jpeg gif BenV
la source

Réponses:

6
  • JPG pour les photos ou les différences de couleurs élevées
  • PNG pour les images avec une transparence progressive (fondu de 1 couleur à clair)
  • GIF pour les images avec de petites palettes de couleurs

De toute évidence, essayez chaque image et voyez ce qui ressort de la plus petite taille de fichier. Plus la taille est petite, mieux c'est. Ne vous inquiétez pas non plus de la transparence dans IE6 pour vos PNG, la grand-mère n'est pas aussi préoccupée par l'apparence de votre site qu'elle peut voir des photos de vous dessus.

XOPJ
la source
3

Taille du fichier. Plus la taille du fichier est petite, plus le téléchargement sera rapide pour vos utilisateurs. Optez donc pour la plus petite taille de fichier qui n'affecte pas la qualité de votre image.

(De manière générale, les JPG sont utilisés pour les photographies et les PNG / GIF sont utilisés pour les images de type icône)

John Conde
la source
1
J'ajouterais que pour les captures d'écran / non-photos de l'interface utilisateur - utilisez PNG. JPEG a tendance à horriblement pixéliser les images non photo.
scunliffe
1

Prise en charge du navigateur . Je pense que c'est IE6 ou IE7 et les versions antérieures ne prennent pas correctement en charge les images au format png avec un fond transparent. Il ajoute généralement une couleur de fond géniale.

Jeremy
la source
1
Seul IE6 a des problèmes avec les PNG transparents. IE7-9 leur convient.
bdadam
IE4 et les versions plus récentes prennent en charge le format PNG avec transparence : calendar.perfplanet.com/2010/png-that-works/#paletted
Kornel