Warum GIF so groß ist — und WebP nicht

Das GIF-Format stammt aus den 1980ern: maximal 256 Farben pro Bild und eine Kompression, die jedes Einzelbild fast roh speichert. Bei Animationen summiert sich das zu gewaltigen Dateien — ein paar Sekunden Bewegung werden schnell zweistellige Megabyte. Animiertes WebP löst beides: volle Farbtiefe (Millionen statt 256 Farben) und moderne Kompression, die nur die Unterschiede zwischen Bildern speichert. Ergebnis: oft ein Bruchteil der GIF-Größe bei besserer Qualität. Der vollständige Vergleich steht im Beitrag GIF vs WebP.

Wann sich animiertes WebP lohnt

ZielBeste Wahl
Eigene, moderne Websiteanimiertes WebP (klein, schön)
Chat/Messenger (unbekannte App)GIF (überall abspielbar)
Längerer Clip auf eigener Seitestummes Auto-Play-Video
E-MailGIF (breite Unterstützung)

Kurz: Auf der eigenen, modernen Website gewinnt animiertes WebP — überall dort, wo du die Wiedergabe-Umgebung nicht kennst, ist GIF wegen seiner universellen Kompatibilität sicherer.

So erstellst du animiertes WebP

Wichtig zu wissen: Die Browser-Canvas-API allein kann kein animiertes WebP encodieren — dafür braucht es ein spezialisiertes Werkzeug. Die gängigen Wege:

  • Aus einem Video mit ffmpeg (Kommandozeile): ffmpeg kann Videoausschnitte direkt in animiertes WebP wandeln, mit Kontrolle über Bildrate und Qualität. Der Weg ähnelt dem GIF-Export, den der Beitrag GIF aus Video erstellen beschreibt — nur mit WebP als Ziel.
  • Aus einem bestehenden GIF: spezialisierte Konverter wandeln ein animiertes GIF in animiertes WebP und schrumpfen es dabei deutlich. Achte darauf, ob die Verarbeitung lokal oder auf einem Server läuft.
  • Aus Einzelbildern: Werkzeuge wie das WebP-Kommandozeilen-Paket (img2webp) setzen eine Bildsequenz zu einer WebP-Animation zusammen.

Die drei Größen-Regeln gelten weiter

Auch animiertes WebP profitiert von Vernunft bei Länge, Maßen und Bildrate:

  • Kurz halten — 2–6 Sekunden.
  • Klein skalieren — 480 px Breite reicht für die meisten Zwecke.
  • Bildrate senken — 10–15 fps genügen für Gesten und Loops.

Diese Regeln machen aus einem großen animierten WebP ein wirklich schlankes — und sind dieselben, die auch beim GIF gelten.

Fallback nicht vergessen

Weil nicht jede Umgebung animiertes WebP abspielt, lohnt auf Websites ein Fallback: das <picture>-Element mit WebP-Animation und einem GIF- oder Video-Fallback, damit auch ältere Software etwas Bewegtes zeigt. Für längere Clips ist ohnehin ein stummes Auto-Play-Video die effizienteste Lösung — kleiner als jede Animation und mit voller Qualität.

Häufige Fragen

Was ist animiertes WebP?

WebP kann nicht nur Standbilder, sondern auch Animationen speichern — wie ein GIF, aber mit voller Farbtiefe und deutlich effizienterer Kompression. Ein animiertes WebP ist bei gleicher Bewegung oft nur ein Bruchteil so groß wie das entsprechende GIF.

Warum ist animiertes WebP besser als GIF?

GIF ist auf 256 Farben beschränkt und komprimiert schlecht — animierte GIFs werden riesig. Animiertes WebP nutzt moderne Kompression und Millionen Farben, dadurch kleinere Dateien bei besserer Qualität. Der Nachteil: nicht überall wird es abgespielt (manche Messenger und ältere Software).

Wie erstelle ich animiertes WebP?

Aus einem Video oder einem bestehenden GIF mit Werkzeugen, die WebP-Animation ausgeben — etwa ffmpeg auf der Kommandozeile oder spezialisierte Konverter. Der Browser-Canvas allein kann kein animiertes WebP encodieren, deshalb braucht es dafür ein passendes Werkzeug.

Wo sollte ich animiertes WebP nicht verwenden?

Überall dort, wo sichere Wiedergabe zählt und du die Software des Empfängers nicht kennst: bestimmte Messenger, E-Mail-Clients, ältere Systeme. Dort ist GIF (universelle Wiedergabe) oder ein stummes Auto-Play-Video die sicherere Wahl. Fürs eigene, moderne Web ist animiertes WebP dagegen ideal.

Quellen

Google — WebP-Werkzeuge (img2webp) · MDN — WebP-Bildformat.