Media, Images & Files

Bildformate im Jahr 2026: wann AVIF WebP schlägt und wann nicht

AVIF ist in den meisten Fällen kleiner und schärfer als WebP, aber Kodiergeschwindigkeit und Browserunterstützung bleiben wichtig. Hier erfahren Sie, wann welches Format sinnvoll ist.

The Wux Webtools Team The Wux Webtools Team 10 min lesen KI-unterstützt, menschlich überprüft
Side-by-side comparison of WebP and AVIF image compression showing file size differences
Inhaltsverzeichnis
  1. Der Stand der Bildformate im Jahr 2026
  2. Wo AVIF klar gewinnt
  3. Wo WebP weiterhin sinnvoll ist
  4. Der praktische Entscheidungsbaum
  5. Kodierungseinstellungen, auf die es ankommt
  6. Was ist mit JPEG XL?
  7. Der Migrationspfad
  8. Wichtigste Erkenntnisse
  9. FAQ
  10. Quellen

Der Stand der Bildformate im Jahr 2026

AVIF war lange genug "die Zukunft", dass es sich inzwischen wie die Gegenwart anfühlt. Die Browserunterstützung überschritt Ende 2024 weltweit die Marke von 95%, CDNs ergänzten automatische AVIF-Transkodierung, und die meisten Tools zur Bildoptimierung liefern AVIF inzwischen standardmäßig aus. WebP ist unterdessen zum sicheren Fallback geworden — allgegenwärtig, schnell zu kodieren und gut genug für die meisten Anwendungsfälle.

Die Frage ist nicht mehr, ob AVIF theoretisch besser ist. Das ist es. Die Frage ist, ob die praktischen Kompromisse — Kodierzeit, Reifegrad der Tools, Verhalten in Randfällen — den Wechsel für Ihre konkrete Arbeitslast rechtfertigen.

Dieser Artikel führt durch den Entscheidungsbaum. Wenn Sie Tausende von nutzergenerierten Bildern ausliefern, fällt die Antwort anders aus, als wenn Sie ein Dutzend Marketing-Hero-Bilder von Hand optimieren. Wenn Ihnen Kodiergeschwindigkeit wichtig ist, ändert sich die Antwort erneut.

Wo AVIF klar gewinnt

AVIF nutzt die Intra-Frame-Kompression des AV1-Videocodecs, was bedeutet, dass es von jahrelanger Optimierung für Bewegtbild profitiert. Das Ergebnis sind bei gleicher wahrgenommener Qualität durchweg kleinere Dateien als bei WebP, insbesondere bei fotografischen Inhalten.

In wiederholten Tests mit unterschiedlichen Bildsammlungen waren AVIF-Dateien bei gleichem SSIM-Wert 20-30% kleiner als WebP. Bei hochauflösenden Fotos — Produktbildern, redaktionellen Bildern, allem über 1200px Breite — summiert sich dieser Unterschied schnell. Aus einer 2MB großen WebP-Datei wird eine 1,4MB große AVIF-Datei. Multipliziert man das mit hundert Bildern auf einer Seite, sind die Bandbreiteneinsparungen erheblich.

AVIF verarbeitet außerdem weiche Verläufe und kontrastarme Bereiche besser als WebP. WebPs VP8-Herkunft kann zu Banding in Himmeln, Schatten und anderen subtilen Tonwertübergängen führen. AVIFs ausgefeiltere Transformationskodierung vermeidet dies. Wenn Ihre Bilder viele Verläufe enthalten — Designarbeiten, Illustrationen, Sonnenuntergänge — sieht AVIF bei kleineren Dateigrößen sauberer aus.

Die Browserunterstützung ist inzwischen stark genug, dass AVIF für die meisten Websites das primäre Format sein kann. Safari ergänzte die Unterstützung in 16.4 (März 2023) und war damit der letzte große Nachzügler. Anfang 2026 liegt die weltweite Unterstützung bei über 95%. Die verbleibende Lücke betrifft ältere Android-Geräte und ältere Enterprise-Browser, weshalb Sie weiterhin einen Fallback benötigen.

Wo WebP weiterhin sinnvoll ist

Die Kodiergeschwindigkeit ist die größte praktische Einschränkung. AVIF-Kodierung ist je nach Qualitätseinstellungen und Encoder-Implementierung 5-10x langsamer als WebP. Bei nutzergenerierten Inhalten — Profilfotos, Forum-Anhängen, allem, was in Echtzeit hochgeladen wird — zählt diese Latenz. Eine WebP-Kodierung, die 200ms dauert, wird zu einer 2-sekündigen AVIF-Kodierung. Wenn Sie Uploads synchron verarbeiten, ist das eine für Nutzer spürbare Verzögerung.

Die Lösung besteht entweder darin, asynchron zu kodieren (Original hochladen, Platzhalter ausliefern, im Hintergrund kodieren) oder bei nutzergenerierten Inhalten bei WebP zu bleiben und AVIF für kuratierte Assets zu reservieren, die Sie kontrollieren. Viele Websites tun beides: AVIF für Marketingbilder, WebP für Nutzer-Uploads.

WebP hat außerdem einen höheren Reifegrad bei den Tools. Jede Bildbibliothek, jedes CMS-Plugin und jedes CDN unterstützt WebP seit Jahren. AVIF holt auf, aber Randfälle gibt es weiterhin. Einige ältere ImageMagick-Builds erzeugen AVIF-Ausgaben von schlechter Qualität. Einige CDNs berechnen für AVIF-Transkodierung einen Aufpreis. Wenn Sie in einer eingeschränkten Umgebung arbeiten — Legacy-CMS, begrenztes Budget, enge Fristen — ist WebP der Weg des geringsten Widerstands.

Schließlich ist WebP in fast allen Fällen immer noch kleiner als JPEG, und die Kodierung ist schnell genug für Echtzeitanwendungen. Wenn Ihre aktuelle Basis JPEG ist und Sie noch nicht auf moderne Formate umgestiegen sind, ist WebP der sicherere erste Schritt. Sie können AVIF später jederzeit als progressive Verbesserung ergänzen.

Der praktische Entscheidungsbaum

So treffen Sie die Wahl:

  • Kuratierte Marketingbilder, Hero-Bilder, redaktionelle Fotos: Verwenden Sie AVIF als primäres Format, mit WebP als erstem Fallback und JPEG als letztem Fallback. Die Einsparungen bei der Dateigröße rechtfertigen den Kodieraufwand, und Sie kontrollieren die Pipeline.
  • Nutzergenerierte Inhalte, die in Echtzeit hochgeladen werden: Verwenden Sie WebP. Kodiergeschwindigkeit ist wichtiger als die letzten 20% Kompressionseffizienz, und Sie können sich Verzögerungen von mehreren Sekunden nicht leisten.
  • Illustrationen, Grafiken mit flachen Farben, Screenshots: AVIF ist besser als WebP, aber PNG ist bei einfachen Grafiken mit großen einfarbigen Flächen oft konkurrenzfähig. Testen Sie beides. Wenn Ihre PNG bereits klein ist und sich gut komprimieren lässt, lohnt sich die Formatmigration möglicherweise nicht.
  • Thumbnails und kleine Bilder: WebP ist in der Regel ausreichend. Die absoluten Byte-Einsparungen durch AVIF sind gering (aus einer 10KB großen WebP-Datei wird eine 8KB große AVIF-Datei), und Kodiergeschwindigkeit ist im großen Maßstab wichtiger.
  • Unterstützung für ältere Browser ist entscheidend: Bleiben Sie bei WebP als primärem modernen Format. AVIFs 95% Abdeckung sind hervorragend, aber wenn Sie eine Nutzerbasis mit älteren Geräten oder Enterprise-Umgebungen bedienen, ist WebPs nahezu universelle Unterstützung sicherer.

Wenn Sie unsicher sind, ist das sicherste Muster, AVIF an Browser auszuliefern, die es unterstützen, mit einem WebP-Fallback und einem abschließenden JPEG-Fallback. Das <picture>-Element macht dies unkompliziert:

<picture>
  <source srcset="image.avif" type="image/avif">
  <source srcset="image.webp" type="image/webp">
  <img src="image.jpg" alt="Description">
</picture>

Dieser Ansatz bietet Ihnen das Beste aus beiden Welten: maximale Kompression für moderne Browser, sichere Fallbacks für ältere.

Kodierungseinstellungen, auf die es ankommt

Wenn Sie AVIF einführen, haben Kodierungseinstellungen einen größeren Einfluss auf die Ausgabequalität als bei WebP. AVIFs Flexibilität bedeutet, dass es mehr Möglichkeiten gibt, ein schlechtes Ergebnis zu erzeugen.

Die beiden wichtigsten Einstellungen sind Qualität und Geschwindigkeit. Qualität ist einfach: Höhere Zahlen bedeuten besser aussehende Bilder und größere Dateien. Für AVIF liegt der Sweet Spot bei fotografischen Inhalten meist bei einer Qualitätseinstellung von 75-85. Unter 70 werden sichtbare Artefakte erkennbar. Über 90 wachsen die Dateigrößen stark, ohne nennenswerte Qualitätsgewinne.

Geschwindigkeit steuert, wie viel Zeit der Encoder in die Optimierung der Ausgabe investiert. Langsamere Kodierung erzeugt kleinere Dateien, aber die Erträge nehmen schnell ab. Die meisten Encoder verwenden eine Skala von 0-10, wobei 0 am langsamsten und 10 am schnellsten ist. Eine Geschwindigkeitseinstellung von 6-8 ist ein guter Kompromiss: Die Kodierung ist schnell genug für Batch-Verarbeitung, und die Dateigrößen liegen innerhalb von 10-15% des theoretischen Minimums.

Wenn Sie AVIF auf dem Server kodieren, verwenden Sie eine aktuelle Version von libavif oder avifenc. Ältere Encoder (vor 2024) erzeugen bei gleicher Dateigröße sichtbar schlechtere Ausgaben. Das Format reift weiterhin, und die Verbesserungen bei Encodern waren erheblich.

Was ist mit JPEG XL?

JPEG XL ist AVIF und WebP technisch überlegen. Es komprimiert besser, kodiert schneller, unterstützt verlustfreie Kompression und verarbeitet eine größere Bandbreite an Bildtypen. Es ist außerdem ein totes Format.

Google entfernte 2022 die JPEG XL-Unterstützung aus Chrome und verwies auf geringe Verbreitung und Komplexität. Apple hat nie Unterstützung hinzugefügt. Stand 2026 wird JPEG XL nur in Firefox und Safari Technology Preview unterstützt, was bedeutet, dass es für den produktiven Einsatz nicht tragfähig ist. Sofern die Browseranbieter ihren Kurs nicht ändern — unwahrscheinlich — bleibt JPEG XL ein Format für Enthusiasten und Archivierungs-Workflows, nicht für das Web.

Der Migrationspfad

Wenn Sie von JPEG zu modernen Formaten wechseln, ist der sicherste Weg:

  1. Prüfen Sie Ihre aktuelle Bild-Pipeline. Ermitteln Sie, woher Bilder kommen (CMS, Nutzer-Uploads, CDN), wie sie verarbeitet werden und welche Formate Sie derzeit ausliefern. Warum die Verarbeitung von Bildern im Browser ein Gewinn für den Datenschutz ist behandelt einige der Abwägungen dazu, wo Bildverarbeitung stattfindet.
  2. Beginnen Sie mit WebP. Es ist schnell zu kodieren, breit unterstützt und liefert sofortige Reduzierungen der Dateigröße. Das ist der risikoarme erste Schritt.
  3. Ergänzen Sie AVIF für kuratierte Inhalte. Sobald WebP zuverlässig funktioniert, fügen Sie AVIF für hochwertige Bilder hinzu, bei denen die Dateigröße am wichtigsten ist. Testen Sie Kodierzeiten und stellen Sie sicher, dass Ihr CDN oder Bilddienst es unterstützt.
  4. Beobachten Sie die Browserunterstützung. Die AVIF-Abdeckung ist inzwischen hervorragend, aber wenn Ihre Analysen einen relevanten Anteil von Nutzern mit älteren Browsern zeigen, behalten Sie WebP als primäres Format bei.
  5. Messen Sie die Wirkung. Nutzen Sie Real User Monitoring, um Seitenladezeiten und Largest Contentful Paint vor und nach der Migration zu verfolgen. Wie man einen Lighthouse-Bericht liest, ohne in Panik zu geraten ist ein hilfreicher Leitfaden zur Interpretation von Performance-Metriken.

Das Ziel ist nicht, das neueste Format zu verwenden, weil es neu ist. Das Ziel ist, kleinere Bilder auszuliefern, ohne Qualität zu opfern, was die Seitengeschwindigkeit verbessert und Bandbreitenkosten reduziert. AVIF leistet das in den meisten Fällen besser als WebP, aber die praktischen Einschränkungen — Kodiergeschwindigkeit, Tools, Browserunterstützung — bedeuten, dass WebP für manche Arbeitslasten weiterhin die richtige Wahl ist.

Wichtigste Erkenntnisse

  • AVIF ist bei gleicher Qualität 20-30% kleiner als WebP, insbesondere bei fotografischen Inhalten und Bildern mit Verläufen.
  • AVIF zu kodieren ist 5-10x langsamer als WebP, was es für Echtzeit-Nutzer-Uploads unpraktisch macht, sofern Sie nicht asynchron kodieren.
  • Die Browserunterstützung für AVIF liegt weltweit über 95%, aber WebPs nahezu universelle Unterstützung macht es zum sichereren Fallback.
  • Verwenden Sie für kuratierte Marketingbilder AVIF als primäres Format mit WebP- und JPEG-Fallbacks. Bei nutzergenerierten Inhalten bleiben Sie bei WebP.
  • JPEG XL ist technisch überlegen, hat aber keine tragfähige Browserunterstützung und sollte nicht für produktive Websites verwendet werden.

FAQ

F: Kann ich AVIF ohne Fallback ausliefern?

A: Noch nicht. Die AVIF-Unterstützung liegt über 95%, aber das lässt immer noch Millionen von Nutzern mit älteren Browsern zurück. Binden Sie immer einen WebP- oder JPEG-Fallback mit dem <picture>-Element ein. Der Browser wählt automatisch das beste Format aus, das er unterstützt.

F: Unterstützt AVIF Transparenz?

A: Ja. AVIF unterstützt einen Alphakanal und ist damit ein brauchbarer Ersatz für PNG in Fällen, in denen Sie Transparenz benötigen. Die Dateigrößen sind in der Regel kleiner als bei PNG, allerdings ist die Kodierung langsamer.

F: Sollte ich alle meine vorhandenen Bilder erneut als AVIF kodieren?

A: Nur wenn die Bandbreiteneinsparungen den Aufwand rechtfertigen. Beginnen Sie mit stark frequentierten Seiten und großen Bildern, bei denen die Wirkung am sichtbarsten ist. Bei Seiten mit geringem Traffic oder kleinen Bildern ist der ROI minimal. Konzentrieren Sie sich zuerst auf neue Inhalte und füllen Sie dann selektiv nach.

F: Was ist das beste Tool für Batch-Kodierung von AVIF?

A: avifenc (Teil von libavif) ist das am weitesten verbreitete Kommandozeilen-Tool. Bei GUI-Tools unterstützen Squoosh (webbasiert) und ImageOptim (Mac) beide AVIF. Die meisten modernen CDNs und Bilddienste (Cloudflare, Cloudinary, imgix) können automatisch nach AVIF transkodieren.

F: Funktioniert AVIF mit responsiven Bildern und srcset?

A: Ja. Verwenden Sie das <picture>-Element mit mehreren <source>-Elementen für Format-Fallbacks und srcset innerhalb jedes <source> für responsive Größen. Der Browser wählt je nach Unterstützung und Viewport-Breite das beste Format und die passende Größe aus.

<!-- tool-cta:start -->

💡 Probieren Sie dies aus: Vergleichen Sie die beiden Formate mit Ihren eigenen Assets im Image Converter, der sowohl AVIF als auch WebP ausgeben kann, damit Sie Größe und Qualität unter realen Bedingungen messen können.

<!-- tool-cta:end -->

Quellen

Decision tree showing when to choose AVIF, WebP, PNG, or AVIF with WebP and JPEG fallbacks based on image type, speed, and browser support needs
InfographicAVIF vs WebP: the practical decision tree — A quick format picker based on workload, image type, and compatibility requirements
Side-by-side comparison chart of AVIF and WebP across file size, encoding speed, browser support, gradients, tooling, and best-fit use cases
InfographicWhere AVIF wins and where WebP still wins — Compression favors AVIF, but speed and simplicity still favor WebP in many pipelines
Five-step checklist showing image pipeline audit, WebP first, AVIF for curated content, browser support monitoring, and performance measurement
InfographicA low-risk migration path from JPEG to AVIF — A staged rollout reduces risk while capturing most of the performance benefit

Häufig gestellte Fragen

Kann ich AVIF ohne Fallback ausliefern?
Noch nicht. Die AVIF-Unterstützung liegt über 95%, aber das lässt immer noch Millionen von Nutzern mit älteren Browsern zurück. Binden Sie immer einen WebP- oder JPEG-Fallback mit dem `<picture>`-Element ein. Der Browser wählt automatisch das beste Format aus, das er unterstützt.
Unterstützt AVIF Transparenz?
Ja. AVIF unterstützt einen Alphakanal und ist damit ein brauchbarer Ersatz für PNG in Fällen, in denen Sie Transparenz benötigen. Die Dateigrößen sind in der Regel kleiner als bei PNG, allerdings ist die Kodierung langsamer.
Sollte ich alle meine vorhandenen Bilder erneut als AVIF kodieren?
Nur wenn die Bandbreiteneinsparungen den Aufwand rechtfertigen. Beginnen Sie mit stark frequentierten Seiten und großen Bildern, bei denen die Wirkung am sichtbarsten ist. Bei Seiten mit geringem Traffic oder kleinen Bildern ist der ROI minimal. Konzentrieren Sie sich zuerst auf neue Inhalte und füllen Sie dann selektiv nach.
Was ist das beste Tool für Batch-Kodierung von AVIF?
`avifenc` (Teil von libavif) ist das am weitesten verbreitete Kommandozeilen-Tool. Bei GUI-Tools unterstützen Squoosh (webbasiert) und ImageOptim (Mac) beide AVIF. Die meisten modernen CDNs und Bilddienste (Cloudflare, Cloudinary, imgix) können automatisch nach AVIF transkodieren.
Funktioniert AVIF mit responsiven Bildern und srcset?
Ja. Verwenden Sie das `<picture>`-Element mit mehreren `<source>`-Elementen für Format-Fallbacks und `srcset` innerhalb jedes `<source>` für responsive Größen. Der Browser wählt je nach Unterstützung und Viewport-Breite das beste Format und die passende Größe aus.

Quellen & weiterführende Literatur

  1. AVIF vs WebP: A Comprehensive Comparison
  2. Can I use AVIF?
  3. libavif GitHub repository
  4. Web Almanac: Images
Über den Autor
The Wux Webtools Team

Zuletzt aktualisiert:

Weiterlesen