WebP - optimierte Bildformat für`s Web der Zukunft

Bisher wurden auf Webseiten Bilder in den Formaten jpeg, png, svg, oder gif verwendet. Nun gibt es ein von Google definiertes Bildformat mit der Dateiendung *.webp, welches die Dateigrösse ohne Verlust nahezu halbieren kann.

Verfasst am 13.03.2023

In einer Welt, in der Geschwindigkeit und Leistung der Websites immer wichtiger werden, hat Google das Bildformat WebP vorgestellt, das speziell für das Web entwickelt wurde. WebP ist ein Bildformat, das entwickelt wurde, um die Ladezeiten von Webseiten zu verbessern, ohne dabei die Qualität der Bilder zu beeinträchtigen. In diesem Blogbeitrag werden wir uns genauer mit WebP beschäftigen und herausfinden, warum es eine wichtige Rolle in der Zukunft des Webdesigns spielen wird.

Was ist WebP?

WebP ist ein Bildformat, das bereits 2010 von Google entwickelt wurde. Es wurde speziell für das Web optimiert und soll die Ladezeiten von Websites verkürzen, indem es eine bessere Komprimierung von Bildern ermöglicht. Im Vergleich zu anderen gängigen Bildformaten wie JPEG und PNG kann WebP Bilder mit einer höheren Komprimierungsrate speichern, ohne dass dabei die Bildqualität beeinträchtigt wird. Die Einsparung an Gewicht ist beeindruckend und bewegt sich zwischen 25-80%.

Wie funktioniert WebP?

WebP verwendet eine verlustbehaftete Komprimierung, um die Dateigröße von Bildern zu reduzieren. Dabei werden Informationen, die für das menschliche Auge weniger relevant sind, entfernt. Durch diese Methode kann WebP Bilder mit einer viel kleineren Dateigröße speichern, ohne dass dabei die Bildqualität beeinträchtigt wird. WebP bietet aber auch eine verlustfreie Komprimierungsoption für Bilder, die keine Qualitätsverluste aufweisen soll.

Welche Vorteile hat WebP?

Die Vorteile von WebP liegen auf der Hand.

  1. Kleinere Dateigrößen: WebP-Bilder sind in der Regel viel kleiner als JPEG- und PNG-Bilder. Das bedeutet, dass sie schneller geladen werden und somit die Ladezeit der Website verkürzen.
  2. Bessere Bildqualität: Obwohl WebP-Bilder eine kleinere Dateigröße haben, bleibt die Bildqualität erhalten. Im Vergleich zu JPEG und PNG werden WebP-Bilder in der Regel schärfer und klarer dargestellt.
  3. Breite Unterstützung: Obwohl WebP noch nicht so weit verbreitet ist wie andere Bildformate, wird es mittlerweilen von den meisten gängigen Browsern und Anwendungen unterstützt, darunter Google Chrome, Firefox, Opera und Edge.
  4. Kostenlose Nutzung: WebP ist ein Open-Source-Format, das von Google kostenlos zur Verfügung gestellt wird. Es gibt keine Lizenzgebühren oder ähnliches, die beim Einsatz von WebP anfallen.

Wie konvertiert man seine Bilder in WebP?

Viele Programme unterstützen WebP, daher kannst du sie direkt in Deiner Bildbearbeitunssoftware erstellen, zum Beispiel mit Adobe Photoshop. Leider bietet allerdings die Prototyping-Software des gleichen Herstellers, Adobe XD, noch keine möglichkeit Bilder direkt als WebP zu exportieren. Das bedeutet, das vermutlich viele auf eine zusätzliche Software, einen Bildkonverter, angewisesn sind.

Solche Bildkonverter gibt es mehrere und die erledigen Ihre Aufgabe erfolgreich, wie z.B. die Software XnConvert.

Wenn man lediglich eines oder nur ein paar ausgewählte Bilder konvertieren möchte kann man das auch mittels einem Onlinegenerator erledigen. Da wäre zum Beispiel der Ezgif WebP Maker eine Möglichkeit.

WebP in WordPress

Wenn Sie eine laufende Website haben und da bereits sehr viele Bilder hochgeladen haben, bietet Ihen ein Plugin Hilfe, alle bestehenden Bilder zu WebP zu konvertieren.

Das Plugin «EWWW Image Optimizer«, welches als kostenpflichtige aber auch als kostenlose Version verfügbar ist, bietet eine einfache Möglichkeit, WebP-Bilder in WordPress zu nutzen.

Hier sind die Schritte, die Sie befolgen können, um WebP mit diesem Plugin zu nutzen:

  1. Installieren und aktivieren Sie das Plugin EWWW Image Optimizer in WordPress.
  2. Gehen Sie in WordPress auf Einstellungen und dort zu zu EWWW Image Optimizer.
  3. Scrollen Sie nach unten zum Bereich «WebP Conversion» und aktivieren Sie das Kontrollkästchen.
  4. Stellen Sie sicher das Sie die WebP Rewrite Rules zu Ihrer htaccess hinzufügen.

 

EWWW Image Optimizer bietet noch eine Vielzahl von weiteren Einstellungsmöglichkeiten wie das Optimieren von anderen Bilddateien. Diese Einstellungen lasse ich in diesem Artikel mal weg. Sie finden da detaillierte Anleitungen im Netz über eine Suche wie «EWWW Image Optimizer Einstellungen»

Sie sind nun bereit, alle Ihre Bilder in WebP zu konvertieren. Gehen Sie dazu in den Bereich Medien und da zu «Bulk Optimize» und scannen Sie Ihre Bilder. Danch können Sie aus allen Bildern ein WebP erstellen, was je nach ANzahl Bildern etwas zeit in Anspruch nehmen kann.

Fazit

WebP ist ein vielversprechendes Bildformat, das speziell für das Web entwickelt wurde. Es bietet eine bessere Komprimierung als andere Bildformate und ist in der Lage, Bilder schneller zu laden, ohne dabei die Bildqualität zu beeinträchtigen. Obwohl WebP noch nicht so weit verbreitet ist wie andere Bildformate, wird es von vielen Browsern und Anwendungen unterstützt und hat das Potenzial, in Zukunft eine wichtige Rolle im Webdesign zu spielen.

Vielen Dank für Ihr Feedback

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Bisher noch keine Kommentare