Woher weiß ich, welchen Bildtyp ich verwenden soll?

8

Ich arbeite an einer Website, auf der Bilder in verschiedenen Anwendungen verwendet werden, von Aktionsschaltflächen über Avatare bis hin zu Bildern mit größeren Details. Welche Faktoren sollte ich berücksichtigen, um zu entscheiden, ob diese Bilder JPGs, GIFs oder PNGs sein sollen?

website-design images png jpeg gif BenV
quelle

Antworten:

6
  • JPG für Fotos oder hohe Farbunterschiede
  • PNG für Bilder mit allmählicher Transparenz (von 1 Farbe auf klar verblassen)
  • GIF für Bilder mit kleinen Farbpaletten

Probieren Sie natürlich jedes Bild aus und sehen Sie, was bei der kleinsten Dateigröße herauskommt. Je kleiner die Größe, desto besser. Sorgen Sie sich auch nicht um die Transparenz in IE6 für Ihre PNGs. Oma ist nicht so besorgt darüber, wie Ihre Website aussieht, nur dass sie Bilder von Ihnen darauf sehen kann.

XOPJ
quelle
3

Dateigröße. Je kleiner die Datei, desto schneller wird sie für Ihre Benutzer heruntergeladen. Wählen Sie also die kleinste Dateigröße, die Ihre Bildqualität nicht beeinträchtigt.

(Im Allgemeinen werden JPGs für Fotos und PNGs / GIFs für symbolähnliche Bilder verwendet.)

John Conde
quelle
1
Ich würde das für UI-Screenshots / Nicht-Fotos hinzufügen - benutze PNG. JPEG neigt dazu, Nicht-Fotobilder schrecklich zu pixelieren.
Scunliffe
1

Browser-Unterstützung . Ich denke, es ist IE6 oder IE7 und älter und unterstützt keine PNG-basierten Bilder mit transparentem Hintergrund. Es fügt normalerweise etwas funky Hintergrundfarbe hinzu.

Jeremy
quelle
1
Nur IE6 hat Probleme mit transparenten PNGs. IE7-9 ist in Ordnung mit ihnen.
Bdadam
IE4 und neuere Unterstützung palettiert PNG mit Transparenz : calendar.perfplanet.com/2010/png-that-works/#paletted
Kornel