WebP vs JPG vs PNG vs AVIF — wann welches Format (2026)
Tomoda HinataTool-Autor & MaintainerVeröffentlicht am 26. Apr. 2026ca. 9 Min. Lesezeit
JPG für Fotos, die überall ankommen müssen. PNG für Grafiken mit Transparenz oder verlustfreien Kanten. WebP fürs heutige Web (jeder Browser seit Safari 14). AVIF, wenn ~30 % weitere Einsparung den Verlust der Outlook-Unterstützung wert ist. Dieser Leitfaden vergleicht die vier Formate nach Größe, Browser-Support und Eignung — mit Messwerten, die Sie im Browser-Komparator selbst nachprüfen können.
Im Leitfaden verwendete Tools
Die vier Formate auf einen Blick
JPG (1992) verlustbehaftet, ohne Alpha, universell. PNG (1996) verlustfrei mit Alpha, ideal für Logos/Screenshots, ~5× größer als JPG bei Fotos. WebP (2010, Google) kombiniert verlustbehaftet/verlustfrei/Alpha, ~25–35 % kleiner als JPG. AVIF (2019, AV1) ist der jüngste Codec, ~20–30 % kleiner als WebP — beste Kompression, schwächste Legacy-Unterstützung.
Wann JPG?
Wenn das Ziel älter als ‚modernes Web‘ ist oder universelle Kompatibilität wichtiger als die letzten 30 % Bytes: E-Mail-Anhänge (Outlook-Desktop ignoriert WebP), Druckabgabe, Word/PowerPoint-Embed, Übergabe an Nicht-Techniker. Qualität 78 ist der Sweet Spot bei Fotos; 90 für Text-Screenshots.
Wann gewinnt PNG?
Drei Dinge, die JPG nicht kann: Transparenz, pixelgenaue Kanten (UI-Screenshots, dünne Linien), Verlustfreiheit (Bilder, die später noch bearbeitet werden). Für Fotos ist PNG verschwenderisch. PNG-8 für Icons, PNG-24+α für Logos.
Warum WebP der moderne Web-Standard ist
Jeder moderne Browser dekodiert WebP nativ (Chrome 32+/Firefox 65+/Safari 14+/Edge — >98 % globaler Traffic seit 2022). WebP-Fotos sind 25–35 % kleiner als JPG; verlustfreies WebP für Grafiken+Text ist ~25 % kleiner als PNG. Einzige Schwachstelle: Outlook-Desktop.
Wann lohnt AVIF?
AVIF nutzt AV1-Intra-Frame-Kompression und schafft ~20–30 % weiter als WebP. Sinnvoll auf Greenfield-Content-Sites mit großen Hero-Bildern. Kosten: Outlook-Desktop, einige MS-Apps, alte Android-Webview, sehr altes Safari. Hinter `<picture>` mit WebP-Fallback einsetzen oder warten, bis Legacy-Anteil < 2 %.
Entscheidungsbaum
Outlook-Desktop / E-Mail / Druck? → JPG (Foto) oder PNG (transparente Grafik). Web mit modernem Publikum? → WebP Qualität 82; Screenshots verlustfrei. >98 % moderne Browser und maximaler LCP-Gewinn? → `<picture>` mit AVIF + WebP-Fallback. Transparenz im Web? → WebP oder AVIF; PNG in Neuprojekten meiden.
| Format | Foto (1920×1280) | UI-Screenshot (1920×1080) | Logo + Transparenz | Browser-Support |
|---|---|---|---|---|
| JPG Qualität 82 | 245 KB | (keine Transparenz) | (keine Transparenz) | 100 % |
| PNG | 1,65 MB | 92 KB | 11 KB | 100 % |
| WebP Qualität 82 | 165 KB | 55 KB (verlustfrei) | 8 KB | 98 % |
| AVIF Qualität 60 | 115 KB | 48 KB | 6 KB | 92 % |
Häufig gestellte Fragen
Welches Format hat die beste Browser-Abdeckung?
JPG und PNG (100 %). WebP ~98 %. AVIF ~92 %.
Ist WebP kleiner als AVIF?
Nein — AVIF ist ~20–30 % kleiner als WebP bei gleicher Qualität.
Warum ist HEIC nicht in diesem Vergleich?
HEIC ist iPhone-Speicherformat, nicht Web-Format. Kein Browser dekodiert HEIC nativ.
Verlustfreies oder verlustbehaftetes WebP?
Verlustbehaftet für Fotos (Q82); verlustfrei für Screenshots/Logos/Text — schlägt PNG um ~25 % verlustfrei.
Was ist mit TIFF?
TIFF ist Desktop/Druck/Archivformat, kein Web-Format.
Kann ich mich auf ein Format beschränken?
Wenn nur eins: JPG für Fotos, PNG für transparente Grafiken. WebP/AVIF sind Optimierungsschichten.
Jetzt ausprobieren
Encode one image in all five modern formats in parallel — size + time side by side
Modern Image Format Comparator (PNG / JPEG / WebP / AVIF / JXL)Dieser Artikel enthält KI-Übersetzungen. Bitte Fehler melden.