Bildkomprimierungs-Leitfaden 2026: Verlustbehaftet vs. Verlustfrei, WebP, AVIF
· 15 Min. Lesezeit
1. Was ist Bildkomprimierung
Bildkomprimierung ist der Prozess der Reduzierung der Dateigröße eines Bildes durch effizientere Kodierung seiner Daten. Jedes digitale Bild ist im Grunde ein Raster aus Pixeln, und jedes Pixel speichert Farbinformationen. Ein rohes, unkomprimiertes 1920x1080-Bild mit 24-Bit-Farbtiefe belegt etwa 6,2 MB Speicherplatz. Das ist unpraktisch für die Web-Auslieferung, wo das mittlere Seitengewicht im Jahr 2026 laut HTTP Archive-Daten bei etwa 2,3 MB insgesamt liegt.
Komprimierungsalgorithmen funktionieren, indem sie Redundanz identifizieren und eliminieren. Einige nutzen räumliche Redundanz, bei der benachbarte Pixel ähnliche Farben aufweisen. Andere verwenden Frequenzbereichs-Transformationen wie die Diskrete Kosinus-Transformation (DCT) bei JPEG, um hochfrequente Details von niederfrequenten Farbblöcken zu trennen und dann weniger Bits den Details zuzuweisen, die Menschen weniger wahrscheinlich bemerken.
Die beiden grundlegenden Ansätze sind verlustbehaftete und verlustfreie Komprimierung. Verlustbehaftete Methoden verwerfen dauerhaft Daten, die der Algorithmus als weniger wahrnehmungswichtig erachtet. Verlustfreie Methoden ordnen Daten effizienter an und kodieren sie, ohne etwas zu verwerfen, sodass die ursprünglichen Pixelwerte perfekt rekonstruiert werden können. Beide Ansätze haben legitime Anwendungsfälle, und die richtige Wahl hängt vom Inhaltstyp, dem Auslieferungskontext und den Qualitätsanforderungen ab.
Das Verständnis von Komprimierung ist wichtig, weil Bilder etwa 42% des gesamten Seitengewichts auf der durchschnittlichen Website ausmachen. Die Wahl des falschen Formats oder der falschen Qualitätseinstellung kann Hunderte von Kilobytes pro Bild hinzufügen und sich direkt auf Ladezeiten, Core Web Vitals-Scores und Benutzererfahrung auswirken. Eine Reduzierung von 100 KB pro Bild auf einer Produktseite mit 20 Bildern spart 2 MB Bandbreite pro Seitenaufruf, was sich im großen Maßstab schnell summiert.
2. Verlustbehaftet vs. Verlustfrei: Der grundlegende Unterschied
Die Unterscheidung zwischen verlustbehafteter und verlustfreier Komprimierung ist das wichtigste Konzept bei der Bildoptimierung. Verlustbehaftete Komprimierung erreicht kleinere Dateien, indem sie dauerhaft Daten entfernt. Sobald Sie ein Foto als JPEG mit Qualität 80 speichern, sind die verworfenen Details verloren. Sie können sie nicht wiederherstellen, indem Sie erneut mit Qualität 100 speichern. Jedes weitere verlustbehaftete Speichern verschlechtert das Bild weiter, ein Phänomen, das als Generationsverlust bezeichnet wird.
Verlustfreie Komprimierung hingegen bewahrt jeden einzelnen Pixelwert. Die Datei ist kleiner als das rohe Original, aber wenn sie dekodiert wird, ist die Ausgabe bit-für-bit identisch mit der Eingabe. PNG verwendet eine Kombination aus Filterung (Vorhersage jedes Pixels aus seinen Nachbarn) und DEFLATE-Komprimierung (eine Mischung aus LZ77 und Huffman-Kodierung), um dies zu erreichen. Der Kompromiss besteht darin, dass verlustfreie Dateien für fotografische Inhalte deutlich größer sind als ihre verlustbehafteten Gegenstücke.
Hier ist eine praktische Denkweise. Nehmen Sie ein 1920x1080-Foto einer Landschaft. Als rohes Bitmap sind es 6,2 MB. Als verlustfreies PNG gespeichert, komprimiert es auf etwa 3,1 MB. Als JPEG mit Qualität 85 gespeichert, sinkt es auf etwa 220 KB. Das ist ein 14-facher Größenunterschied zwischen verlustfrei und verlustbehaftet für dasselbe Bild. Das JPEG sieht für das menschliche Auge bei normalem Betrachtungsabstand nahezu identisch aus, aber unter Vergrößerung werden Sie subtile Unschärfe um Kanten und Farbbänderung in Verläufen sehen.
Die Wahl ist nicht immer binär. Moderne Formate wie WebP und AVIF unterstützen sowohl verlustbehaftete als auch verlustfreie Modi innerhalb desselben Containers. WebP verlustfrei ist typischerweise 26% kleiner als PNG, während WebP verlustbehaftet 25-34% kleiner als JPEG bei gleichwertiger wahrgenommener Qualität ist, laut Googles eigenen Benchmarks. AVIF treibt diese Einsparungen noch weiter und erreicht oft 50% kleinere Dateien als JPEG bei vergleichbarer visueller Qualität.
Eine nützliche Faustregel: Verwenden Sie verlustbehaftete Komprimierung für Fotografien und komplexe Bilder, bei denen geringfügiger Qualitätsverlust nicht wahrnehmbar ist. Verwenden Sie verlustfreie Komprimierung für Screenshots, Diagramme, Logos und alle Bilder, die Text oder scharfe Kanten enthalten, bei denen Artefakte sichtbar wären.
3. Verlustbehaftete Komprimierung im Detail
JPEG (Joint Photographic Experts Group)
JPEG ist seit 1992 das dominierende fotografische Format und bleibt im Jahr 2026 das am weitesten verbreitete Bildformat im Web. Der Algorithmus teilt das Bild in 8x8-Pixel-Blöcke, wendet eine DCT auf jeden Block an, quantisiert die resultierenden Frequenzkoeffizienten und wendet dann Huffman- oder arithmetische Entropiekodierung an. Der Quantisierungsschritt ist der Punkt, an dem Datenverlust auftritt: Hochfrequenzkoeffizienten (feine Details) werden bei niedrigeren Qualitätseinstellungen aggressiver gerundet.
JPEG zeichnet sich durch die Komprimierung von Fotografien mit sanften Verläufen und komplexen Farbübergängen aus. Bei Qualität 80-85 zeigen die meisten Fotografien bei normalen Betrachtungsabständen keine sichtbare Verschlechterung. Das Format unterstützt progressive Kodierung, bei der das Bild in mehreren Durchgängen von unscharf zu scharf lädt, was die wahrgenommene Leistung verbessert. JPEG hat jedoch erhebliche Einschränkungen: keine Transparenzunterstützung, keine Animation und sichtbare Blockartefakte bei Qualitätseinstellungen unter 60. Es hat auch Schwierigkeiten mit scharfen Kanten, Text und Grafiken mit flachen Farben und erzeugt charakteristische Klingelartefakte um kontrastreiche Grenzen.
WebP Verlustbehaftet
Google führte WebP im Jahr 2010 ein, und bis 2026 genießt es weltweit über 97% Browser-Unterstützung. WebP verlustbehaftet verwendet einen prädiktiven Kodierungsansatz, der vom VP8-Video-Codec abgeleitet ist. Anstelle fester 8x8-Blöcke verwendet es variable Blockgrößen (4x4 bis 16x16) und sagt jeden Block aus bereits dekodierten benachbarten Blöcken voraus. Nur das Vorhersageresiduum wird transformiert und quantisiert, was von Natur aus effizienter ist als JPEGs Ansatz.
In der Praxis erzeugt WebP verlustbehaftet Dateien, die 25-34% kleiner sind als JPEG bei gleichwertigen SSIM (Structural Similarity Index)-Werten. Ein JPEG, das bei Qualität 82 200 KB wiegt, komprimiert typischerweise auf 140-150 KB als WebP bei gleichwertiger visueller Qualität. WebP unterstützt auch Transparenz (Alpha-Kanal) im verlustbehafteten Modus, etwas, das JPEG überhaupt nicht kann. Die Kodierungsgeschwindigkeit ist mit modernen Bibliotheken wie libwebp 1.4+ vergleichbar mit JPEG.
AVIF Verlustbehaftet
AVIF basiert auf dem AV1-Video-Codec, der von der Alliance for Open Media entwickelt wurde. Es repräsentiert den aktuellen Stand der Technik bei verlustbehafteter Bildkomprimierung. AVIF verwendet größere Transformationsblöcke (bis zu 64x64), ausgefeiltere Intra-Vorhersagemodi und einen fortschrittlicheren Entropiekodierer als JPEG oder WebP. Das Ergebnis ist eine dramatisch bessere Komprimierungseffizienz.
In kontrollierten Tests erzeugt AVIF Dateien, die 50% kleiner sind als JPEG und 20% kleiner als WebP bei gleichwertiger wahrgenommener Qualität. Ein 200 KB JPEG-Foto komprimiert typischerweise auf 90-110 KB als AVIF ohne sichtbaren Qualitätsunterschied. Die Browser-Unterstützung erreichte Anfang 2026 weltweit 92%, wobei Safari volle Unterstützung in iOS 16 und macOS Ventura hinzufügte. Der Hauptnachteil ist die Kodierungsgeschwindigkeit: AVIF-Kodierung ist 5-10x langsamer als JPEG, was es weniger geeignet für Echtzeitverarbeitung macht, aber perfekt für statische Assets, die einmal komprimiert und viele Male ausgeliefert werden.
4. Verlustfreie Komprimierung im Detail
PNG (Portable Network Graphics)
PNG wurde 1996 als patentfreier Ersatz für GIF erstellt und ist zum Standard-Verlustfreiformat für Web-Grafiken geworden. PNG verwendet eine zweistufige Komprimierungs-Pipeline. Zuerst wird ein Vorhersagefilter auf jede Pixelzeile angewendet, wobei aus fünf Filtertypen (None, Sub, Up, Average, Paeth) gewählt wird, um die Entropie der gefilterten Daten zu minimieren. Dann werden die gefilterten Daten mit DEFLATE komprimiert, das LZ77-Wörterbuchabgleich mit Huffman-Kodierung kombiniert.
PNG unterstützt 8-Bit- und 16-Bit-Farbtiefen, volle Alpha-Transparenz und Gammakorrektur. Für Screenshots, Diagramme und Grafiken mit flachen Farben und scharfen Kanten erzeugt PNG saubere, artefaktfreie Ergebnisse. Ein typischer Screenshot eines Code-Editors bei 1920x1080 komprimiert auf 200-400 KB als PNG, verglichen mit 80-150 KB als JPEG, aber die JPEG-Version zeigt sichtbare Artefakte um Textzeichen. PNG-8 (indizierte Farbe, maximal 256 Farben) kann sehr kleine Dateien für einfache Grafiken erzeugen, oft unter 10 KB für kleine Icons.
Die Haupteinschränkung von PNG ist die Dateigröße für fotografische Inhalte. Ein als PNG gespeichertes Foto ist 5-10x größer als dasselbe Bild als JPEG, ohne wahrnehmbare Vorteile. PNG unterstützt auch keine Animation (APNG existiert, hat aber begrenzte Akzeptanz) und unterstützt kein progressives Laden auf die gleiche Weise wie JPEG.
WebP Verlustfrei
WebP verlustfrei verwendet einen grundlegend anderen Ansatz als PNG. Es verwendet räumliche Vorhersage (ähnlich wie PNG-Filter, aber mit 13 Vorhersagemodi statt 5), Farbraumtransformationen (Umwandlung korrelierter RGB-Kanäle in dekorrelierte Darstellungen), Subtract-Green-Transformation und LZ77-Rückwärtsreferenzen mit einem benutzerdefinierten Entropiekodierer. Das Ergebnis sind Dateien, die laut Googles Vergleichsstudie von 12.000 Bildern durchschnittlich 26% kleiner sind als PNG.
WebP verlustfrei ist besonders effektiv für Web-Grafiken, Icons und Screenshots. Ein PNG-Icon, das 15 KB wiegt, komprimiert typischerweise auf 11 KB als WebP verlustfrei. Für Screenshots mit großen Bereichen flacher Farbe können die Einsparungen 40% überschreiten. WebP verlustfrei unterstützt auch Alpha-Transparenz, was es in den meisten Web-Kontexten zu einem direkten Ersatz für PNG macht.
GIF (Graphics Interchange Format)
GIF stammt aus dem Jahr 1987 und verwendet LZW (Lempel-Ziv-Welch)-Komprimierung mit einer auf 256 Farben begrenzten Palette. Obwohl technisch verlustfrei innerhalb seiner 256-Farben-Beschränkung, bedeutet die Palettenbeschränkung, dass GIF Farbquantisierungsartefakte einführt, wenn es auf fotografische Inhalte angewendet wird. Der primäre verbleibende Anwendungsfall von GIF im Jahr 2026 sind einfache Animationen, obwohl selbst dies durch Videoformate (MP4, WebM) und animiertes WebP/AVIF verdrängt wird, die dramatisch bessere Komprimierung bieten.
Eine 5-Sekunden-GIF-Animation bei 320x240 wiegt typischerweise 2-5 MB. Dieselbe Animation als MP4- oder WebM-Video