WebP (Bildformat).
WebP ist ein modernes Bildformat von Google, das JPEG- und PNG-Bilder um 25–50% in der Dateigrösse reduziert — bei gleicher oder besserer Qualität. WebP wird von allen modernen Browsern unterstützt und ist der Standard für optimierte Web-Bilder. Entscheidend für Core Web Vitals.
WebP (Bildformat) — ausführlich erklärt
WebP ist ein modernes Bildformat, das von Google 2010 entwickelt wurde. Im Vergleich zu JPEG und PNG erreicht WebP bei gleicher visueller Qualität eine 25–35% kleinere Dateigrösse für Fotos (vs. JPEG) und bis zu 50% kleinere Dateigrösse für Grafiken mit Transparenz (vs. PNG). WebP unterstützt sowohl verlustbehaftete als auch verlustfreie Komprimierung, Animation (Alternative zu GIF) und Transparenz (Alpha-Kanal). Alle modernen Browser (Chrome, Firefox, Safari, Edge) unterstützen WebP.
Warum ist WebP für Websites so wichtig? Bilder sind der grösste Faktor für die Dateigrösse einer Webseite — typischerweise 60–80% des gesamten Seitengewichts. Kleinere Bilder bedeuten schnellere Ladezeiten, bessere Core Web Vitals (besonders LCP) und niedrigere Bandbreitenkosten. Google PageSpeed Insights empfiehlt WebP explizit als Optimierungsmassnahme. AVIF ist ein noch neueres Format (noch bessere Komprimierung), wird aber noch nicht so breit unterstützt.
Wie implementiert man WebP? Next.js (next/image Komponente) konvertiert und optimiert Bilder automatisch in WebP (und AVIF). Für andere Setups: Konvertierung mit Sharp, Squoosh, oder Adobe Photoshop/Figma Export. Im HTML empfiehlt sich das `<picture>`-Element mit WebP als Hauptformat und JPEG/PNG als Fallback für ältere Browser. DLM Digital verwendet standardmässig WebP (und AVIF wo sinnvoll) für alle Projekte — als Teil der Core Web Vitals Optimierung.
Weiterführende Seite
Core Web VitalsHäufige Fragen zu WebP (Bildformat)
Ja, für neue Projekte sollte WebP das Standard-Bildformat sein. Alle modernen Browser unterstützen WebP. Für ältere Browser-Kompatibilität (IE11) können Sie das `
AVIF ist ein noch neueres Format (2021) mit noch besserer Komprimierung als WebP — 20–30% kleiner bei gleicher Qualität. AVIF wird von Chrome, Firefox und Safari unterstützt, aber nicht von IE11 (ohnehin vernachlässigbar) und einigen älteren Mobilgeräten. Next.js unterstützt AVIF automatisch. Für maximale Kompatibilität: AVIF zuerst, WebP als Fallback, JPEG/PNG als letzter Fallback.
Einfachste Methoden: 1) Squoosh.app — kostenlos, browserbasiert, kein Download nötig. 2) Next.js next/image — konvertiert automatisch. 3) Sharp (Node.js Library) für automatische Batch-Konvertierung. 4) Cloudflare Image Optimization — konvertiert und optimiert automatisch. 5) Adobe Photoshop (ab Version 2021) und Figma exportieren direkt in WebP.
Weitere Begriffe mit „W“
Bereit für Ihr Projekt?
Wenden Sie dieses Wissen auf Ihre Website an — DLM Digital hilft Ihnen dabei.