Bildformate erklärt: JPEG, PNG, WebP, AVIF und mehr
By Artur7 Min. Lesezeit
Jedes Bild im Web nutzt ein Format. JPEG, PNG, WebP, AVIF. Jedes komprimiert anders, unterstützt andere Funktionen und eignet sich besser für bestimmte Bildtypen.
Wählst du das falsche Format, sind deine Bilder größer als nötig. Deine Seiten laden langsamer. Deine Besucher springen ab. Wählst du das richtige, bekommst du scharfe Bilder bei einem Bruchteil der Dateigröße.
Dieser Leitfaden erklärt dir jedes wichtige Bildformat. Du erfährst, was jedes Format kann, wo es glänzt und welches du für dein Projekt verwenden solltest.
Ein Bildformat bestimmt, wie ein Bild als Datei gespeichert wird. Es steuert drei Dinge: Dateigröße, visuelle Qualität und welche Funktionen das Bild unterstützt.
Manche Formate nutzen verlustbehaftete Komprimierung. Sie werfen Daten weg, die deine Augen nicht vermissen. So werden die Dateien kleiner. JPEG macht das. WebP und AVIF auch.
Andere Formate nutzen verlustfreie Komprimierung. Sie verkleinern die Datei, ohne ein einziges Pixel an Detail zu verlieren. PNG funktioniert so. WebP im verlustfreien Modus auch.
Das Format, das du wählst, beeinflusst:
Für einen detaillierten Blick auf die Funktionsweise von Komprimierung schau dir unseren kompletten Leitfaden zur Bildkomprimierung an.
JPEG ist das meistverwendete Bildformat der Welt. 1992 entwickelt, wird es von jedem Gerät, Browser, jeder App und jedem Betriebssystem unterstützt.
JPEG nutzt verlustbehaftete Komprimierung. Es analysiert das Bild in kleinen 8x8-Pixel-Blöcken und entfernt Details, die schwer zu erkennen sind. Bei hohen Qualitätseinstellungen (80-95%) ist der Verlust unsichtbar. Bei niedrigeren Einstellungen siehst du blockartige Artefakte.
JPEG eignet sich am besten für:
JPEG hat Schwächen bei:
Die JPEG-Qualitätseinstellungen reichen von 0-100. Für Webnutzung bietet 75-85 die beste Balance zwischen Größe und Qualität. Über 90 hinaus wächst die Dateigröße ohne sichtbare Verbesserung.
JPEG ist immer noch der sichere Standard zum Teilen von Fotos. Aber fürs Web komprimieren neuere Formate besser. Es gibt keinen Grund, 2026 noch JPEG auf deiner Website auszuliefern, wenn WebP dasselbe bei 30% weniger Dateigröße schafft.
PNG nutzt verlustfreie Komprimierung. Jedes Pixel bleibt genau so, wie es war. Nichts geht verloren.
Das macht PNG perfekt für Bilder, bei denen Präzision zählt. Screenshots, Logos, Diagramme, UI-Elemente und alles mit Text oder scharfen Linien. PNG hält diese Kanten knackig.
PNG unterstützt auch Transparenz. Du kannst ein Logo mit durchsichtigem Hintergrund haben oder eine Grafik, die sanft in jede Seitenfarbe übergeht. JPEG kann das nicht.
Der Kompromiss ist die Dateigröße. Ein Foto als PNG ist 3-10x größer als dasselbe Foto als JPEG. Das liegt daran, dass Fotos Millionen leicht unterschiedlicher Farbwerte haben. Verlustfreie Komprimierung kann diese nicht so effizient verkleinern wie verlustbehaftete.
PNG eignet sich am besten für:
PNG hat Schwächen bei:
Es gibt zwei PNG-Varianten. PNG-8 unterstützt nur 256 Farben (wie GIF) und erzeugt winzige Dateien für einfache Grafiken. PNG-24 unterstützt Millionen Farben und volle Transparenz. Die meisten Tools geben standardmäßig PNG-24 aus.
Für Webgrafiken wird PNG von WebP und SVG abgelöst. Verlustfreies WebP ist 25-30% kleiner als PNG bei identischer Qualität. SVG ist noch kleiner für Logos und Icons, weil es Mathematik statt Pixel verwendet.
WebP ist ein modernes Format, das Google 2010 entwickelt hat. Es kann alles, was JPEG und PNG können, aber mit kleineren Dateien.
WebP unterstützt sowohl verlustbehaftete als auch verlustfreie Komprimierung. Es beherrscht Transparenz. Es unterstützt Animation. Ein Format deckt alle Anwendungsfälle ab, die vorher JPEG, PNG und GIF separat brauchten.
Die Zahlen sprechen für sich:
Die Browserunterstützung ist nahezu vollständig. Chrome, Firefox, Safari, Edge und alle großen mobilen Browser unterstützen WebP. Über 97% der weltweiten Nutzer können WebP-Bilder nativ anzeigen.
WebP ist der praktische Standard für Webbilder in 2026. Es bringt dir spürbare Einsparungen bei der Dateigröße ohne Kompatibilitätssorgen.
Die technischen Details behandeln wir in unserem eigenen Leitfaden: WebP-Komprimierung: Warum sie besser ist als JPEG.
WebP-Dateien sind 25-35% kleiner als JPEG bei gleicher Qualität. Erfahre wie WebP-Komprimierung funktioniert, Browser-Support und wie du deine Bilder konvertierst.
AVIF und WebP im direkten Vergleich. Dateigröße, Browser-Support, Encoding-Speed und Qualität. Finde das richtige Format für deine Bilder.
Lerne den Unterschied zwischen verlustbehafteter und verlustfreier Komprimierung. Finde heraus, welche Methode deine Bildqualität erhält und welche mehr Speicher spart.
Vergleiche TinyPNG, Squoosh und CompressIMG im Detail. Welches Tool gewinnt bei Stapelverarbeitung, Formatunterstützung, Qualität, Preis und API?
AVIF ist das neueste etablierte Bildformat. Es basiert auf dem AV1-Video-Codec, entwickelt von einer Gruppe, zu der Google, Apple, Mozilla und Netflix gehören.
AVIF komprimiert noch besser als WebP. Dateien sind typischerweise 20-30% kleiner als WebP bei gleicher visueller Qualität. Im Vergleich zu JPEG können AVIF-Dateien 50% kleiner sein.
AVIF glänzt bei Fotos mit sanften Farbverläufen, Hauttönen und feinen Farbübergängen. Es hält die Qualität besser als jedes andere Format bei sehr kleinen Dateigrößen. Wenn du die Komprimierung stark aufdrehst, sieht AVIF immer noch sauber aus, während JPEG und WebP Artefakte zeigen.
| Format | Typische Größe vs. JPEG | Transparenz | Animation | Browserunterstützung |
|---|---|---|---|---|
| JPEG | Referenzwert | Nein | Nein | 100% |
| PNG | 3-10x größer | Ja | Nein | 100% |
| WebP | 25-35% kleiner | Ja | Ja | 97%+ |
| AVIF | 40-50% kleiner | Ja | Ja | 93%+ |
Die Nachteile? AVIF kodiert 5-20x langsamer als WebP. Das spielt eine Rolle bei Echtzeit-Komprimierung und großer Stapelverarbeitung. Die Browserunterstützung liegt bei ca. 93%. Gut, aber noch nicht ganz universell.
Für einen detaillierten Direktvergleich lies AVIF vs. WebP: Was komprimiert besser?
Neben den vier Großen gibt es noch weitere Formate für bestimmte Zwecke.
GIF ist das Original-Animationsformat. Es unterstützt nur 256 Farben. Das macht es schlecht für Fotos, aber gut genug für einfache Animationen, Memes und Reaktionsbilder.
GIF-Dateien sind groß im Vergleich zu modernen Alternativen. Animiertes WebP und AVIF erzeugen viel kleinere Dateien mit besserer Qualität. Aber GIF funktioniert ausnahmslos überall. Und das Format ist so fest in der Messaging-Kultur verankert, dass es nicht verschwinden wird.
Nutze GIF für: Kurze Animationen in sozialen Medien und Messenger-Apps. Für alles andere nimm lieber animiertes WebP.
SVG unterscheidet sich grundlegend von jedem anderen Format auf dieser Liste. Es ist ein Vektorformat. Statt Pixelfarben speichert es mathematische Beschreibungen von Formen, Linien und Kurven.
Das bedeutet: SVG-Bilder skalieren auf jede Größe ohne Qualitätsverlust. Ein Logo sieht bei 16px genauso scharf aus wie bei 1600px. Und SVG-Dateien sind winzig für einfache Grafiken. Ein Logo, das als PNG 50 KB groß ist, kann als SVG nur 3 KB haben.
Nutze SVG für: Logos, Icons, Illustrationen, Diagramme und jede Grafik aus Formen und Text. Nutze SVG nie für Fotos.
JPEG XL wurde als echter Nachfolger von JPEG entwickelt. Es bietet bessere Komprimierung als WebP und AVIF, unterstützt verlustbehaftete und verlustfreie Modi, beherrscht HDR und erweiterten Farbraum und kann bestehende JPEG-Dateien verlustfrei transkodieren (20% kleiner, ohne Qualitätsverlust).
Auf dem Papier ist JPEG XL das beste Bildformat aller Zeiten. In der Praxis hat es ein Problem: Chrome hat die Unterstützung 2023 eingestellt. Ohne Chrome kann das Format im Web nicht Fuß fassen. Safari unterstützt es. Firefox hat es hinter einem Flag.
JPEG XL könnte noch seinen Platz in Fotografie-Workflows und Archivierung finden. Aber fürs Web bleib bei WebP und AVIF.
Hier ist ein einfacher Entscheidungsbaum:
Ist es ein Logo, Icon oder eine einfache Grafik? Nimm SVG. Wenn SVG keine Option ist, nimm PNG oder verlustfreies WebP.
Ist es ein Foto fürs Web? Nimm WebP. Wenn dein Setup Format-Aushandlung unterstützt, liefere AVIF mit WebP-Fallback.
Ist es ein Foto zum Teilen oder Drucken? Nimm JPEG. Es funktioniert überall.
Braucht es Transparenz? Nimm WebP oder PNG. Vermeide AVIF, wenn du maximale Kompatibilität brauchst.
Ist es eine Animation? Nimm WebP für Qualität. Nimm GIF für maximale Kompatibilität.
Ist es ein Screenshot oder ein Bild mit Text? Nimm PNG oder verlustfreies WebP. Verlustbehaftete Komprimierung erzeugt Artefakte um Text.
Für die meisten Websites ist die praktische Strategie:
Wenn du eine stark besuchte Website betreibst und die kleinstmöglichen Dateien willst, nimm AVIF dazu. Liefere es an Browser, die es unterstützen. Für den Rest fällt es auf WebP zurück.
Für Hilfe bei der Wahl der richtigen Komprimierungseinstellungen schau dir unseren Leitfaden zu verlustbehafteter vs. verlustfreier Komprimierung an.
Der Trend ist klar: Formate werden immer besser bei der Komprimierung und halten gleichzeitig die Qualität hoch.
AVIF gewinnt weiter an Verbreitung. Wenn die Kodierungsgeschwindigkeiten steigen und die Browserunterstützung wächst, wird es in den nächsten Jahren wahrscheinlich zum neuen Standard.
JPEG XL könnte wieder auftauchen, falls Chrome seine Entscheidung revidiert oder ein wichtiger Anwendungsfall (wie Apples Ökosystem) die Verbreitung antreibt.
KI-basierte Komprimierung ist ebenfalls im Kommen. Neuronale Bild-Codecs können Bilder noch kleiner komprimieren als AVIF, indem sie Muster in Bilddaten erlernen. Das ist heute noch experimentell, könnte aber die Bildkomprimierung in Zukunft grundlegend verändern.
Für den Moment ist der praktische Rat einfach. Nutze WebP als Standard-Webformat. Füge AVIF hinzu, wo es sinnvoll ist. Behalte JPEG und PNG für bestimmte Fälle, in denen Kompatibilität oder verlustfreie Präzision gefragt ist.
Deine Bilder machen den Großteil deines Seitengewichts aus. Das richtige Format kann dieses Gewicht halbieren. CompressIMG macht es dir leicht. Lade deine Bilder hoch, komprimiere sie ins beste Format und sieh den Unterschied sofort. Keine Anmeldung nötig.
CompressIMG
Bilder komprimieren ohne Qualitätsverlust. Kostenlos, schnell und direkt im Browser.