Lange Zeit galten die klassischen Bildformate PNG, JPEG und GIF als nicht optimal, aber für das Web akzeptabel. Sie sind im Web weit verbreitet, obwohl sie zu einer Zeit entwickelt wurden, als es noch kein Internet gab, das farbenfroh und voller Bilder ist.
Klassische Bildformate – als das Internet noch Neuland war...
Klassische Bildformate wurden entwickelt, um Bilder so detailgetreu wie möglich zu machen. Dabei spielt es keine Rolle, wie groß die Bilddatei wird, schließlich werden die Bilder sowieso über feste oder mobile Datenträger wie Festplatten oder Disketten ausgetauscht.
Und genau hier haben sie eine große Schwäche: die Dateigröße.
Eine hochauflösende PNG- oder JPEG-Datei, die 20 MB Speicherplatz benötigt? Absolut normal und problemlos, zumindest solange die Datei nicht über gedrosselte Internetleitungen oder überlastete Webserver an die Klienten ausgeliefert wird.
Problematisch werden große Bilddateien besonders bei mobilen Geräten, die das mobile Internet nutzen, wobei die Internetverbindung oft nicht nur deutlich langsamer als zu Hause ist, sondern auch nur über eine begrenzte Bandbreite verfügt.
Eine große Bilddatei ist einfach nicht akzeptabel, weder für das Internet zu Hause noch für das mobile Internet.
Die Lösung? Bilder komprimieren und verkleinern.
Ein Bild kann verkleinert werden durch:
- Verringerung der Auflösung
- Komprimierung
Das Ziel ist, die Bildgröße zu reduzieren.
Bei JPEG wird entweder die Auflösung verringert oder eine Komprimierung verwendet, die zu einer Verschlechterung der Bildqualität führt, um die Bildgröße zu reduzieren.
Bei PNG kann entweder die Auflösung reduziert oder eine Komprimierung verwendet werden. Bei der PNG-Komprimierung wird die Bildqualität nicht verschlechtert, es handelt sich um eine verlustfreie Komprimierung.
Die Reduzierung der Bildgröße hat den Bildern auf jeden Fall geholfen, sich im Internet zu etablieren, denn ohne diese Reduzierung wären die Bilder einfach so groß, dass das Laden, besonders bei hochauflösenden Bildern, einfach viel zu lange dauern würde.
WebP, gemacht für das Internet
Das WebP-Format wurde von Google entwickelt. Es wurde erstmals 2010 eingeführt und zielt darauf ab, die Dateigröße von Bildern im Web zu reduzieren, um schnellere Ladezeiten und ein besseres Benutzererlebnis zu ermöglichen.
WebP unterstützt sowohl verlustbehaftete als auch verlustfreie Komprimierung sowie Transparenz und Animationen, was es zu einer vielseitigen Wahl für Webgrafiken macht.
Die Vorteile sprechen eindeutig für den Einsatz von WebP im Web, um damit die klassischen Bildformate bei Webseiten zu ersetzen:
- Bessere Komprimierung – WebP bietet eine effizientere Komprimierung als herkömmliche Formate wie JPEG und PNG, was zu kleineren Dateigrößen führt, ohne die Bildqualität wesentlich zu beeinträchtigen.
- Transparenz – WebP unterstützt transparente Hintergründe (Alphakanäle) wie PNG, jedoch mit besserer Kompression, was die Dateigröße reduziert.
- Animationen – WebP ermöglicht die Erstellung animierter Bilder, ähnlich wie GIFs, jedoch mit besserer Bildqualität und kleineren Dateigrößen.
- Hohe Bildqualität – WebP bietet sowohl verlustbehaftete als auch verlustfreie Kompression, was bedeutet, dass eine hohe Bildqualität bei kleineren Dateigrößen beibehalten werden kann.
- Breite Unterstützung – viele moderne Webbrowser unterstützen WebP, was es zu einer praktischen Wahl für die Verwendung im Web macht.
- Schnellere Ladezeiten – durch die kleineren Dateigrößen können Webseiten schneller geladen werden, was die Benutzererfahrung verbessert und die Ladezeiten verkürzt.
Diese Vorteile machen WebP zu einer attraktiven Option für Webentwickler und -designer, die die Leistung ihrer Webseiten optimieren möchten.
WebP, klein und schön
WebP verwendet fortschrittliche Komprimierungstechniken, darunter die prädiktive Kodierung, die die Bilddaten analysiert und die Pixelwerte auf der Grundlage der benachbarten Pixel vorhersagt. Dies ermöglicht eine effizientere Datenspeicherung im Vergleich zu herkömmlichen Formaten wie JPEG und PNG.
Außerdem, WebP-Bilder sind in der Regel kleiner als ihre JPEG- und PNG-Gegenstücke und reduzieren die Dateigröße oft um 25-34 % ohne nennenswerte Qualitätsverluste.
Diese Größenreduzierung ist entscheidend für schnellere Ladezeiten auf Websites, was die Benutzerfreundlichkeit und das SEO-Ranking verbessern kann.
Wie schlägt sich WebP in der Praxis?
Wir haben das Folgende Bild, das eine Auflösung von 3840x2160 Pixel hat. Es wurde mit AI erstellt, es wurde nicht komprimiert, auch die Bildqualität ist unverändert – somit enthält es alle Details, die AI hineingepackt hat.
Folgendermaßen sehen die Bildgrößen aus:
- PNG – 33MB
- JPEG – 3.6MB
- WebP – 876KB
Ohne jegliche Komprimierung und Qualitätsreduzierung ist WebP 4-mal kleiner als JPEG und 37-mal kleiner als PNG. Das ist ein Ergebnis, das sich sehen lassen kann!
Als nächstes verkleinern wir die Bilddateien.
Für JPEG und WebP verwenden wir eine Komprimierung von 80, in beiden Fällen wird die Bildqualität leicht reduziert, die Bildauflösung bleibt jedoch unverändert bei 3840x2160 Pixel.
Bei PNG verwenden wir die höchstmögliche Komprimierungsstufe, also 9. Zu beachten ist, dass bei PNG im Gegensatz zu den anderen Bildformaten kein Bildverlust auftritt, da es eine verlustfreie Komprimierung verwendet.
Die Dateigrößen sehen nun wie folgt aus
- PNG – 5.5MB
- JPEG – 629KB
- WebP – 203KB
Auch nach der Verkleinerung der Bilder punktet WebP sowohl bei der Dateigröße als auch bei der Bildqualität. Aber auch JPEG liefert kein schlechtes Ergebnis und kann durchaus nach WebP gut auf Webseiten eingesetzt werden.
Wenn es um möglichst kleine Bilddateien geht, haben JPEG und WebP die Nase vorn. Wenn es aber darum geht, ein Bild möglichst detailgetreu darzustellen, spielt PNG seine Stärken aus.
Fazit
Abschließend kann nur vermutet werden, dass sich WebP langfristig als Standard auf Webseiten durchsetzen wird, da immer mehr Webseiten WebP verwenden und alle Browser WebP unterstützen.
Die Vorteile sind sowohl für Websitebetreiber und Webdesigner als auch für einfache Internetnutzer zu attraktiv, um dieses Bildformat nicht zu akzeptieren. Es bleibt abzuwarten, wie lange es dauern wird, bis WebP die Webseiten erobert.
Aktuelle Statistiken zu WebP zeigen, dass WebP derzeit einen Marktanteil von über 15 % aller Bildformate hat. Dabei ist zu beachten, dass fast alle Browser das Format unterstützen. Es spricht also nichts dagegen, seine Bilder als WebP den Besuchern seiner Website anzubieten.