PNG, JPEG oder WebP: Welches Bildformat solltest du verwenden?

Die meisten Entscheidungen für ein Bildformat hängen an zwei Fragen. Braucht das Bild transparente Bereiche? Und wäre ein kleiner Qualitätsverlust sichtbar? Beantworte diese beiden, und das Format wählt sich fast von selbst. Die dritte Frage, wohin die Datei geht, entscheidet, ob die neueren Formate überhaupt erlaubt sind, denn Marktplätze und viele Apps akzeptieren immer noch nur JPEG und PNG.

Dieser Ratgeber vergleicht die vier Formate, denen du bei Fotos und Grafiken im Web am häufigsten begegnest: JPEG, PNG, WebP und AVIF. Am Ende steht eine schnelle Empfehlung für die üblichen Aufgaben: Logos, Produktfotos, normale Fotos und freigestellte Bilder mit transparentem Hintergrund.

Die Vergleichstabelle

Die Formatdetails stammen aus dem Bildformat-Ratgeber von MDN. Die Zeile zur Unterstützung ist bei Browsern weniger wichtig als früher: Jeder aktuelle große Browser zeigt WebP, und AVIF wird in neueren Versionen aller Browser unterstützt. Wichtig ist sie noch überall sonst, etwa bei Upload-Formularen, Marktplätzen, E-Mail-Programmen und älterer Desktop-Software.

Verlustbehaftet und verlustfrei, einfach erklärt

Verlustfreie Kompression verkleinert eine Datei, ohne ein einziges Pixel zu verändern. Dekodierst du ein PNG, bekommst du exakt das zurück, was gespeichert wurde. Das ist ideal für alles mit harten Kanten und Flächenfarben, etwa Text, Logos, Strichzeichnungen, Benutzeroberflächen und Screenshots, wo jede Unschärfe oder jeder Farbsaum sofort auffällt.

Verlustbehaftete Kompression verwirft Details, die das Auge kaum bemerkt. Fotos vertragen das gut, weil sie voller Rauschen und weicher Übergänge sind. JPEG funktioniert so, und bei vernünftigen Qualitätseinstellungen schrumpft ein Foto auf einen Bruchteil seiner PNG-Größe, ohne sichtbaren Unterschied.

Daraus folgen zwei praktische Regeln:

• Jedes verlustbehaftete Speichern kostet etwas mehr. Behalte ein verlustfreies Original (die Kameradatei, ein PNG oder die Projektdatei deines Editors) und exportiere verlustbehaftete Kopien daraus, statt dasselbe JPEG immer wieder zu bearbeiten und zu speichern.
• Verlustbehaftete Kompression schadet scharfen Kanten am meisten. Ein als JPEG gespeichertes Logo bekommt verschmierte Artefakte („Mosquito Noise“) um die Buchstaben, ein Screenshot unscharfen Text.

Transparenz: das entscheidende Merkmal für Freisteller

JPEG hat keinen Alphakanal. In einem JPEG lässt sich nicht speichern, dass ein Pixel durchsichtig ist. Entfernst du einen Hintergrund und speicherst als JPEG, wird die leere Fläche mit einer Vollfarbe gefüllt, meist Weiß oder Schwarz. Soll der Freisteller über anderen Inhalten liegen, brauchst du PNG, WebP oder AVIF.

PNG speichert einen vollen Alphakanal: Jedes Pixel kann alles zwischen völlig deckend und völlig transparent sein. Genau das lässt weiche Kanten wie Haare, Fell und Schatten natürlich aussehen. Daneben gibt es einen einfacheren Modus, in dem eine Palettenfarbe als transparent markiert wird. Das reicht für flache Grafiken, ergibt bei Fotos aber gezackte Kanten. Mehr dazu erfährst du unter was ein Alphakanal ist.

WebP unterstützt Transparenz im verlustfreien und im verlustbehafteten Modus. Laut Googles WebP-Dokumentation kostet Transparenz bei verlustfreiem WebP nur etwa 22 % mehr Bytes, und verlustbehaftetes WebP mit Transparenz ist typischerweise etwa 3-mal kleiner als ein vergleichbares PNG. Damit ist verlustbehaftetes WebP der effizienteste Weg, ein transparentes Produktfoto auf deiner eigenen Website auszuliefern.

Dateigröße

Für dasselbe Bild ist die grobe Reihenfolge von groß nach klein PNG, JPEG, WebP, AVIF, mit einer wichtigen Einschränkung: PNG ist nur bei Fotos „groß“. Bei flachen Grafiken mit wenigen Farben ist PNG oft kleiner als JPEG und immer schärfer.

Googles veröffentlichte Zahlen zu WebP sind ein nützlicher Richtwert:

• Verlustfreie WebP-Dateien sind 26 % kleiner als PNGs.
• Verlustbehaftete WebP-Dateien sind bei gleichem SSIM-Qualitätswert 25 bis 34 % kleiner als vergleichbare JPEGs.

MDN rät für Rasterbilder im Web zu WebP oder AVIF, die im Allgemeinen besser komprimieren als PNG, JPEG und GIF. AVIF unterstützt außerdem 10 und 12 Bit Farbtiefe, was bei weichen Verläufen hilft. Seine Schwachstelle ist die Unterstützung außerhalb von Browsern: Viele Apps und Upload-Formulare lehnen es noch ab.

Die Dateigröße zählt vor allem, wenn du vielen Besuchern viele Bilder auslieferst. Bei einem einzelnen Upload auf einen Marktplatz, der ohnehin alles neu komprimiert, ist das akzeptierte Format wichtiger als die gesparten Bytes.

Wo welches Format akzeptiert wird

Browser sind der einfache Teil. Bei Marktplätzen und Apps werden Formate abgelehnt. Das sind die akzeptierten Formate laut der Dokumentation der jeweiligen Plattform, geprüft im Oktober 2026:

Zwei Dinge fallen auf. Erstens akzeptieren Amazon, Walmart und Meta-Kataloge weder WebP noch AVIF, bleib für Marktplatz-Uploads also bei JPEG oder PNG. Zweitens schreibt Etsy, dass transparente PNGs nicht unterstützt werden und transparente Bereiche schwarz erscheinen können. Setz Freisteller dort vor dem Upload auf eine Farbe. Genaue Pixelgrößen pro Plattform findest du in der Übersicht der Produktfoto-Größen.

Welches Format für typische Aufgaben

Logos

Nimm SVG, wenn du ein Vektor-Original hast; MDN empfiehlt es für Logos und Icons. Brauchst du eine Rasterdatei, nimm PNG mit transparentem Hintergrund oder auf deiner eigenen Website verlustfreies WebP. Niemals JPEG: Es erzeugt Unschärfe an den Kanten und kann nicht transparent sein.

Produktfotos

Für Hauptbilder auf Marktplätzen nimm JPEG auf reinweißem Hintergrund. Amazons Verkäufer-Blog nennt JPEG das bevorzugte Format, und jeder Marktplatz in der Tabelle oben akzeptiert es. Exportiere mit hoher Qualitätseinstellung (in den meisten Tools etwa 85 bis 92) aus einem verlustfreien Original.

Im eigenen Shop lade ein hochwertiges JPEG oder PNG hoch und lass die Plattform umwandeln. Shopify zum Beispiel schreibt, dass sein Bilddienst jedem Besucher automatisch das beste Format liefert, das sein Browser unterstützt.

Normale Fotos

JPEG ist der sichere Standard zum Teilen und Hochladen. Auf einer Website, die du selbst betreibst, liefert WebP oder AVIF mit JPEG als Fallback denselben Eindruck mit weniger Bytes. Speichert dein Handy HEIC-Dateien, wandle sie in JPEG um, bevor du sie irgendwo hochlädst, wo HEIC nicht aufgeführt ist.

Freisteller und transparente Bilder

Nimm PNG, wenn die Datei überall funktionieren muss: in Folien, Dokumenten, Designtools und den meisten Upload-Formularen. Nimm WebP, wenn du das Bild auf deiner eigenen Webseite platzierst und es klein sein soll. Nimm JPEG nur, wenn du den Hintergrund bewusst mit einer Vollfarbe gefüllt hast, zum Beispiel Weiß für einen Marktplatz.

Screenshots und Diagramme

PNG oder verlustfreies WebP. Verlustbehaftete Formate machen Text unscharf.

Moderne Formate mit Fallback ausliefern

Betreibst du deine eigene Website, musst du dich nicht für ein Format entscheiden. Mit dem HTML-Element picture wählt der Browser das erste Format, das er versteht:

<picture>
  <source srcset="product.avif" type="image/avif">
  <source srcset="product.webp" type="image/webp">
  <img src="product.png" alt="Leather wallet, front view" width="1200" height="1200">
</picture>

Browser mit AVIF-Unterstützung nehmen die erste Quelle, andere weichen auf WebP aus, und ältere nutzen das PNG. Viele Hosting-Plattformen und Bild-CDNs übernehmen diese Umwandlung anhand des Accept-Headers des Browsers für dich, was oft einfacher ist, als jedes Format selbst zu erzeugen.

Formate umwandeln ohne Überraschungen

• PNG oder WebP zu JPEG: Transparente Bereiche werden aufgefüllt. Wähle die Füllfarbe selbst (meist Weiß), statt es dem Tool zu überlassen, denn manche Tools nehmen standardmäßig Schwarz.
• JPEG zu PNG: Die Datei wird größer, aber nicht besser. Die im JPEG verlorene Qualität kommt nicht zurück.
• Beliebiges Format zu WebP oder AVIF: Prüfe, ob die Transparenz erhalten blieb und die Farben stimmen; wandle vorher in das Farbprofil sRGB um, wenn das Bild im Web angezeigt wird.
• JPEGs erneut speichern: Jedes Speichern mit niedrigerer Qualität verstärkt den Verlust. Exportiere einmal aus dem Original.

Ein schnellerer Weg für Freisteller

Wenn du Hintergründe in großer Menge entfernst, exportiert removebackground.dev den Freisteller als transparentes PNG oder WebP oder als JPG auf jeder Vollfarbe. So erzeugst du aus demselben Upload ein Marktplatz-JPEG auf Weiß und ein transparentes PNG für deine Website.