WebP oder JPEG XL für Websites

Für öffentlich erreichbare Websites ist WebP derzeit die sicherere Wahl, weil das Format von Chrome, Edge, Firefox, Safari und Opera nativ unterstützt wird. JPEG XL bietet moderne Funktionen und eine hohe Bildqualität, kann wegen der weiterhin eingeschränkten Browserunterstützung aber noch nicht ohne Ersatzformat eingesetzt werden. WebP eignet sich besonders für Produktbilder, Beitragsfotos, Vorschaubilder und große Bildergalerien. JPEG XL ist interessant für HDR-Aufnahmen, verlustfreie Speicherung, große Farbräume und die platzsparende Weiterverarbeitung bestehender JPEG-Dateien. Die Entscheidung betrifft die Auslieferung im Web und ist daher von der Frage zu unterscheiden, ob Fotografen zunächst in RAW oder JPEG fotografieren.

Inhaltsverzeichnis

• Browserunterstützung entscheidet über den praktischen Einsatz
• Komprimierung und Bildqualität im direkten Vergleich
• Transparenz, HDR und verlustfreie JPEG-Umwandlung
• Ladezeit und Core Web Vitals richtig bewerten
• Werkzeuge, Speicherbedarf und redaktioneller Aufwand
• WebP und JPEG XL sicher in eine Website einbauen
• Welches Format zu welchem Projekt passt
• FAQ

Browserunterstützung entscheidet über den praktischen Einsatz

Wer heute nur ein modernes Bildformat bereitstellen möchte, sollte WebP verwenden und für ältere Systeme bei Bedarf JPEG oder PNG vorhalten. JPEG XL sollte auf einer normalen Website nur als zusätzliche Variante innerhalb eines Picture-Elements ausgeliefert werden.

WebP hat seinen früheren Nachteil weitgehend verloren. Das Format wird nach Angaben von Google und MDN von den aktuellen Versionen der großen Browser unterstützt. Dazu gehören Google Chrome, Microsoft Edge, Mozilla Firefox, Apple Safari und Opera. Auch viele Content-Management-Systeme, Bildprogramme, Konverter und CDN-Dienste können WebP erzeugen oder automatisch ausliefern.

Bei JPEG XL sieht die Lage im September 2026 anders aus. Safari unterstützt das Format seit Version 17. Chrome bietet JPEG-XL-Decodierung ab Version 145 hinter einer experimentellen Browserflag an. Firefox führt die Unterstützung in Vorschau- und Nightly-Versionen, sie gehört jedoch noch nicht zur verlässlich aktivierten Standardausstattung aller regulären Installationen.

Eine JPEG-XL-Datei als einzige Bildquelle kann deshalb bei einem erheblichen Teil der Besucher nicht angezeigt werden. Das betrifft besonders Websites, die keine Kontrolle über Browser, Geräte und Betriebssysteme ihrer Nutzer haben. Ein Onlineshop, Nachrichtenportal oder Unternehmensauftritt darf nicht voraussetzen, dass experimentelle Funktionen aktiviert wurden.

Auch die Unterstützung in Safari löst das Problem nur teilweise. Nach den von MDN dokumentierten Einschränkungen stellt Safari JPEG-XL-Dateien erst nach dem vollständigen Download dar. Die im Format grundsätzlich vorgesehene progressive Darstellung steht dort bei der Übertragung nicht vollständig zur Verfügung.

WebP gewinnt dieses Kriterium klar. JPEG XL kann sinnvoll sein, wenn ein geschlossenes System mit bekannten Endgeräten betrieben wird oder wenn immer eine kompatible Alternative bereitsteht.

Komprimierung und Bildqualität im direkten Vergleich

WebP beherrscht verlustbehaftete und verlustfreie Komprimierung. Google nennt für verlustbehaftete WebP-Dateien eine Größenersparnis von 25 bis 34 Prozent gegenüber vergleichbaren JPEG-Dateien bei gleichem SSIM-Qualitätsindex. Verlustfreie WebP-Bilder sollen nach denselben Herstellerangaben rund 26 Prozent kleiner als entsprechende PNG-Dateien sein.

Diese Werte sind keine Garantie für jedes Motiv. Die tatsächliche Dateigröße hängt vom Encoder, der Qualitätsstufe, der Bildauflösung und dem Inhalt ab. Feine Hautstrukturen, Blätter, Fell, Rauschen und harte Farbübergänge reagieren anders auf eine Komprimierung als ein unscharfer Hintergrund oder eine gleichmäßige Fläche.

JPEG XL wurde als Nachfolger für klassische JPEG-Arbeitsabläufe entwickelt. Die JPEG-Organisation nennt eine höhere Kompression und Bildqualität gegenüber dem alten JPEG-Standard. Das Format kann sowohl visuell verlustbehaftet als auch vollständig verlustfrei arbeiten. Es ist zudem für hohe Auflösungen, verschiedene Qualitätsstufen und professionelle Bildbestände ausgelegt.

Aus pauschalen Prozentwerten lässt sich dennoch kein allgemeiner Sieger zwischen WebP und JPEG XL bestimmen. Unterschiedliche Encoder und Einstellungen können das Ergebnis stärker verändern als der Name des Formats. Für eine belastbare Entscheidung sollten dieselben Originalbilder mit den vorgesehenen Werkzeugen exportiert und anschließend visuell sowie technisch verglichen werden.

Eine praktische Stichprobe sollte mindestens Porträts, detailreiche Naturbilder, Nachtaufnahmen, Produktfotos und Grafiken mit Schrift enthalten. Entscheidend ist die kleinste Datei, bei der im vorgesehenen Anzeigeformat keine störenden Artefakte sichtbar sind. Wer zusätzlich AVIF prüfen möchte, findet einen eigenen Vergleich zu WebP und AVIF ohne sichtbaren Qualitätsverlust.

Transparenz, HDR und verlustfreie JPEG-Umwandlung

Beide Formate können mehr als das klassische JPEG. WebP kombiniert verlustbehaftete oder verlustfreie Komprimierung mit Transparenz. Animationen sind ebenfalls möglich. Dadurch kann ein WebP-Bild je nach Inhalt JPEG, PNG oder GIF ersetzen.

JPEG XL deckt ein noch breiteres technisches Spektrum ab. Der Standard ISO/IEC 18181 unterstützt hohe Bittiefen, große Farbräume, HDR, Alphakanäle, Animationen, Ebenen, Miniaturen und progressive Dekodierung. Diese Fähigkeiten sind für hochwertige Fotografie, Bildarchive und Anwendungen mit langfristig wachsenden Anforderungen interessant.

Eine Besonderheit ist die verlustfreie Transkodierung vorhandener JPEG-Dateien. Dabei kann eine klassische JPEG-Datei in JPEG XL überführt und später wieder exakt als ursprüngliche JPEG-Datei rekonstruiert werden. Das ist für große Archive relevant, weil keine erneute verlustbehaftete Bildkomprimierung erforderlich ist.

• WebP bietet verlustbehaftete und verlustfreie Komprimierung.
• WebP unterstützt Transparenz und Animationen.
• JPEG XL verarbeitet HDR, große Farbräume und hohe Bittiefen.
• JPEG XL kann vorhandene JPEG-Dateien reversibel transkodieren.
• Beide Formate sind lizenzfrei nutzbar.

Für gewöhnliche Beitragsbilder werden viele Funktionen von JPEG XL nicht benötigt. Für ein Fotoarchiv mit Originaldateien, HDR-Material oder anspruchsvoller Farbverarbeitung können sie dagegen ein starkes Argument sein.

Ladezeit und Core Web Vitals richtig bewerten

Kleinere Bilddateien reduzieren die zu übertragende Datenmenge. Das kann besonders über mobile Verbindungen die Ladezeit verbessern. Der Dateityp allein garantiert jedoch keinen guten Largest Contentful Paint. Eine zu große Bildabmessung, eine verspätete Ressourcenanforderung oder eine falsch konfigurierte Priorität kann den Vorteil einer effizienten Komprimierung wieder aufheben.

Das größte Bild im sichtbaren Seitenbereich ist häufig das LCP-Element. Es sollte direkt im ursprünglichen HTML auffindbar sein. Das Hauptbild darf nicht unnötig durch JavaScript nachgeladen werden. Für ein wahrscheinliches LCP-Bild kann eine hohe Abrufpriorität sinnvoll sein. Lazy Loading sollte dagegen vor allem für Bilder unterhalb des sichtbaren Bereichs eingesetzt werden.

Feste Angaben für Breite und Höhe helfen dem Browser, den benötigten Platz früh zu reservieren. Responsive Varianten mit unterschiedlichen Auflösungen verhindern außerdem, dass ein Smartphone dieselbe große Datei wie ein breiter Desktopmonitor herunterladen muss.

Zu einer wirksamen Optimierung gehören daher mehrere Maßnahmen:

• passende Bildabmessungen statt übergroßer Originaldateien
• mehrere Auflösungen über das Attribut srcset
• korrekte Werte für width und height
• frühe Auslieferung des wichtigsten Seitenbildes
• Lazy Loading nur für später sichtbare Motive
• lange Cachezeiten für unveränderte Bilddateien
• regelmäßige Messungen mit realen Nutzerdaten

Eine sauber erzeugte WebP-Datei ist für die meisten Websites derzeit wertvoller als eine theoretisch effizientere JPEG-XL-Datei, die nicht in jedem Browser dargestellt werden kann. Bei umfangreichen Portfolios sollten Formatwahl, Bildgrößen und Ladeverhalten gemeinsam optimiert werden. Weitere praktische Ansatzpunkte zeigt der Beitrag über schneller ladende Fotogalerien.

Werkzeuge, Speicherbedarf und redaktioneller Aufwand

Für beide Formate fallen grundsätzlich keine Lizenzgebühren an. Die eigentlichen Kosten entstehen durch Konvertierung, Speicherung, Qualitätssicherung, Cache-Verwaltung und zusätzliche Bildvarianten. Je mehr Formate eine Website anbietet, desto mehr Dateien müssen erzeugt, benannt und bei einer Änderung aktualisiert werden.

WebP ist in vielen Redaktionssystemen bereits integriert. Häufig übernimmt ein Plugin, ein Bilddienst oder ein CDN die Konvertierung aus JPEG und PNG. Dadurch bleibt der Arbeitsablauf für Redaktionen überschaubar. Vor der Aktivierung sollte geprüft werden, ob Originaldateien erhalten bleiben und ob das System funktionierende Ersatzbilder ausliefert.

JPEG XL verlangt häufiger nach neueren Werkzeugen oder einer eigenen Konvertierungskette. Die Unterstützung durch Bildprogramme und Bibliotheken wächst, ist aber nicht so einheitlich wie bei WebP. Zusätzlich muss das System die korrekte MIME-Angabe image/jxl senden. Eine falsche Serverkonfiguration kann verhindern, dass der Browser die Datei richtig verarbeitet.

Beim Parallelbetrieb wächst der Speicherbedarf zunächst. Für jedes Motiv können eine JPEG-XL-, eine WebP- und eine JPEG-Version sowie mehrere Auflösungen entstehen. Ein dynamischer Bilddienst reduziert die manuelle Arbeit, benötigt aber Rechenleistung und einen klaren Cache-Schlüssel. Änderungen an Format, Breite oder Qualität dürfen nicht versehentlich dieselbe zwischengespeicherte Datei verwenden.

Eine konsequente Dateibenennung bleibt ebenfalls wichtig. Unterschiedliche Formate und Größen lassen sich leichter verwalten, wenn Motiv, Breite und Variante eindeutig erkennbar sind. Das verhindert Verwechslungen und ergänzt eine geordnete Strategie zum Benennen von Fotodateien.

WebP und JPEG XL sicher in eine Website einbauen

Eine Umstellung sollte nicht mit dem Löschen der vorhandenen Originale beginnen. Die Ausgangsdateien bleiben die Grundlage für spätere Exporte. Bereits stark komprimierte Webbilder sollten nicht mehrfach zwischen verlustbehafteten Formaten umgewandelt werden, weil sich sichtbare Fehler dabei verstärken können.

1. Originale sichern. Unbearbeitete oder hochwertig exportierte Dateien bleiben getrennt von den Webvarianten erhalten.
2. Repräsentative Motive auswählen. Verschiedene Bildarten werden mit denselben Zielabmessungen getestet.
3. Qualitätsstufen vergleichen. Dateigröße, Schärfe, Farbverläufe und Artefakte werden bei der tatsächlichen Darstellungsgröße kontrolliert.
4. WebP als kompatible moderne Variante erzeugen. JPEG oder PNG bleibt bei Bedarf als letzte Rückfalloption bestehen.
5. JPEG XL nur zusätzlich anbieten. Die Datei wird vor WebP und JPEG in das Picture-Element eingetragen.
6. Serverantwort kontrollieren. Für JPEG XL muss image/jxl und für WebP image/webp gesendet werden.
7. Mehrere Browser testen. Die Prüfung umfasst Chrome, Edge, Firefox und Safari auf Desktop- und Mobilgeräten.
8. Ladezeiten messen. Entscheidend sind reale Seitentests und nicht nur die Größe einer einzelnen Datei.

Eine robuste Reihenfolge kann so aussehen:

<picture>
  <source srcset="/bilder/motiv.jxl" type="image/jxl">
  <source srcset="/bilder/motiv.webp" type="image/webp">
  <img src="/bilder/motiv.jpg" width="1200" height="800" alt="Beschreibung des Bildmotivs">
</picture>

Der Browser prüft die Quellen in der angegebenen Reihenfolge. Unterstützt er JPEG XL, kann er die erste Datei laden. Andernfalls folgt WebP. Die JPEG-Datei im img-Element bildet die kompatible Rückfalloption.

Das img-Element darf nicht fehlen, weil es zugleich die Bildbeschreibung, die Abmessungen und das endgültige Ersatzformat bereitstellt. Für responsive Bilder können die Quellen zusätzlich mehrere Breiten über srcset und passende Größenregeln über sizes enthalten.

Welches Format zu welchem Projekt passt

WebP ist die beste Standardentscheidung für Blogs, Nachrichtenportale, Firmenwebsites, Onlineshops und öffentlich zugängliche Fotogalerien. Die breite Browserunterstützung, die vorhandenen Konverter und die Einbindung in viele Content-Management-Systeme senken das Risiko und den Pflegeaufwand.

Wählen Sie WebP, wenn Bilder ohne komplizierte Browserweichen zuverlässig ausgeliefert werden sollen. Es ist auch die naheliegende Lösung, wenn ein bestehendes System bereits automatische WebP-Konvertierung und JPEG-Fallbacks anbietet.

Wählen Sie JPEG XL zusätzlich, wenn HDR, hohe Bittiefen, große Farbräume oder die reversible Umwandlung vorhandener JPEG-Bestände wichtig sind. Das Format passt auch zu kontrollierten Anwendungen, deren unterstützte Browser und Geräte bekannt sind.

JPEG XL sollte noch nicht allein eingesetzt werden, wenn jeder Besucher alle Bilder sehen muss. In einem solchen Projekt ist die Kombination aus JPEG XL, WebP und JPEG technisch möglich, verursacht aber mehr Dateien und Prüfaufwand. Der zusätzliche Nutzen sollte deshalb anhand der eigenen Bildbestände gemessen werden.

Wichtigste Punkte zum Merken

• WebP wird von den großen aktuellen Browsern nativ unterstützt.
• JPEG XL ist im September 2026 noch nicht universell verfügbar.
• Safari unterstützt JPEG XL seit Version 17.
• Chrome führt JPEG XL ab Version 145 hinter einer experimentellen Flag.
• Firefox testet JPEG XL in Vorschauversionen.
• JPEG XL benötigt auf öffentlichen Websites ein Ersatzformat.
• WebP unterstützt verlustbehaftete und verlustfreie Bilder, Transparenz und Animationen.
• JPEG XL bietet zusätzlich HDR, hohe Bittiefen und reversible JPEG-Transkodierung.
• Die beste Qualitätsstufe muss mit eigenen Motiven getestet werden.
• Bildabmessungen, Ladepriorität und srcset bleiben unabhängig vom Format wichtig.

Damit fällt der praktische Vergleich eindeutig aus. WebP ist gegenwärtig das unkompliziertere Veröffentlichungsformat. JPEG XL besitzt größere technische Reserven, eignet sich aber vor allem als zusätzliche Quelle oder als Format für besondere Produktions- und Archivierungsanforderungen.

JPEG XL in der praktischen Bildbearbeitung

Michel Mayerle erklärt, welche Möglichkeiten JPEG XL bietet und für welche Arbeitsabläufe das moderne Dateiformat bereits interessant ist.

Der Beitrag zeigt, warum JPEG XL für hochwertige Dateien interessant ist und welche Grenzen beim heutigen Einsatz beachtet werden müssen.

Quelle: YouTube, Kanal Michel Mayerle

Für eine heute veröffentlichte Website ist WebP die verlässlichere Hauptlösung. JPEG XL bietet starke Funktionen für HDR, professionelle Fotografie und Bildarchive, erreicht aber noch nicht die notwendige Browserabdeckung für einen alleinigen Einsatz. Wer JPEG XL ausprobieren möchte, sollte es im Picture-Element vor WebP und JPEG anbieten. Die konkrete Komprimierungsstufe muss immer mit den eigenen Bildern und auf realen Endgeräten geprüft werden.

Quelle: MDN Web Docs, Google for Developers WebP-Dokumentation, ISO/IEC JTC 1/SC 29/WG 1 JPEG, Chrome Platform Status und Mozilla Firefox-Versionshinweise.