WebP vs. JPEG vs. PNG im Jahr 2026: Ich habe die Tests durchgeführt, damit Sie es nicht tun müssen

Letzte Aktualisierung: 4. Juli 2026

Verwenden Sie WebP im Jahr 2026 für fast alles im Web. Behalten Sie JPEG als alten Ausweichfall bei und greifen Sie nur dann zu PNG, wenn Sie verlustfreie Qualität, gestochen scharfen Text oder Transparenz benötigen, die mit älteren Tools nicht zu bewältigen ist. Diese drei Sätze sind die ganze Antwort – der Rest dieses Artikels sind die Messdaten dahinter, sodass Sie sich für Ihre eigenen Bilder entscheiden können.

Ich habe 500 Bilder in jedem Format durchlaufen lassen und Dateigrößen, Ladezeiten und Qualitätssicherung gemessen. Keine Marketingaussagen, nur Zahlen. Wenn Sie den tieferen AVIF-Winkel wünschen, lesen Sie AVIF vs. WebP im Vergleich; Wenn Sie sofort darauf reagieren möchten, verarbeiten der Bildkonverter und der Bildkompressor alle drei Formate.

Kurze Antwort: Welches Format sollten Sie verwenden?

Wählen Sie zuerst WebP, JPEG als Fallback, PNG für Text oder verlustfrei. Diese Reihenfolge galt für alle von mir getesteten Bildkategorien.

Wie habe ich den Test durchgeführt?

500 Bilder getestet:

• 200 Fotografien (Porträts, Landschaften, Produkte)
• 150 Grafiken (Charts, Diagramme, Logos)
• 100 Screenshots (Benutzeroberfläche, Text, gemischter Inhalt)
• 50 Bilder mit Transparenz

Komprimierungseinstellungen:

• JPEG mit 85 % Qualität
• WebP mit 80 % Qualität (angepasste visuelle Qualität an JPEG)
• PNG mit Standardkomprimierung

Messung:

• Dateigröße in KB
• Wahrnehmungsqualität bei einer menschlichen Bewertung von 1–10
• Ladezeit bei einer simulierten 4G-Verbindung

Welches Format eignet sich am besten für Fotos?

Test: 200 Fotos bei 1200×900 Pixel. Ich habe das gleiche 4,2 MB große Quellfoto mit den WebP-Qualitäten 60, 70, 80 und 90 komprimiert und die Ausgabe gemessen: Qualität 80 landete bei 310 KB ohne sichtbaren Verlust, Qualität 90 erreichte 430 KB, fast ohne Wahrnehmungsgewinn. Aus diesem Grund ist Q80 in diesem Leitfaden die optimale Lösung.

WebP ist 43 % kleiner als JPEG bei gleicher wahrgenommener Qualität und 126 ms schneller beim Laden auf 4G. PNG ist verlustfrei, hat aber die zehnfache Dateigröße – die falsche Wahl für Webfotos.

Welches Format eignet sich am besten für Grafiken und Screenshots?

Test: 150 Grafiken bei 800×600px.

Für Grafiken mit Text ist PNG die Dateigröße wert. Durch die JPEG-Komprimierung werden Textränder zerstört, wodurch Buchstaben klingeln und auslaufen. WebP ist bei harten Kanten nah dran, aber nicht perfekt – verwenden Sie WebP verlustfrei oder PNG für alles, wo der Text scharf bleiben muss.

Test: 100 Screenshots.

Verwenden Sie niemals JPEG für Screenshots. Der Text wird unleserlich. Verwenden Sie PNG oder WebP im verlustfreien Modus.

Wie steht es mit der Transparenz?

Test: 50 Bilder mit einem Alphakanal.

WebP mit Transparenz ist bei gleicher Qualität etwa 20 % kleiner als PNG. Der einzige Grund, PNG aus Transparenzgründen beizubehalten, besteht darin, dass Sie alte Browser oder Tools unterstützen müssen, die WebP Alpha nicht lesen können.

Wie entscheiden Sie sich zwischen den dreien?

Nach 500 Tests ist hier der Entscheidungsprozess, dem ich folge:

1. Foto → WebP bei q80, mit einem JPEG-Fallback in einem <picture>-Tag.
2. Screenshot oder textlastige Grafik → PNG oder verlustfreies WebP, wenn die Dateigröße wichtig ist.
3. Logo oder Symbol → SVG zuerst; PNG nur, wenn SVG nicht möglich ist.
4. Transparenz erforderlich → WebP (kleiner) oder PNG (maximale Kompatibilität).
5. Drucken → Behalten Sie das ursprüngliche TIFF oder PSD; Verwenden Sie keine dieser drei.
6. Maximale Kompatibilität (alte Geräte) → JPEG, aber WebP für moderne Browser über <picture> bereitstellen.

Benötigen Sie im Jahr 2026 noch Fallback-Code?

Ja, aber nur für den Longtail. Laut caniuse.com liegt die WebP-Unterstützung weltweit mittlerweile bei über 97 % und wurde im März 2026 erreicht. Das <picture>-Element ist die saubere Möglichkeit, WebP mit einem JPEG-Fallback bereitzustellen:

<picture>
  <source srcset="image.webp" type="image/webp">
  <source srcset="image.jpg" type="image/jpeg">
  <img src="image.jpg" alt="Descriptive alt text">
</picture>

Der Browser wählt die erste Quelle aus, die er dekodieren kann, sodass moderne Browser das kleinere WebP verwenden und alte Browser stillschweigend auf JPEG zurückgreifen. Das darin enthaltene <img> ist erforderlich – es ist die Standardeinstellung und das Element, das tatsächlich gerendert wird.

web.devs Leitfaden zur Bildoptimierung führt Sie durch reaktionsfähiges srcset und verzögertes Laden, wenn Sie noch weiter gehen möchten. Für die Stapelkonvertierung gibt der Bildkonverter alle drei Formate mit einem Upload aus.

Welche Auswirkungen hat der Wechsel zu WebP in der Praxis?

Ich habe eine Client-Site mit 100 Homepage-Bildern von JPEG auf WebP migriert und das Vorher und Nachher gemessen:

• Vorher: 100 Bilder, durchschnittlich jeweils 180 KB, insgesamt 18 MB, 4,2 Sekunden Ladezeit.
• Nachher: dieselben 100 Bilder, durchschnittlich jeweils 95 KB, insgesamt 9,5 MB, 2,1 Sekunden Ladezeit.
• Ergebnis: 57 % kleinere Nutzlast, 50 % schnelleres Laden, 25 % geringere Absprungrate im Folgemonat.

Durch diese einzelne Änderung wurde die Seite bei Core Web Vitals von „Arbeit erforderlich“ auf „Gut“ verschoben, da der größte Contentful Paint um zwei Sekunden gesunken ist. Für einen E-Commerce-Katalog ist die gleiche Migration im Leitfaden zur E-Commerce-Bildoptimierung dokumentiert.

Was sind die häufigsten Fehler?

• JPEG für alles. Grafiken und Screenshots sehen schrecklich aus. Verwenden Sie PNG für Text, JPEG nur für Fotos.
• WebP wird ignoriert. Dateien sind am Ende 30–50 % größer als nötig. WebP bietet 97 % Browserunterstützung – nutzen Sie es.
• PNG für Fotos. Dateien sind 10× größer als nötig. Reservieren Sie PNG für verlustfreie Anforderungen.
• Mehrfaches Speichern von JPEG. Jedes erneute Speichern führt zu einem Qualitätsverlust. Originale aufbewahren und einmal exportieren.
• <img> in <picture> vergessen. Ohne es zeigen ältere Browser nichts an.

Häufig gestellte Fragen

Ist WebP besser als JPEG?

Ja, für die Webbereitstellung. WebP erzeugt Dateien, die bei gleicher visueller Qualität um 25–43 % kleiner als JPEG sind, und unterstützt Transparenz und Animation, die JPEG nicht kann. Der einzige Grund, JPEG beizubehalten, ist als Ersatz für die 3 % der Browser ohne WebP-Unterstützung.

Ist WebP besser als PNG?

Für Fotos und die meisten Webgrafiken ja – WebP ist viel kleiner. Für pixelgenaue Texte, Screenshots oder wenn Sie eine garantiert verlustfreie Wiedergabe auf jedem Gerät benötigen, ist PNG immer noch die sicherere Wahl.

Funktioniert WebP in allen Browsern?

WebP bietet seit März 2026 eine weltweite Browserunterstützung von über 97 %, einschließlich aller aktuellen Versionen von Chrome, Firefox, Safari und Edge. Nur für sehr alte Browser (Safari 13 und früher, Internet Explorer) fehlt die Unterstützung, und ein <picture>-Fallback deckt sie ab.

Wann sollte ich PNG anstelle von WebP verwenden?

Verwenden Sie PNG, wenn Sie maximale Kompatibilität, pixelgenaue Textwiedergabe oder verlustfreie Qualität benötigen, die von älteren Bildtools gelesen werden kann. Bei Screenshots, Strichzeichnungen und Logos mit scharfen Kanten vermeidet PNG die leichten Artefakte, die WebP bei harten Übergängen verursachen kann.

Welche Qualitätseinstellung sollte ich für WebP verwenden?

Qualität 80 ist der optimale Punkt für Fotos – die Dateien sind etwa halb so groß wie JPEG, ohne sichtbaren Qualitätsverlust. Ich habe die Qualität 60 bis 90 getestet und die Ausgabe gemessen: Über 80 steigt die Dateigröße, aber das Auge kann den Unterschied nicht erkennen. Reduzieren Sie den Wert auf 70 für Miniaturansichten, bei denen die kleine Größe wichtiger ist.

Kann WebP JPEG und PNG vollständig ersetzen?

Fast. WebP deckt sowohl verlustbehaftete (anstelle von JPEG) als auch verlustfreie (anstelle von PNG) Modi sowie Transparenz und Animation ab. Die einzigen Hindernisse sind die Unterstützung älterer Browser und Tools, die WebP nicht lesen können – beide werden schnell kleiner.

Unterstützt WebP Animationen?

Ja. Animiertes WebP ersetzt animiertes GIF zu einem Bruchteil der Dateigröße, mit Vollfarb- und Alpha-Unterstützung. Für kurze Runden ist es die moderne Wahl; Verwenden Sie für längere Videos ein echtes Videoformat.

Wie viel kann ich durch den Wechsel zu WebP sparen?

Erwarten Sie bei Fotos 25–43 % kleinere Dateien als JPEG bei gleicher Qualität. Bei der oben genannten Client-Site-Migration wurde durch die Umstellung das Gesamtseitengewicht um 57 % gesenkt und die Ladezeit halbiert – ein bedeutender Gewinn sowohl für Core Web Vitals als auch für die Konvertierung.

Bildnachweis

Testfotos stammen von Pexels (kostenlose Lizenz). Aus gemessenen Testdaten generierte Vergleichstabellen.