Bildformate

PNG oder WebP: Welches Format passt zu deinem Bild?

Vergleiche PNG und WebP für Screenshots, transparente Grafiken und Fotos. Prüfe Kanten, Einstellungen und Kompatibilität vor der Konvertierung.

Von Pixilo · Aktualisiert am

Was unterscheidet die Formate?

PNG komprimiert verlustfrei und lässt die Pixelwerte unverändert. WebP unterstützt verlustbehaftete und verlustfreie Komprimierung sowie transparente Bereiche. Auch eine transparente WebP-Datei kann durch verlustbehaftete Komprimierung Farbdetails verlieren. Prüfe deshalb die Exporteinstellungen. Googles WebP-Dokumentation erklärt die Möglichkeiten des Formats.

Prüfe drei Dinge: Kann das Ziel die Datei öffnen, sieht sie richtig aus und ist sie sinnvoll kleiner? Eine einzige positive Antwort genügt nicht.

Verlustfrei beschreibt den Kompressionsschritt. Skalieren, eine reduzierte Farbpalette oder Bearbeitungen vor dem Speichern können auch ein PNG verändern. Ebenso bewahrt die Umwandlung eines verlustbehafteten WebP in PNG nur die aktuellen Pixel; frühere Verluste werden nicht rückgängig gemacht. Der Leitfaden zu verlustbehafteter und verlustfreier Kompression erklärt den Unterschied.

Screenshots sorgfältig vergleichen

Optimiere PNG, bevor du das Format wechselst. Unsere undurchsichtige Testgrafik mit Text und Linien hat ursprünglich 109,2 kB. Pixilos Startseiten-Kompressor verkleinert sie auf 20,6 kB PNG und erhält dabei die dekodierten Pixel sowie 960 × 640 Pixel. Diesen Export haben wir am 24. Oktober 2026 erneut überprüft. Pixilos PNG-zu-WebP-Konverter erzeugte aus demselben Original am 1. Oktober 2026 das WebP mit 18,3 kB bei Qualität 80.

WebP spart rund 83 % gegenüber dem Original-PNG, aber nur 2,4 kB oder 11,5 % gegenüber dem optimierten PNG. Der Schieberegler vergleicht nun dieses optimierte PNG mit WebP. Für einen Screenshot mit exakt zu erhaltender Schrift kann das verlustfreie PNG trotz des kleinen zusätzlichen Downloads sinnvoller sein. Dies sind Ergebnisse für eine Grafik, keine Vorhersage für deine Dateien.

Beginne mit dem vergrößerten Ausschnitt und ziehe die Trennlinie über dieselben Buchstaben und Farbkanten. Achte auf weichere Striche, schwache Farbsäume und Veränderungen an Ein-Pixel-Linien. Die Detailansicht vergrößert die Pixel zweifach, damit Unterschiede leichter sichtbar werden. Wechsle zum ganzen Bild, um die normale Lesegröße zu beurteilen. Akzeptiere oder verwerfe eine Datei nicht allein aufgrund einer Vergrößerung.

Dies ist ein einzelner verlustbehafteter WebP-Export, kein Test von verlustfreiem WebP. Qualität 80 ist eine Encodereinstellung, nicht „80 % der ursprünglichen Details“. Wird eine Beschriftung, ein Preis oder eine Diagrammlinie unklar, behalte PNG oder nutze einen ausdrücklich verlustfreien Ablauf. Eine hohe prozentuale Ersparnis allein belegt die Eignung nicht.

Testgrafik mit Text, feinen Linien und farbigen Balken — Pixilo-WebP
Testgrafik mit Text, feinen Linien und farbigen Balken — Optimiertes PNG

PNG verlustfrei optimiert. WebP mit Pixilo bei Qualität 80 exportiert; beide 960 × 640 px. Ziehe die Trennlinie oder nutze die Pfeiltasten zum Vergleichen.

WebP-Qualität wählen und den richtigen Endpunkt finden

  1. Erstelle eine PNG-Vergleichsversion. Komprimiere eine Kopie ohne Größenänderung und behalte das kleinere PNG, wenn die Pixel unverändert bleiben.
  2. Teste die WebP-Standardqualität. Exportiere aus dem Original mit denselben Maßen. Prüfe den kleinsten wichtigen Text oder Strich in normaler Größe und untersuche fragliche Stellen in der Detailansicht.
  3. Passe nur bei Bedarf an. Leiden Details, erhöhe die Qualität schrittweise, etwa von 80 auf 85 oder 90. Ist der Standard eindeutig ausreichend, kannst du eine niedrigere Einstellung testen. Exportiere immer neu aus dem Original; diese Werte sind Beispiele, keine allgemeinen Empfehlungen.
  4. Vergleiche die fertigen Kandidaten. Höre auf, wenn die nützliche Ersparnis und sichtbare Qualität von WebP zur Aufgabe passen. Wird ein akzeptables WebP so groß wie das optimierte PNG, behalte PNG. Qualität 100 wählt weiterhin keinen verlustfreien WebP-Modus.

Transparente Kanten auf zwei Hintergründen testen

Transparenz und Farbgenauigkeit sind getrennte Eigenschaften. WebP kann leere Bereiche erhalten, während verlustbehaftete Kodierung die Farbe sichtbarer Randpixel verändert. Das undurchsichtige Beispiel oben prüft dies nicht. Vergleiche deine eigene transparente PNG- und WebP-Datei auf hellem und dunklem Hintergrund, einschließlich weicher Schatten und teilweise transparenter Kanten.

Ein auf Weiß sauberer Freisteller kann auf Anthrazit einen hellen Saum zeigen. Prüfe vor einer Schuldzuweisung an die Konvertierung, ob der Saum bereits im PNG vorhanden war. Beurteile beide Dateien vor ihrem tatsächlichen Einsatzhintergrund; ein Schachbrett allein kann Randprobleme verbergen.

Heller Hintergrund

Transparente runde Testgrafik mit dem Buchstaben P — PNG — Heller HintergrundPNG
Transparente runde Testgrafik mit dem Buchstaben P — WebP — Heller HintergrundWebP

Dunkler Hintergrund

Transparente runde Testgrafik mit dem Buchstaben P — PNG — Dunkler HintergrundPNG
Transparente runde Testgrafik mit dem Buchstaben P — WebP — Dunkler HintergrundWebP
Dasselbe transparente PNG und Pixilo-WebP (Qualität 80, 960 × 640 px) auf zwei festen Hintergründen. Prüfe die runde Kante. PNG · 25,0 kB · WebP · 8,0 kB

JPEG ist ungeeignet, wenn Transparenz erhalten bleiben muss. Brauchst du einen einfarbigen Hintergrund, wähle ihn mit dem Hintergrundfarbwerkzeug und kontrolliere das Ergebnis im Ziellayout.

Was ist mit Fotos im PNG-Format?

Ein PNG-Foto lohnt den Vergleich, weil verlustfreie Speicherung mehr Details bewahren kann als eine kleine Webdarstellung benötigt. Exportiere WebP und beurteile, ob die Einsparung die sichtbare Veränderung rechtfertigt. Einfache Grafiken, vorhandene Optimierung und Einstellungen beeinflussen das Ergebnis: Nicht jedes PNG schrumpft.

Prüfe auch die Abmessungen. Pixilos PNG-zu-WebP-Konverter bietet eine standardmäßig aktivierte Begrenzung der längsten Seite auf 4000 Pixel. Kontrolliere vor dem Vergleich die Größenoption und die Maße des Downloads. Für einen reinen Formatvergleich brauchst du gleiche Pixelmaße: Eine kleinere Bildfläche kann unabhängig von WebP viel Speicher sparen.

Wähle die Datei, die deine Prüfungen besteht

  1. Bewahre das PNG-Original auf.
  2. Exportiere daraus eine WebP-Version zum Vergleich.
  3. Prüfe Schrift, Kanten, Schatten und endgültigen Zuschnitt.
  4. Vergleiche Dateigröße und Abmessungen.
  5. Öffne die Datei in der Zielanwendung oder veröffentlichten Seite.

Nutze fürs Web die kleinere Version nur, wenn sie visuell genügt. Wenn du die Datei zur weiteren Bearbeitung weitergibst, haben die Formatvorgaben des Empfängers Vorrang. Unterschiedliche Aufgaben können zu unterschiedlichen Entscheidungen führen.

Wiederhole den Test mit einem Original, das deine Arbeit repräsentiert. Notiere Quell- und Ausgabegröße, Pixelmaße, Qualitätseinstellung und das geprüfte Detail. Hier gelten Dezimaleinheiten: 1 kB sind 1000 Bytes. Bewahre die Quelle auch dann auf, wenn WebP die bessere Veröffentlichungskopie ist, und prüfe die veröffentlichte Seite, falls dein CMS den Upload neu kodiert.

Kann ich WebP in PNG umwandeln?

Ja. Erstelle mit WebP zu PNG eine PNG-Kopie, die transparente Bereiche des WebP-Bildes beibehält. Details, die durch frühere verlustbehaftete Komprimierung verloren gingen, werden dabei nicht wiederhergestellt.

Erst ein PNG vergleichen

Wähle ein repräsentatives Bild mit den Details, die erhalten bleiben müssen.

PNG in WebP umwandelnWebP und JPG vergleichen →