So reduzierst du AVIF-Dateien, ohne das Format zu ändern

AVIF ist bereits ein kompaktes Bildformat. Das bedeutet nicht, dass jede AVIF-Datei fertig optimiert ist. Designprogramme und Exportskripte wählen oft vorsichtige Qualitätseinstellungen. Dadurch kann ein Hero-Bild oder eine Produktgalerie trotz AVIF schwerer bleiben als nötig.

Die nützliche Frage ist nicht, ob sich AVIF erneut komprimieren lässt. Das geht. Die Frage ist, wie du die AVIF-Dateigröße reduzierst, ohne versehentlich die Abmessungen zu ändern, das Bild in ein anderes Format umzuwandeln oder Schäden zu akzeptieren, die erst nach der Veröffentlichung auffallen.

Beginne mit den Abmessungen, die Nutzer wirklich sehen

Komprimierung macht überflüssige Pixel nicht nützlich. Wird ein Bild höchstens 1200 Pixel breit dargestellt, während die Quelldatei 4000 Pixel breit ist, bringt das Anpassen der Abmessungen meist mehr als ein weiterer Encoder-Durchlauf.

Prüfe die größte Darstellung im Layout, einschließlich hochauflösender Displays, und exportiere nahe an diesem Bedarf. Bewahre das Original außerhalb des Auslieferungsordners auf, damit du später darauf zurückgreifen kannst. Die Web-Version ist eine Ableitung, nicht dein Archiv.

Es gibt gute Gründe, eine größere Quelle zu behalten. Responsive Bilder brauchen möglicherweise mehrere Breiten, und eine zoombare Produktansicht benötigt mehr Details als eine statische Karte. Entscheide bewusst. Sende nicht jedem Besucher die Masterdatei, nur weil sie sich am einfachsten ins Projekt ziehen ließ.

Komprimiere AVIF erneut, ohne es zu konvertieren

Wenn die Abmessungen stimmen, nutze einen AVIF-Kompressor, der wieder AVIF ausgibt. Das klingt selbstverständlich, doch manche Werkzeuge verstehen unter „AVIF komprimieren“ nur, dass sie AVIF als Eingabe annehmen, und exportieren anschließend unbemerkt WebP oder JPG.

PiPic folgt einer einfacheren Regel: AVIF hinein, optimiertes AVIF mit derselben Breite und Höhe heraus. Der kostenlose AVIF-Kompressor nimmt eine Datei oder einen Stapel mit bis zu 100 Dateien an, jeweils bis 8 MB. Danach kannst du die Dateien einzeln oder den ganzen Satz als ein ZIP herunterladen.

Der Ablauf ist kurz:

1. Ziehe die AVIF-Dateien in den Kompressor.
2. Warte auf die Vorher- und Nachher-Größe neben jeder Datei.
3. Lade das kleinere Ergebnis herunter und vergleiche es mit dem Original.
4. Behalte das Original, wenn die Ersparnis kaum relevant oder der visuelle Kompromiss nicht sinnvoll ist.

PiPic behält das Original, wenn das komprimierte Ergebnis größer wäre. Das ist bei AVIF wichtig, denn eine bereits sorgfältig optimierte Datei hat eventuell kaum noch Reserven.

Prüfe die Qualität, statt einem Versprechen zu vertrauen

AVIF unterstützt verlustbehaftete und verlustfreie Komprimierung. Bei der Web-Auslieferung ist verlustbehaftete Kodierung üblich, weil sie einen großen Teil der Größenersparnis ermöglicht. „Kein Qualitätsverlust“ ist daher nicht das richtige Versprechen. Der ehrliche Test lautet: Ist die Veränderung in der tatsächlichen Verwendung des Bildes sichtbar?

Vergleiche zuerst bei der gerenderten Größe und vergrößere anschließend Bereiche, in denen Schäden oft auffallen:

• Verläufe und dunkle Schatten;
• Haut, Haare, Blätter und andere feine Texturen;
• scharfe Kanten um Text oder UI-Screenshots;
• Transparenz und weiche Ränder;
• gesättigte Farben und helle Spitzlichter.

Urteile nicht nur anhand der Dateigröße. Eine kleinere Datei ist nur dann ein Gewinn, wenn sie ihre Aufgabe weiterhin erfüllt. Für das zentrale Bild einer Landingpage lohnt sich eine zusätzliche Minute Prüfung. Bei einem kleinen Thumbnail genügt häufig der Vergleich in Darstellungsgröße.

Behalte ein Fallback, wenn deine Zielgruppe es braucht

AVIF funktioniert in aktuellen Versionen von Chrome, Edge, Firefox, Opera und Safari. Seine Geschichte ist jedoch kürzer als die von JPEG oder PNG, und alte Software kann es möglicherweise nicht öffnen. MDN empfiehlt deshalb ein Fallback, wenn breite historische Unterstützung wichtig ist; der Leitfaden zu Bildformaten zeigt die Unterschiede.

Auf einer Website lässt <picture> den Browser zuerst AVIF wählen und bei Bedarf auf WebP oder JPEG zurückfallen:

<picture>
  <source srcset="hero.avif" type="image/avif" />
  <source srcset="hero.webp" type="image/webp" />
  <img src="hero.jpg" width="1200" height="800" alt="" />
</picture>

Behalte die Attribute width und height. So kann der Browser Platz reservieren, bevor das Bild eintrifft, und Layoutsprünge vermeiden. Stelle außerdem sicher, dass das Fallback wirklich existiert. Eine <source>-Zeile zu einer fehlenden Datei schafft keine Kompatibilität.

Mache Stapelkomprimierung zum Auslieferungsschritt

Ein optimiertes Hero-Bild hilft. Ein wiederholbarer Prozess hilft mehr. Sammle vor der Veröffentlichung die AVIF-Ressourcen einer Seite, komprimiere sie als Stapel und prüfe zuerst die größten Ergebnisse, statt zufällige Dateien zu öffnen.

Nutze eine kurze Checkliste:

• Die Abmessungen entsprechen der größten Darstellung.
• Die Ausgabe bleibt .avif und wird als image/avif ausgeliefert.
• Die Vorher-Nachher-Differenz ist den Austausch wert.
• Wichtige Kanten, Verläufe und transparente Bereiche sehen weiterhin gut aus.
• Responsive Varianten und Fallbacks existieren, wenn die Zielgruppe sie braucht.
• Die ausgelieferte Antwort enthält sinnvolle Cache-Header.

Wenn dieselben Dateien in einem Repository oder einer Build-Pipeline liegen, kann die PiPic Agent CLI die Komprimierung in diesen Ablauf integrieren. Für einen einmaligen Ordner ist der Browser meist schneller: Dateien ablegen, Ergebnisse prüfen und das ZIP mitnehmen.

AVIF ist effizient, aber nicht magisch. Gib dem Bild die richtigen Abmessungen, komprimiere es ohne Formatwechsel erneut und prüfe, was Nutzer tatsächlich sehen. So wird die AVIF-Datei kleiner, ohne dass Optimierung zum Rätselraten wird.