WebP ist ein 2010 von Google entwickeltes Rasterbildformat, das verlustbehaftete und verlustfreie Kompression kombiniert, Transparenz und Animation unterstützt und dabei 25–35 % kleinere Dateigrößen als JPEG bei vergleichbarer Qualität erreicht.
Rubrik: Ausgabeformate & Technische Standards · Unterrubrik: Bild-Dateiformate · Niveau: Fortgeschritten Synonyme / Auch bekannt als: .webp, WebP Image Format, Google WebP
Was ist WebP?
WebP wurde von Google im Jahr 2010 veröffentlicht, basierend auf dem VP8-Video-Codec, der für den VP8-Videostandard entwickelt worden war. Das Ziel: ein einziges Format zu schaffen, das JPEG (für Fotos), PNG (für Grafiken mit Transparenz) und GIF (für Animationen) ersetzen kann – und dabei in jedem Fall kleiner ist. Bis 2022 war die Browser-Unterstützung lückenhaft (insbesondere Safari verweigerte die Unterstützung lange), seit Safari 14 und der breiten Einführung in iOS 14 ist WebP jedoch in allen relevanten Browsern nativ unterstützt.
WebP nutzt für verlustbehaftete Kompression eine Vorhersage-basierte Kodierung (ähnlich wie Video-Codecs): Anstatt jedes Pixel einzeln zu speichern, werden Differenzen zwischen benachbarten Blöcken kodiert. Für verlustfreie Kompression werden LZ77-Kompression und Huffman-Kodierung kombiniert. Animiertes WebP basiert auf dem VP8- bzw. VP8L-Codec und erreicht bei Animationen deutlich kleinere Dateigrößen als GIF.
Technische Eigenschaften
| Eigenschaft | Wert |
|---|---|
| Kompressionstyp | Verlustbehaftet (VP8) und Verlustfrei (VP8L) |
| Farbtiefe | 8 Bit pro Kanal (24-Bit RGB / 32-Bit RGBA) |
| Farbraum | YCbCr 4:2:0 (Lossy), RGB (Lossless) |
| Transparenz | Vollständig (8-Bit Alpha-Kanal) |
| Animation | Ja (animiertes WebP, VP8X-Format) |
| Maximale Auflösung | 16.383 × 16.383 Pixel |
| HDR | Nein (8-Bit-Beschränkung) |
| ICC-Farbprofile | Ja |
| EXIF-Metadaten | Ja |
| Browser-Support | Chrome, Firefox, Safari (14+), Edge – seit 2022 universal |
Dateigröße-Vergleich (typisches Produktfoto, 1200×800 px):
- JPEG Q85: ca. 180 KB
- WebP Lossy (äquivalente Qualität): ca. 120–135 KB (-25 bis -35%)
- PNG (verlustfrei): ca. 1,2 MB
- WebP Lossless: ca. 700–850 KB (-30% gegenüber PNG)
Animiertes WebP vs. GIF (3 Sekunden, 480×270 px):
- GIF: ca. 3 MB
- Animiertes WebP: ca. 700 KB (–77%)
Qualitätsstufen (Lossy-Modus):
- Qualität 80–90: Visuell verlustfrei für Fotos, empfohlen für Web
- Qualität 70–80: Guter Kompromiss für E-Commerce-Bilder
- Qualität 50–70: Kleine Dateien für Thumbnails und Vorschaubilder
Lossless-Methode (0–6):
- Methode 4 (Standard): Gutes Verhältnis aus Kompression und Geschwindigkeit
- Methode 6: Maximale Kompression, aber deutlich langsamer beim Kodieren
Einsatzgebiete
- E-Commerce-Produktbilder: Der bedeutendste Anwendungsfall für WebP. Online-Shops mit hunderten oder tausenden Produktbildern profitieren enorm von 25–35 % kleineren Dateien – schnellere Ladezeiten bedeuten bessere Conversion-Rates und bessere Google-Rankings (Core Web Vitals).
- Webbanner und Hero-Bilder: Große Headerbilder auf Websites sind oft die größten Dateien einer Seite. WebP reduziert deren Größe erheblich und verbessert so die LCP-Metrik (Largest Contentful Paint).
- Animierte Inhalte statt GIF: Für Lade-Animationen, Reaktions-GIFs im Web und einfache Banner-Animationen ist animiertes WebP die technisch überlegene Alternative zu GIF bei gleicher Browser-Kompatibilität.
- Progressive Web Apps (PWA): WebP ist das empfohlene Format für alle Bildassets in PWAs, da die Reduzierung der Gesamtgröße besonders bei mobilen Verbindungen spürbar ist.
- CMS und WordPress-Integration: WordPress unterstützt WebP seit Version 5.8 (2021) nativ. Plugins wie Imagify, ShortPixel und WebP Express konvertieren vorhandene Bilder automatisch.
In der Praxis
Adobe Photoshop (ab Version 23.2, 2022):
- Datei > Exportieren > Als Kopie exportieren: Format WebP auswählen
- Verlustbehaftet: Qualität 80–85 für Standard-Webbilder
- Verlustfrei: Für Grafiken mit Transparenz (ersetzt PNG in Web-Workflows)
- Hinweis: Ältere Photoshop-Versionen benötigen das WebPShop-Plugin von Google
Adobe Lightroom (ab 2022):
- Datei > Exportieren: Format WebP, Qualität 80–90
- Farbraum: sRGB für Web (Pflicht)
Figma:
- Exportieren > Format WebP: Qualität 85 % als Standard
- Für Retina-Displays: 2× exportieren
cwebp (Google Kommandozeiletool):
- Verlustbehaftet:
cwebp -q 85 input.jpg -o output.webp - Verlustfrei:
cwebp -lossless input.png -o output.webp - Batch-Konvertierung:
for f in *.jpg; do cwebp -q 85 "$f" -o "${f%.jpg}.webp"; done
Squoosh (Google Browser-Tool):
- https://squoosh.app – Visuelle Vorschau mit Qualitätsvergleich vor dem Export
Vergleich & Abgrenzung
| Kriterium | WebP | JPEG | PNG | AVIF |
|---|---|---|---|---|
| Kompressionseffizienz | Gut | Mittel | Gering | Sehr gut |
| Transparenz | Ja | Nein | Ja | Ja |
| Animation | Ja | Nein | Nein | Ja |
| HDR-Support | Nein | Nein | 16-Bit | Ja |
| Browser-Support | Universal (2022) | Universal | Universal | Modern (2023+) |
| Enkodierungsgeschwindigkeit | Mittel | Schnell | Schnell | Langsam |
WebP vs. AVIF: AVIF bietet nochmals 20–30 % bessere Kompression als WebP, hat aber langsamere Kodierungszeiten und erst seit 2023 universelle Browser-Unterstützung. Für 2025+ ist AVIF die Empfehlung für neue Projekte; WebP bleibt der sichere Standard für breite Kompatibilität. Weitere Details im Eintrag WebP vs. AVIF.
Häufige Fragen (FAQ)
Sollte ich sofort auf WebP umsteigen? Für neue Web-Projekte: Ja, unbedingt. Seit 2022 unterstützen alle relevanten Browser WebP nativ, und die Dateigröße-Einsparungen verbessern Ladezeiten und Core Web Vitals direkt. Für E-Mail-Versand ist WebP hingegen noch ungeeignet, da viele E-Mail-Clients (Outlook, Apple Mail) WebP nicht anzeigen können.
Kann man WebP in Druckworkflows einsetzen? Nein. WebP ist ausschließlich ein Web-Format und unterstützt keinen CMYK-Farbraum sowie maximal 8 Bit Farbtiefe. Für Druckausgaben bleiben TIFF, EPS oder PDF/X die richtigen Formate. WebP-Dateien können nicht direkt in professionelle Druckworkflows integriert werden.
Wie konvertiere ich meine bestehenden JPEG/PNG-Bilder zu WebP? Die einfachste Methode für einzelne Dateien ist das Browser-Tool Squoosh (squoosh.app). Für Batch-Konvertierungen empfiehlt sich das Kommandozeilentool cwebp von Google oder Plugins für CMS wie WordPress. Viele Webserver (Apache, nginx) können mit Modulen konfiguriert werden, WebP automatisch an unterstützende Browser auszuliefern, während JPEG/PNG als Fallback bleibt.
Verwandte Einträge
Weiterführend
- Google Developers (2023): An image format for the Web –
- Chromium Blog (2010): WebP: A new image format for the Web –
- Online: Can I Use – WebP Browser-Kompatibilität –
- Online: Squoosh – Visuelles Bildformat-Vergleichstool –
