PNG in WebP, kleinere Dateien, die Transparenz behalten

Tausch ein schweres PNG gegen ein schlankes WebP, das seine Transparenz behält und schneller lädt.

oder Bild hier ablegen

Über dieses Tool

Araluma verwandelt ein PNG in WebP und behält die durchsichtigen Stellen. Gib ein einzelnes Bild und die Bild-Engine des Browsers baut es auf deinem eigenen Gerät neu auf, also wird es nirgendwohin geschickt. Gib mehrere auf einmal und sie reisen zu unserem Server, der sie alle zusammen durchgeht und einen Download zurückgibt, dann diesen Download nach etwa 2 Stunden aufräumt. Wo das PNG durchsichtig war, bleibt das WebP durchsichtig, denn WebP trägt einen vollen Alphakanal, und genau deshalb schlägt es JPG, wenn du eine leichtere Datei willst, ohne den Freisteller platt zu machen. Nach Googles eigenen WebP-Zahlen liegt ein verlustfreies WebP etwa 26 Prozent unter einem gleichen PNG, und ein verlustbehaftetes WebP mit Alpha nahe einem Drittel der Größe. Was hier herauskommt, ist verlustbehaftetes WebP bei einer nahezu verlustfreien Einstellung, das einen Hauch Detail auf Bit-Ebene gegen eine kleinere Datei tauscht und bei normalen Bildschirmgrößen wie das Quell-PNG aussieht. Für pixelgenaue Archivkopien behalte das Original-PNG.

So wandelst du PNG in WebP um

So wandelst du PNG in WebP um

Zieh ein PNG in die Ablagefläche oder klick, um danach zu suchen. Die Arbeit beginnt in dem Augenblick, in dem die Datei landet, ohne irgendwo einen Umwandeln-Knopf, und für ein Alltagsbild ist sie in deutlich unter einer Sekunde erledigt. Ein Herunterladen-Knopf speichert dann das WebP unter dem Quellnamen mit neuer Endung. Wandle eines um und es läuft in deinem Browser, gib mehrere und sie steigen zusammen zu unserem Server hoch. Derselbe Weg bedient Handys und Desktops, keine Installation nötig. Für eine weitere zieh einfach das nächste PNG hinein. Gib ihm ein animiertes PNG und nur das erste Bild überlebt, denn das WebP, das es hier macht, ist ein einzelnes Standbild statt einer bewegten Sequenz.

Transparente Pixel gehen direkt ins WebP über

Transparente Pixel gehen direkt ins WebP über

Ein 8-Bit-Alpha-Kanal wohnt in WebP, also landet jeder transparente Pixel in deinem PNG genauso transparent im WebP. Nichts wird weiß, kein Saum umringt einen Ausschnitt, und keine Bereinigung in einem Editor ist danach nötig. Das ist der eigentliche Grund, WebP gegenüber JPG zu bevorzugen, wenn dein PNG Transparenz trägt, denn JPG besitzt kein Alpha und muss klare Pixel gegen eine feste Farbe tauschen. Logos, Symbole, freigestellte Produktfotos, Interface-Mockups, Screenshots mit abgerundeten Ecken, alles, was auf einem durchscheinenden Hintergrund ruht, geht unangetastet hinüber. Es gibt keinen Schalter dafür umzulegen, es passiert einfach, weil Alpha zu tragen Teil dessen ist, wofür WebP gebaut wurde.

Gründe, von PNG auf WebP zu wechseln

Gründe, von PNG auf WebP zu wechseln

Vor allem bekommst du eine viel leichtere Datei, während Transparenz und sichtbare Qualität halten. Googles offizielle WebP-Zahlen zeigen verlustfreies WebP rund 26 Prozent unter einem gleichen PNG, und verlustbehaftetes WebP mit Alpha nahe einem Drittel der Größe eines vergleichbaren. Leichtere Bilder kommen schneller an, was direkt in Largest Contentful Paint einfließt, einen von Googles Core Web Vitals und einen bekannten Ranking-Faktor. PageSpeed Insights nennt PNG sogar unter seinem Hinweis auf Next-Gen-Formate, und der Wechsel zu WebP räumt diese Markierung weg. Auch die Unterstützung ist kein Hindernis, denn Chrome, Firefox, Safari und Edge lesen WebP alle nativ.

Qualitätseinstellung und der verlustbehaftete Kompromiss

Qualitätseinstellung und der verlustbehaftete Kompromiss

Araluma schreibt das WebP mit einer Einstellung nahe der Verlustfreiheit, abgestimmt auf Fotos wie auf Grafiken, sodass es bei gewöhnlichen Anzeigegrößen genauso aussieht wie das PNG, aus dem es kam. Auf diesem Niveau gehalten ist WebP technisch verlustbehaftet, was bedeutet, dass ein wenig Bit-Präzision gegen eine makellose verlustfreie Kopie hergegeben wird. Für fast alle Web-Arbeit, Logos, Symbole, Interface-Elemente, Fotos, ist diese Lücke unsichtbar. Wenn die Aufgabe pixelgenau ist, etwa medizinische Scans oder Archiv-Master, behalte das PNG und lass das WebP der Export sein. Bei Fotos kannst du meist einen Rückgang von 50 bis 70 Prozent in der Größe erwarten, gelegt auf den strukturellen Vorsprung, den WebP über PNG ohnehin hat.

Wo das PNG wirklich umgewandelt wird

Wo das PNG wirklich umgewandelt wird

Das teilt sich danach, wie viele du gibst. Wandle ein einzelnes PNG um und die ganze Aufgabe passiert im Tab, auf der Bild-Engine des Browsers selbst, auf deinem Gerät, ohne dass etwas hochsteigt und ohne dass etwas zur Datei notiert wird. Prüf es selbst, öffne DevTools, lass das Netzwerk-Panel offen, während du dieses eine Bild umwandelst, und zähl null ausgehende Anfragen, die es tragen. Wandle eine Handvoll zusammen um und sie steigen zu unserem Server hoch, der sie alle durchgeht und einen einzigen Download zurückgibt. Dieser Download wird nach etwa 2 Stunden von unserem Server aufgeräumt, und du kannst ihn in dem Moment löschen, in dem du speicherst. So verlässt ein Bild nie den Browser, und ein Stapel bleibt auf unserem Server nur so lange, wie es dauert, das zusammenzubauen, was du mitnimmst.

Wann das originale PNG noch die richtige Wahl ist

Wann das originale PNG noch die richtige Wahl ist

So weit WebP auch reicht, ein paar Orte bleiben ihm verschlossen. Eine Handvoll Gestaltungsprogramme, Druckereien und firmeneigene Redaktionssysteme bestehen nach wie vor auf PNG, und während dein Betriebssystem ein PNG per Ziehen ohne Murren schluckt, fragt es bei WebP gern nach einer Erweiterung. Daher die einfache Faustregel zum Aufbewahren: Was du in einem Desktop-Programm wieder und wieder anfasst und neu sicherst, hältst du am besten als verlustfreies PNG, sonst stapeln sich mit jeder Runde aus Auspacken und Neuschreiben kleine Verluste. Schick WebP ins Web und lass das PNG zu Hause als Quelle ruhen. Brauchst du irgendwann die Gegenrichtung und willst aus einem WebP wieder ein PNG machen, steht dafür das Werkzeug webp-to-png bereit.

So funktioniert es

  1. Gib ein PNG her

    Schieb das PNG auf die Seite oder such es im Auswähler. Die durchsichtigen Stellen kommen mit. Wandle eins um und es bleibt auf deiner Maschine, leg mehrere ab und sie steigen zu unserem Server hoch, um zusammen behandelt zu werden.

  2. Lehn dich zurück

    Du tust nichts weiter. Ein typisches Bild wird etwa so schnell zum WebP, wie dein Finger sich hebt, ohne Umwandeln-Schritt und ohne Ladekreisel unterwegs.

  3. Sieh zu, wie es schrumpft

    Das Ergebnis meldet, wie groß es geworden ist. Klare Stellen bleiben klar, und das WebP sollte sichtbar weniger wiegen als das PNG, mit dem du begonnen hast.

  4. Behalte dein WebP

    Ein Tipp auf Herunterladen schreibt es hinaus, alter Name, frische .webp-Endung. Mehr in der Reihe? Wirf jedes auf die Seite und sie gehen eins nach dem anderen durch.

Häufig gestellte Fragen

Bleibt die Transparenz beim Umwandeln von PNG zu WebP erhalten?

Sie bleibt. Weil WebP einen vollständigen Alpha-Kanal hält, bleibt jede klare Stelle deines PNG klar, sobald es ein WebP ist. Genau diese Tatsache ist es, warum WebP JPG als Ziel schlägt, wann immer du mit einem transparenten PNG beginnst, denn JPG besitzt kein Alpha und muss die klaren Stellen mit einer festen Farbe streichen, während WebP den Ausschnitt genau so lässt, wie es ihn vorfand. Logos, Symbole, Produktaufnahmen, Interface-Teile auf durchscheinenden Hintergründen, alle gehen ganz hinüber und verlangen nichts Zusätzliches von dir.

Warum PNG in WebP umwandeln?

Für eine schlankere Datei, die sowohl ihre Transparenz als auch ihr Aussehen behält. Nach Googles WebP-Zahlen läuft die verlustfreie Variante rund 26 Prozent unter einem gleichen PNG, und die verlustbehaftete Variante mit Alpha landet nahe einem Drittel davon. Ein schlankeres Bild kommt früher an, was Largest Contentful Paint hilft, einem Core-Web-Vitals-Maß, das Google im Ranking gewichtet. PageSpeed Insights zeigt sogar auf PNG als Next-Gen-Format-Chance in seiner Bildprüfung. Obendrein liest jeder große Browser, von Chrome und Firefox bis Safari und Edge, WebP ohne Hilfe.

Verliert das Umwandeln von PNG zu WebP an Qualität?

Bei der Einstellung nahe der Verlustfreiheit, die Araluma nutzt, sehen Fotos und Grafiken bei gewöhnlichen Anzeigegrößen genauso aus wie das Quell-PNG. Hier gehaltenes WebP ist technisch verlustbehaftet, ein Hauch Bit-Präzision geht also für eine kleinere Datei drauf. Für den alltäglichen Web-Gebrauch, Logos, Symbole, Fotos, ist diese Lücke unsichtbar. Für pixelgenaue oder archivarische Arbeit behalte das PNG und behandle das WebP als die Auslieferungskopie. Die Umwandlung lässt dein PNG unangetastet, es sitzt genau so auf deinem Gerät wie zuvor.

Wie viel kleiner ist WebP als PNG?

Googles offizielle WebP-Zahlen setzen verlustfreies WebP rund 26 Prozent unter ein gleiches PNG, und verlustbehaftetes WebP mit Alpha auf etwa ein Drittel der Größe eines vergleichbaren. Das genaue Verhältnis reitet auf dem Inhalt, wobei Grafiken mit weiten klaren Flächen und einfarbigen Blöcken am meisten gewinnen, während geschäftige, detailreiche Fotos einen kleineren, aber immer noch nützlichen Rückgang sehen. So oder so kommt das WebP leichter heraus und die Transparenz überlebt.

Ist es sicher, hier PNG in WebP umzuwandeln?

Es kommt darauf an, ob du ein Bild oder mehrere umwandelst. Ein einzelnes PNG wird direkt im Browser neu aufgebaut, also wird diese Datei nicht geschickt, und du kannst es prüfen, indem du DevTools öffnest und mitten in der Umwandlung das Netzwerk-Panel ansiehst, wo keine ausgehende Bildanfrage erscheint. Wandle mehrere auf einmal um und sie steigen zu unserem Server hoch, um zusammen behandelt zu werden, dann wird dieser Download nach etwa 2 Stunden aufgeräumt, und du kannst ihn selbst entfernen, sobald du speicherst. So oder so bleibt nichts von deinem Bild über das Zusammenbauen deines Downloads hinaus.

Funktioniert WebP in allen Browsern?

Tut es, für alle praktischen Zwecke. Das native Lesen kam überall an, sobald Safari 14 im Jahr 2020 erschien und sich zu Chrome, Edge und Firefox gesellte, die zusammen nahezu jeden Browser ausmachen, den Leute tatsächlich nutzen. Die Ausnahmen sind die wirklich alten und einige eingebettete Webviews, und für ein Publikum, das diese einschließen könnte, bleibt PNG die vorsichtige Wahl. Wer auf einem Browser der letzten fünf Jahre ist, bekommt WebP ohne Mühe. Wenn du einen bestimmten Fall bestätigen willst, legt der WebP-Eintrag auf caniuse.com die Unterstützung dar.

Die Details

Notizen vom Team zu Handwerk, Formaten und den kleinen Entscheidungen hinter einem guten runden Zuschnitt.

Wie WebP kleinere Größen als PNG erreicht
WebP läuft in zwei getrennten Modi. Sein verlustfreier Modus paart räumliche und farbliche Vorhersage mit einer Entropie-Stufe, die PNGs DEFLATE übertrifft, und landet laut Googles veröffentlichten Zahlen bei rund 26 Prozent besserer Kompression auf typischen Bildern. Sein verlustbehafteter Modus borgt eine blockbasierte Transformation aus der Videoarbeit, gebaut, um Detail fallen zu lassen, das das Auge kaum bemerkt, während es behält, was es sieht. Trägt ein Bild Alpha, komprimiert WebP dieses Alpha verlustfrei auf eigener Spur, während es die RGB-Daten verlustbehaftet behandelt, und so kann verlustbehaftetes WebP mit Transparenz bei passender sichtbarer Qualität nahe einem Drittel der Größe eines PNG hereinkommen. PNGs DEFLATE kennt nur verlustfrei und kann den wahrnehmungsbasierten Handel, den die verlustbehaftete Spur eingeht, nie anzapfen. Diese strukturelle Trennung ist der ganze Grund für die Größenlücke.
Der Alpha-Kanal im Detail
PNG und WebP tragen beide 8-Bit-Alpha und lassen jeden Pixel eine Deckkraft von 0 für völlig klar bis 255 für völlig deckend angeben. Wenn der Bildmotor der Plattform ein PNG als WebP neu aufbaut, liest er die RGBA-Werte jedes Pixels und führt das Alpha geradewegs in den WebP-Schritt der Kodierung, der es unter verlustfreier Kompression hält, egal wie er das RGB behandelt. Also bilden sich ein völlig klarer Pixel bei 0, ein teils klarer irgendwo zwischen 1 und 254 und ein deckender bei 255 jeweils auf den identischen Zustand im WebP ab. Bei einem Logo mit weichem Schlagschatten oder kantengeglätteter Schrift auf klarem Hintergrund reitet diese zarte Kantenweichheit ganz hindurch. JPG kann das nicht, denn sein Container hat kein Alpha-Feld und zwingt das Bild auf eine Hintergrundfarbe, bevor es überhaupt etwas kodiert.
Core Web Vitals und die Wahl des Bildformats
Wie viele Sekunden bis das größte sichtbare Element einer Seite im Sichtbereich steht, das erfasst Largest Contentful Paint, und meist trägt diese Rolle das Hero-Bild. Google rechnet LCP fest in sein Core-Web-Vitals-Ranking ein. Allein durch sein Gewicht fällt PNG hier immer wieder negativ auf, denn ein fotografisches PNG in 4K kann sich auf mehrere Megabyte summieren, wo dasselbe Motiv als WebP nahe der Verlustfreiheit nur ein Bruchteil bleibt. Genau diesen Punkt benennt PageSpeed Insights in seiner Prüfung zu Next-Gen-Formaten und deutet auf PNG als das zu ersetzende Format. Die PNGs aus dem kritischen Render-Pfad in WebP zu überführen zählt deshalb zu den lohnendsten Einzelschritten für die gemessene Geschwindigkeit. Abgesichert wird das durch den Zeitstrahl der Unterstützung: WebP läuft in Chrome ab 2011, in Firefox ab 2019, in Safari ab 2020 und in Edge seit dem Chromium-Umbau.
Verlustbehaftete Ausgabe und die Einstellung nahe der Verlustfreiheit
WebP legt einen Qualitäts-Regler von 0 bis 100 offen, wo höhere Zahlen mehr Detail halten und mehr Bytes kosten. Araluma fixiert diesen Regler an einem Punkt nahe der Verlustfreiheit, gewählt, um Treue und Größe über die üblichen Web-Kategorien Fotos, Interface-Grafiken und Symbole auszubalancieren. An diesem Punkt liest sich die Ausgabe als nicht unterscheidbar vom Quell-PNG bei normalen Bildschirm-Abständen. Streng genommen rutscht ein wenig Bit-Präzision gegen eine echte verlustfreie Kodierung ab, sodass eine Prüfung Byte für Byte zwischen dem dekodierten WebP und dem originalen PNG winzige numerische Lücken zutage förderte, die alle unter der Schwelle menschlichen Sehens auf fotografischem Material liegen. Für medizinische Scans, Satellitenbilder oder Archivbewahrung, wo verlustfrei eine harte Regel ist, ist der richtige Schritt, das PNG zu behalten und das WebP rein als Auslieferungs-Export zu behandeln statt als Arbeitskopie.
Verhalten der Metadaten
Ein PNG in ein WebP zu verwandeln fegt die EXIF-, IPTC- und XMP-Felder von der Ausgabe, was jede der drei großen Browser-Engines tut. Bei den Farbprofilen gehen die Engines getrennte Wege. Chrome und Safari behalten das sRGB-Tag auf dem WebP, während Firefox alles räumt, das ICC-Profil und sonst alles. Also liest sich das WebP überall als sRGB-sicher, doch ein Weitgamut-Tag, Display-P3, Adobe RGB, ProPhoto RGB, das auf dem Quell-PNG sitzt, hält nicht durch Firefox. Diese Lücke beißt in farbkritischer professioneller Arbeit, also wenn echte Farbtreue mitreiten muss, wähl einen Umwandler, der ICC-Daten bewusst schreibt, oder drück das Profil-Tag danach wieder auf mit einem Metadaten-Editor, der für die Aufgabe gebaut ist.
Wann PNG behalten und wann WebP genügt
Lang braucht die Wahl nicht. Landet das Bild am Ende auf einer Webseite oder in einer Web-App und schaut ein beliebiger Browser ab 2020 zu, dann heißt der Export WebP. Soll es dagegen in Figma, Sketch oder Affinity Designer aufgehen, wirf zuerst einen Blick auf die WebP-Unterstützung deiner konkreten Version, denn die wackelt. Führt der Weg in den Druck, greif zu PNG oder TIFF, weil die meisten Druck-RIPs WebP links liegen lassen. Verlässt es dich per E-Mail, ist PNG die ruhigere Wahl, so unzuverlässig wie E-Mail-Programme mit modernen Formaten umspringen. Und dient es als Arbeitsdatei, die du immer wieder öffnest, änderst und neu sicherst, bleibt das PNG dein Master. Als Auslieferung glänzt WebP nahe der Verlustfreiheit, fürs Archiv und fürs Bearbeiten bleibt PNG vorn. Sauber gedacht: das PNG bewahren und WebP fürs Web hinausschicken.