WebP

Schnellübersicht

• WebP unterstützt Transparenz und Animationen, was es zu einer guten Wahl für Online-Bilder macht.
• Obwohl WebP bisher nicht von allen Browsern unterstützt wird, kann es durch die Verwendung von Tools wie “WebP Converter” oder “WebP Express” problemlos in andere Formate konvertiert werden, um eine Kompatibilität mit älteren Browsern sicherzustellen.
• Die Verwendung von WebP kann dazu beitragen, die Benutzerfreundlichkeit und das Ranking Ihrer Website zu verbessern, da schnelle Ladezeiten ein wichtiger Faktor für beides sind.
• WebP bietet eine hohe Bildqualität bei geringer Dateigröße und kann somit auch dazu beitragen, den Speicherplatz auf Ihrem Server zu optimieren und Ihre monatlichen Hostingkosten zu reduzieren.

Was ist WebP?

WebP ist ein neues Bildformat, das von Google entwickelt wurde und eine bessere Kompression als andere Bildformate (wie JPEG und PNG) bietet, was zu kleineren Dateigrößen und schnelleren Ladezeiten führt.

Eine Einführung in WebP

Die Dateiformate, die Sie auf Ihrer Website verwenden, haben einen großen Einfluss auf deren Geschwindigkeit, Qualität und Leistung. Um herauszufinden, welche Bildtypen verwendet werden sollen, kann jedoch ein wenig Recherche erforderlich sein.

Beispielsweise ist WebP ein relativ neues Bilddateiformat der nächsten Generation, das von Google entwickelt wurde. Wenn Sie verstehen, was es ist und wie Sie es auf Ihrer Website verwenden, können Sie Ihre Benutzererfahrung (UX) verbessern und die Ladezeiten insgesamt verkürzen.

Die Bildoptimierung ist ein wesentlicher Aspekt der Geschwindigkeit und Leistung von Websites. Eine der besten und effektivsten Möglichkeiten, Bilder zu optimieren, besteht darin, ihre Dateigröße durch Komprimierung zu reduzieren. Je leichter Ihre Dateien sind, desto einfacher wird es für den Server, Ihre Website zu laden, was letztendlich zu höheren Geschwindigkeiten führt.

Es gibt zwei Haupttypen der Bildkomprimierung: verlustbehaftet und verlustfrei. Bei einer verlustbehafteten Komprimierung wird die Größe der Datei reduziert, indem einige der Bilddaten entfernt werden, wodurch die Qualität des Prozesses verringert wird. Bei der verlustfreien Komprimierung werden die Daten einfach rekonstruiert, wobei mehr Qualität erhalten bleibt.

WebP ist ein modernes Bilddateiformat, das 2010 von Google entwickelt wurde und sowohl verlustbehaftete als auch verlustfreie Komprimierung verwendet. Der Zweck besteht darin, kleinere und schnellere Bilder für Websites bereitzustellen, was zu einer besseren Leistung führt. Tatsächlich sind laut Google verlustfreie WebP-Bilder 26 Prozent kleiner als PNG und verlustbehaftete Bilder sind bis zu 34 Prozent kleiner als JPEG.

Warum ist WebP wichtig?

Wie bereits erwähnt, spielen Bilder eine wichtige Rolle für die Leistung Ihrer Website. Die Größe der Dateien wirkt sich auf die Geschwindigkeit und damit auf die UX aus. Daher ist es wichtig sicherzustellen, dass Sie die besten Bilddateiformate auswählen. In Kombination mit Lazy-Load lassen sich mit wenigen Schritten gute Ergebnisse erreichen.

WebP ist ein Rasterbildformat, das speziell für Online-Bilder entwickelt wurde. Kurz gesagt, es ist wichtig, darüber Bescheid zu wissen, da es Ihnen ermöglicht, qualitativ hochwertige Bilder mit kleineren Dateigrößen anzuzeigen, als Sie es sonst mit anderen Formaten erreichen könnten.

Dank der prädiktiven Kodierungsmethode können WebP Bilder basierend auf ihren Pixelwerten codieren. Im Wesentlichen enthält es nur das Notwendige, ohne das Erscheinungsbild des Fotos zu verfälschen. Dadurch sind die Dateigrößen klein, die Bildqualität bleibt jedoch relativ hoch.

Die Möglichkeit, mehr Bilder zu verwenden, ohne sich Gedanken über langsame Ladezeiten machen zu müssen, kann dazu beitragen, das allgemeine Erscheinungsbild Ihrer WordPress-Site zu verbessern. Die Freiheit, die gewünschte Größe und Qualität der Bilder zu verwenden, gibt Ihnen auch mehr Flexibilität beim Design Ihrer Website.

Das WebP-Format: Die Vor- und Nachteile

Vorteile von WebP

• Beschleunigte Ladegeschwindigkeiten – Durch die Verwendung von kleineren Dateigrößen in WebP-Format laden Seiten mit Bildern schneller. Dies verbessert die Benutzererfahrung erheblich: Laut Website Builder Expert verringert jede Sekunde Ladeverzögerung die Zufriedenheit des Besuchers um 16 %, und ein Viertel aller Besucher verlässt eine Seite, wenn sie nicht innerhalb von 4 Sekunden geladen wurde.
• Auswirkung auf das Suchmaschinen-Ranking – In erster Linie spielt die Ladegeschwindigkeit für den Nutzer und somit für den Umsatz eine erhebliche Rolle. Doch auch die gängigen Suchmaschinen machen sich die Ladegeschwindigkeit als Ranking-Faktor zunutze. Das heißt, wer eine schnelle Website anbietet, eine gute Nutzererfahrung, der wird auch im Ranking Pluspunkte sammeln.
• Reduzierter Medien-Speicherbedarf – Die optimierte Kompression von WebP erfordert auch weniger Speicher. Dies ist von Bedeutung für Seiten, die zahlreiche Bilder enthalten. Du hast die Möglichkeit, bei deinem Webhosting viel Geld zu sparen.
• Transparenz und Bewegung – Wie bereits erwähnt, unterstützt das WebP-Format als einziges Format die Transparenz von PNG sowie die Animationen von GIF. Ebenso ist die Kompression verbessert im Vergleich zu JPEG.
• WebP macht deine Website nachhaltiger – Jeder Seitenaufruf verursacht Energiekosten. Je schneller und kleiner Bilder geladen werden, desto besser ist das für die Umwelt.

Nachteile von WebP

• Noch nicht von allen Browsern unterstützt – Obwohl WebP von den meisten Browsern unterstützt wird, gibt es immer noch einige, die es nicht unterstützen. Es gibt eine Lösung, bei der ein Backup-Bild in HTML erstellt wird, aber das Erstellen einer völlig anderen Datei als Backup kann manchmal den zusätzlichen Speicher verbrauchen, den du durch die Verwendung von WebP eingespart hast.
• Qualitätseinbußen bleiben – Dass die Qualität deines Bildes trotzdem abnimmt, ist kein direkter Nachteil von WebP, sondern eher ein Nachteil aller verlustbehafteten Kompressionen. Für die meisten Menschen kann dies ignoriert werden, aber auf visuellen Seiten wie Portfolios von Fotografen oder Grafikdesignern sollte die optische Qualität so hoch wie möglich sein.
• Nicht jede Software unterstützt WebP – Für ältere Windows-Versionen oder Bildbearbeitungsprogramme muss eine WebP-Datei anfangs in in ein unterstütztes Bildformat zurückgewandelt werden, bevor es geöffnet oder bearbeitet werden kann.

Welche Browser unterstützen WebP?

Im November 2021 hatten Webbrowser, die WebP unterstützen, einen Marktanteil von 96 %.

Google fördert aktiv WebP, und Google Chrome und alle Chromium-basierten Browser unterstützen das Format. Das proprietäre PageSpeed ​​Insights-Tool schlägt Webmaster vor, von JPEG und PNG auf WebP umzusteigen, um den Geschwindigkeitswert ihrer Website zu verbessern.

Microsoft Edge-Versionen, die nach Januar 2020 veröffentlicht wurden, basieren auf dem Chromium-Browser und bieten native WebP-Unterstützung. HTML-basierte Versionen von Microsoft Edge unterstützen WebP über eine Plattformerweiterung (standardmäßig installiert) (sofern sie nicht im sicherheitsgehärteten „Application Guard“-Modus ausgeführt werden, der keine Plattformerweiterungen unterstützt).

Safari fügte Unterstützung für WebP mit iOS 14 und macOS Big Sur hinzu.

Mozilla Firefox unterstützen WebP offiziell seit Januar 2019. Es wurde ursprünglich für die Umsetzung im Jahr 2013 in Betracht gezogen.

GNOME Web, Midori und Falkon unterstützen nativ WebP.

WebP kann auch in allen gängigen Browsern mit der WebPJS-JavaScript-Bibliothek angezeigt werden, obwohl die Unterstützung in Internet Explorer 6 und höher mit Flash erreicht wird.

Wie ist der Unterschied zwischen JPG und WebP?

Da unsere Website alle Bilder automatisch in WebP zur Verfügung stellt, muss das JPG Bild über den Link geöffnet werden.

Wie konvertiere ich meine Bilder in das WebP-Format?

• Ab Version 23.2 bietet Adobe Photoshop volle Unterstützung für das Dateiformat WebP! WebP-Dateien können nun in Photoshop geöffnet, erstellt, bearbeitet und gespeichert werden, ohne dass ein Plug-in oder eine Voreinstellung erforderlich sind.
• Für ältere Versionen von Photoshop stellt Google eine kostenlose Anwendung zur Verfügung.
• Mit diversen kostenlosen Online-Konvertern wie convertio.co oder cloudconvert.com lassen sich ebenfalls WebP-Bilder in das gewünschte Format konvertieren.
• Auch gibt es unzählige Windows, MAC und Linux-Anwendungen, die mittlerweile eine Konvertierung anbieten.

Gibt es weitere Alternativen zu JPG, PNG und WebP?

In der Tat bietet das AVIF Bildformat ein noch höheres Einsparpotential an. Jedoch ist die Verbreitung des Bildformats noch nicht annähernd so hoch, wie die von WebP. Hier beträgt der Marktanteil ca. 69 % (WebP ca. 96 %).

Google entwickelt seit Juni 2021 die zweite Version von WebP. Seine Referenzimplementierung ist libwebp2. Das Hauptziel dieses neuen Formats ist es, ähnliche Komprimierungsraten wie AVIF zu erreichen und gleichzeitig schneller zu codieren und zu decodieren.

Sollte ich bei JPG, PNG bleiben, zu WebP wechseln oder auf AVIF warten?

Entscheidend für die Antwort ist die Verbreitung der Unterstützung. Den höchsten Support durch Browser und Software erhalten aufgrund des Alters JPG und PNG. Bei den Browsern, wo WebP aufgrund der Geschwindigkeit eine sehr große Rolle spielt, ist der Marktanteil der unterstützten Browser schon bei 96 %. Bei AVIF liegt er bei ca. 69 %.

Und genau diese Abstufung lässt sich technisch auch abdecken. Plug-ins für WordPress und Co ermöglichen, alle Formate auszuspielen: Die ideale Reihenfolge ist also:

1. AVIF, dann
2. WebP, dann
3. JPG & PNG

Je nach Endgerät wird die beste Option gewählt. Der Nutzer merkt davon natürlich nichts. Im Idealfall freut er sich über eine schnelle Website und ist eher dazu geneigt Kontakt aufzunehmen oder einen Kauf abzuschließen.

Fazit: WebP muss ernst genommen werden

Neue Technik braucht seine Zeit, bis sie ihre Verbreitung findet. Adobe Photoshop unterstützt WebP erst seit Februar 2022 und auch die Browser-Auskunft zeigt, dass erst Updates benötigt werden.

Es ist sinnvoll, auf eine Strategie zu setzen, die alle aktuellen und noch kommenden Formate setzt und berücksichtigt. Bildgrößen haben einen sehr großen Einfluss auf das Ranking in Suchmaschinen und zu oft herrscht bei den Anwendern eine Unwissenheit darüber, welchen Einfluss das hat.

Interessante Beiträge

• Was bedeutet der WebP Support ab WordPress 5.8?
• Warum ist es wichtig, eine schnelle Website zu haben?