Notizen vom Team zu Handwerk, Formaten und den kleinen Entscheidungen hinter einem guten Ergebnis.
Warum AVIF beim Dateigewicht so klar gegen PNG gewinnt
AVIF baut auf dem modernen Bildformats, ausgelegt auf wahrnehmungsbezogene Effizienz statt verlustfreie Treue. PNG nutzt DEFLATE auf rohen Pixeldaten, das ist verlustfrei, lässt aber in fotografischen Inhalten enorme Redundanz stehen. AVIF ersetzt diese Redundanz durch Blockvorhersage aus der Videowelt und verwirft Informationen, die das menschliche Sehen nicht bemerkt. Das Ergebnis ist drastisch. Ein 116-Kilobyte-Foto wird bei Qualität 85 zu rund 16 Kilobyte, und ein transparentes PNG schrumpft meist 30 bis 50 Prozent gegenüber einem vergleichbaren WebP. Der Abstand wächst bei hochauflösenden Fotos und schrumpft bei einfachen Grafiken. Für jede Seite, die transparente Bilder an ein modernes Publikum ausliefert, übersetzt sich die Bandbreitenersparnis direkt in schnellere Ladezeiten und geringere Egress-Kosten.
Die Geschichte des Alpha-Kanals im Detail
PNG und AVIF speichern Transparenz beide als eigene Alpha-Ebene neben den Farbdaten. Wenn dieses Paar dein PNG verarbeitet, trennt der Decoder die Farbpixel und die Alpha-Maske unabhängig voneinander. Die AVIF-Umwandlung schreibt dann eine neue Datei mit eigener Alpha-Spur und komprimiert beide Ebenen mit modernen Bildformat bei Qualität 85. Das Alpha wird nicht in die Farbe eingebrannt und nicht durch eine Hintergrundfüllung ersetzt. Weiche Schatten, ausgefranste Ränder und teiltransparente Verläufe werden alle getreu codiert. Die einzige Verschlechterung, die AVIF hinzufügt, ist die verlustbehaftete Kompression der Alpha-Ebene selbst, die an sehr harten Kanten bei extremem Zoom kaum sichtbare Säume erzeugen kann. In normaler Anzeigegröße und bei Qualität 85 ist der Unterschied nicht sichtbar. Für pixelgenaue Icon-Arbeit in winzigen Größen behalte das PNG.
Geschwindigkeit in der Praxis, Browser für Browser
Die AVIF-Umwandlung wird einmal pro Browser-Sitzung vorbereitet, rund 800 Millisekunden zum Holen plus 300 zum Initialisieren, der erste Durchlauf trägt also etwa eine Sekunde Aufwärmzeit. Warme Durchläufe überspringen das. Auf Chrome am Desktop braucht 0,12 Megapixel rund 40 Millisekunden, 1 Megapixel etwa 250 Millisekunden und 8 Megapixel rund 2,8 Sekunden. Firefox ist der Ausreißer, läuft mit derselben Software rund viermal langsamer, ein 4K-Foto kann dort 30 Sekunden oder mehr dauern. WebKit auf Safari liegt zwischen beiden, näher an Chrome. Auf mittelklassiger Mobil-Hardware laufen die Zahlen drei- bis fünfmal schlechter als auf Chrome am Desktop. Wandelst du oft große Dateien um, gibt Chrome auf Desktop oder Laptop den besten Durchsatz.
Wann du das PNG statt umzuwandeln behalten solltest
PNG bleibt in mehreren Fällen die richtige Wahl, selbst wenn die Dateigröße zählt. Erstens können Grafiken mit scharfem Text in kleinen Größen, etwa Labels, Badges oder Icons auf Favicon-Niveau, in AVIF Artefakte zeigen, die bei normalem Betrachtungsabstand stören. Zweitens sollten Master-Dateien für weitere Bearbeitung PNG bleiben, da jeder Durchgang durch ein verlustbehaftetes Format Qualität abbaut. Drittens brauchen Umgebungen, die AVIF ablehnen, darunter manche Dokumenteditoren, ältere Designwerkzeuge und E-Mail-Programme, PNG zur Kompatibilität. Schließlich bleibt Animation über das erste Bild hinaus nicht erhalten, da dieses Paar ein einzelnes Bild verarbeitet. Für alles andere, transparente Fotos und grafische Assets für die moderne Web-Auslieferung, ist PNG zu AVIF der richtige Tausch.
Core Web Vitals und das Bandbreiten-Argument
Largest Contentful Paint, die zentrale Lademetrik, hängt direkt von der Größe des größten Bildes auf einer Seite ab. Dieses Bild von 116 Kilobyte auf 16 Kilobyte zu senken, gemessen an einem 4K-Foto in der Entwicklung, kürzt die Übertragungszeit auf einer 10-Mbit/s-Verbindung von rund 93 Millisekunden auf rund 13 allein für dieses Element. Multipliziert über ein Produktraster, ein Hero-Karussell oder eine UI voller transparenter Icons drückt die kumulierte Ersparnis LCP klar unter die 2,5-Sekunden-Schwelle, die Google als gut wertet. Die Verbreitung von AVIF beschleunigte sich gerade, weil sich das Argument in harten Zahlen führen lässt. Bei rund 94,3 Prozent Browserabdeckung ist der Fallback-Fall klein genug, dass der Bandbreitengewinn das zusätzliche picture-Markup aufwiegt.
Worin sich das von einem üblichen Online-Konverter unterscheidet
Die meisten Online-AVIF-Konverter laden dein PNG auf Maschinen hoch, die du nicht kontrollierst, verarbeiten es dort und behalten es unter der Aufbewahrungsregel, die der Anbieter festlegt, oft vage. RoundCut ist offen über seinen Ablauf. Weil AVIF aufwendig ist, läuft die Umwandlung für das beste Ergebnis auf unserem Server, mit einem Encoder im Browser als automatischem Rückfall, wenn der Server nicht verfügbar ist. Wird deine Datei an uns geschickt, wird sie umgewandelt und dann nach etwa 2 Stunden entfernt, und ohne Verwendung über die Umwandlung hinaus. Es gibt keine dauerhafte Speicherung und keine Weitergabe deines Bildes. Für alle, die mit Kundendokumenten, eigener Produktfotografie oder nutzergeneriertem Material arbeiten, lautet die ehrliche Fassung des Tauschs: Die Datei kann unseren Server passieren, sie wird nur zum Erzeugen deines AVIF verarbeitet und bleibt nicht.