Bildformate erklärt: JPG, PNG, WebP, AVIF, GIF, BMP und ICO
Welches Format du für Fotos, Logos, Screenshots, Webseiten, Druck und Social Media verwenden solltest, und warum.
Jedes Bildformat ist ein Satz Kompromisse zwischen Dateigröße, Qualität, Transparenz, Animation und Kompatibilität. Wähle das falsche, und du bekommst entweder eine aufgeblähte Datei oder ein unscharfes Logo. Dieser Ratgeber zeigt, worin jedes Format gut ist, mit den Zahlen, die du zum Entscheiden brauchst.
Die zwei Arten von Komprimierung
Verlustfreie Komprimierung speichert jeden Pixel exakt und findet lediglich einen effizienteren Weg, dieselben Daten zu schreiben, so wie ein ZIP. Öffne und speichere ein verlustfreies Bild tausendmal, und es bleibt unverändert. PNG, BMP, GIF und verlustfreies WebP funktionieren so.
Verlustbehaftete Komprimierung wirft Information weg und zielt auf die Details, für die das menschliche Auge am wenigsten empfindlich ist: feine Textur, subtile Farbunterschiede, hochfrequentes Rauschen. Das Ergebnis kann ein Zehntel der Größe einer verlustfreien Datei haben, ohne sichtbaren Unterschied, aber jedes erneute Speichern verliert ein bisschen mehr. JPG, verlustbehaftetes WebP und AVIF funktionieren so.
Regel eins folgt direkt daraus: Nimm verlustbehaftete Formate für Fotos, die voller Rauschen und Textur sind, die niemand vermisst, und verlustfreie Formate für Grafiken mit scharfen Kanten, flachen Farben und Text, wo jeder Pixel zählt.
Format für Format
JPG (JPEG)
Das Fotoformat seit 1992. Verlustbehaftet, 8-Bit-Farbe, keine Transparenz, keine Animation. Wird von allem unterstützt, was je gebaut wurde. Eine Qualitätseinstellung von 0 bis 100 steuert den Kompromiss; 80 bis 85 ist der Sweet Spot für den Alltag. Seine Schwächen sind sichtbare „Blockbildung“ bei niedriger Qualität, Ringe um scharfe Kanten und die fehlende Transparenz. Nimm es für Fotos, die irgendwohin außerhalb eines Browsers gehen: E-Mail, Druck, Marktplätze, ältere Software.
PNG
Verlustfrei, bis zu 16-Bit-Farbe, volle Alpha-Transparenz, keine Animation (APNG existiert, ist aber selten). Die richtige Wahl für Logos, Icons, Screenshots, Diagramme, Charts und jedes Bild, das einen transparenten Hintergrund braucht. Seine Schwäche ist die Größe: Ein PNG-Foto kann zehnmal so groß sein wie ein JPG. Verwende PNG nie für Fotos auf einer Website.
WebP
Googles Webformat, inzwischen von jedem aktuellen Browser unterstützt. Hat sowohl einen verlustbehafteten als auch einen verlustfreien Modus, unterstützt Transparenz in beiden und unterstützt Animation. Verlustbehaftetes WebP ist etwa 25 bis 35 % kleiner als JPG bei gleicher Qualität; verlustfreies WebP ist etwa 25 % kleiner als PNG. Es ist das beste Allzweckformat für alles, was in einem Browser angezeigt wird. Seine Schwäche ist die Kompatibilität außerhalb des Browsers: ältere Desktop-Software, manche E-Mail-Programme und viele Upload-Formulare lehnen es noch ab.
AVIF
Noch neuer, basierend auf dem AV1-Videocodec. Typischerweise 50 % kleiner als JPG und 20 % kleiner als WebP bei gleicher Qualität, mit Transparenz, Animation und Unterstützung für großen Farbraum. Seit 2024 von allen aktuellen Browsern unterstützt. Das Kodieren ist langsam, besonders im Browser, und die Unterstützung in Nicht-Browser-Software ist noch lückenhaft. Nimm es, wenn die Dateigröße entscheidend ist und du die Anzeigeumgebung kontrollierst; liefere daneben ein WebP- oder JPG-Fallback aus.
GIF
Von 1987. Beschränkt auf 256 Farben pro Bild, Transparenz für eine einzelne Farbe und Animation, was der einzige Grund ist, warum es noch überall ist. Furchtbar für Fotos, gut für einfache Grafiken, unschlagbar bei der Kompatibilität. Für Standbilder macht PNG alles, was GIF macht, nur besser; für Animation sind MP4 oder animiertes WebP weit kleiner.
BMP
Unkomprimiertes Windows-Bitmap. Riesige Dateien, keine Transparenz im üblichen Gebrauch, keine Komprimierung. Überlebt nur, weil es trivial einfach zu lesen ist, was für eingebettete Geräte und alte Software zählt. Verwende es nie für das Web oder zum Speichern.
ICO
Das Format für Windows-Icons und Browser-Favicons. Enthält mehrere Größen desselben Bildes in einer Datei, damit die richtige für einen Tab, ein Lesezeichen oder eine Desktop-Verknüpfung gewählt werden kann. Wird aus einem PNG mit dem Tool PNG in ICO erstellt.
Vergleichstabelle
| Format | Komprimierung | Transparenz | Animation | Fotogröße vs. JPG | Kompatibilität |
|---|---|---|---|---|---|
| JPG | Verlustbehaftet | Nein | Nein | 1× | Universell |
| PNG | Verlustfrei | Ja, voller Alphakanal | Nein | 5 bis 10× | Universell |
| WebP | Beides | Ja, voller Alphakanal | Ja | 0,65 bis 0,75× | Alle Browser, die meisten modernen Apps |
| AVIF | Beides | Ja, voller Alphakanal | Ja | 0,5× | Alle aktuellen Browser, wenige Apps |
| GIF | Verlustfrei, 256 Farben | Ja, an/aus | Ja | 2 bis 4× (und schlechtere Qualität) | Universell |
| BMP | Keine | Nein | Nein | 20 bis 30× | Universell, aber selten verwendet |
Welches Format für welche Aufgabe
- Fotos auf einer Website: WebP mit Qualität 75 bis 85, mit einem JPG-Fallback, wenn du sehr alte Browser unterstützen musst. AVIF, wenn du die kleinstmöglichen Seiten willst.
- Logos und Icons auf einer Website: SVG, wenn du es hast; sonst PNG oder verlustfreies WebP.
- Screenshots: PNG. Verlustbehaftete Komprimierung macht Text unscharf.
- E-Mail-Anhänge: JPG für Fotos, PNG für Grafiken. Schick kein WebP; zu viele Mailprogramme verarbeiten es falsch.
- Druck: JPG mit Qualität 95 oder PNG/TIFF, mit 300 Pixeln pro Zoll der Druckgröße.
- Social Media: JPG oder PNG; jede Plattform komprimiert beim Upload ohnehin neu, lade also in hoher Qualität und den richtigen Abmessungen hoch.
- Transparente Produktfreistellungen: PNG für maximale Kompatibilität, WebP fürs Web.
- Favicons: ICO plus ein PNG für mobile Startbildschirme.
Zwischen ihnen konvertieren
Jede Konvertierung auf dieser Website läuft in deinem Browser. Die häufigsten Wege sind PNG in WebP und JPG in WebP fürs Web, WebP in JPG und WebP in PNG für Kompatibilität, und PNG in JPG zum Verkleinern von Fotos, die im falschen Format exportiert wurden. Der Bildkompressor erledigt alle davon mit Stapelverarbeitung.