Have any Questions? +01 123 444 555
DE

von Swisscrow GmbH
(Kommentare: 0)

Bilder SEO: WebP aus Photoshop exportieren – so geht’s.

W

ebP wurde erstmals im Jahr 2010 von On2 Technologies vorgestellt, das später von Google übernommen wurde, und ist mittlerweile zur einer mächtigen Alternative zu anderen gängigen Bildformaten wie JPEG und PNG und GIF geworden. Nicht ganz unschuldig daran sind natürlich die PageSpeed Insights von Google, welche (Google’s Eigenlösung) WebP in den Ergebnissen propagieren (s. Bild unten). Dennoch: Mit dem Dateiformat WebP machst du einiges richtig für SEO. Das Format kombiniert sowohl verlustfreie als auch verlustbehaftete Kompressionsmethoden und bietet damit eine gute Bildqualität bei reduzierter Dateigrösse.

PageSpeed Insights propagiert WebP - ContentFox

Vorteile von WebP

  1. Kleinere Dateigrössen: WebP kann Bilder mit signifikant kleineren Dateigrössen im Vergleich zu JPEG und PNG erstellen, was zu schnelleren Ladezeiten von Webseiten führt.
  2. Unterstützung für Transparenz: Anders als JPEG unterstützt WebP auch den Alphakanal für transparente Hintergründe, ähnlich wie PNG.
  3. Animation: WebP ermöglicht auch die Speicherung von Animationen, was es zu einer vielseitigen Option für Webgrafiken macht.

Verwendungszwecke von WebP

  • Webseitenoptimierung: Durch die Verwendung von WebP können Webentwickler die Ladezeiten ihrer Seiten erheblich verbessern, was besonders wichtig ist, um die Benutzererfahrung zu optimieren.
  • Responsive Bilder: WebP eignet sich besonders gut für responsive Webdesigns, da es hochwertige Bilder bei kleineren Dateigrössen bietet.
  • Animationen im Web: Die Fähigkeit, Animationen zu unterstützen, macht WebP zu einer idealen Wahl für interaktive und dynamische Webinhalte.

Was bringt WebP für die Suchmaschinenoptimierung (SEO)?

Die in die Jahre gekommenen Formate JPEG und PNG hatten ihr Vorteile. JPG bot eine gute Bildqualität im Web bei passabler Bildgrösse (sofern richtig zugeschnitten und komprimiert) und PNG lieferte die Transparenz-Unterstützung. WebP vereint die praktischen Vorteile von JPG und PNG und kann sogar, ähnlich zu GIF, Animationen zeigen. Google gibt an, dass WebP-Bilder bis zu 25-34 % kleiner ausfallen als JPG- oder PNG-Dateien. Und hier müssten SEO-Experten die Lauscher grösser werden: Geringere Dateigrössen = schnellere Ladezeit = bessere PageSpeed-Bewertung von Google = bessere Positionierung = mehr Conversions = höhere Relevanz = …

Natürlich könnte ein von Google ins Leben gerufenes neues Dateiformat, das gegenüber allen anderen Formaten ein besseres Ergebnis auf Google erzielt, einen fahlen Geschmack hinterlassen. Nach mehreren Jahren im Einsatz können wir aber bestätigen, dass Webseiten, die mit WebP ausgestattet sind, einfach besser performen – nicht nur auf Google. Immerhin ist WebP ein Open-Source-Format und kann so frei von Dritten weiterentwickelt werden. Es könnte also die Zukunft sein.

Nachteile von WebP

Adobe schreibt, dass WebP nur für den Onlineeinsatz konzipiert sei und ältere Browser, wie der Internet Explorer, WebP nicht unterstützen. Dazu können wir nur sagen: #wayneinteressierts. WebP wurde für ein performanteres Web entwickelt und ist damit nur für den Onlineeinsatz bzw. die Suchmaschinenoptimierung gedacht. Und zum Internet Explorer möchten wir uns gar nicht mehr äussern.

Wie erstelle oder exportiere ich ein Bild in WebP mit Photoshop?

Allerdings scheint WebP im Jahr 2024 bei vielen noch nicht so richtig angekommen zu sein. Das äussert sich dadurch, dass selbst Adobe Photoshop den webp-Export etwas zu verstecken scheint. Weder über die Exportfunktion, noch über «Für Web speichern (Legacy)» kann ein WebP generiert werden. Eine Erweiterung benötigst du ab Photoshop 23.2 aber glücklicherweise nicht mehr. Um ein WebP zu erstellen, gehe über Datei > Kopie speichern.

Schritt 1:

Schritt 1 zum WebP Export über Photoshop - ContentFox

Schritt 2 zum WebP-Export über Photoshop - ContentFox

Schritt 2:

Es öffnet sich im Anschluss das WebP Optionen-Dialogfeld. Du kannst nun wählen, ob du verlustfrei oder verlustreich speichern möchtest. Probiere hier aus, mit welcher Einstellung du noch eine gute Bildqualität erzielst und trotzdem die Dateigrösse reduzieren kannst. Eine «richtige» Einstellung gibt es hier nicht, hier kommt es auf deine Anforderungen die Website an, bei der du Qualität und Performance abwägen musst. Für einen ersten Test exportiere dein Bild mit 70-80 % und vergleiche den Export mit einem optimieren JPG- oder PNG-Export im gleichen Format - der Gewinn in der Dateigrösse sollte deutlich sein.

Schritt 3 zum WebP-Export über Photoshop - ContentFox

Du kannst keinen WebP-Eintrag in den möglichen Speicherformaten finden?

Stelle zuerst sicher, dass du mindestens Photoshop 23.2 im Einsatz hast. Ältere Versionen benötigen eine Erweiterung. Die Links hierzu findest du bei Adobe. In einigen nachfolgenden Photoshop-Versionen bis zu 25.x muss das Bild mit 8-Bit-Modus erstellt sein – nur dann kannst du den WebP-Eintrag unter «Kopie speichern» finden. Neuere Photoshop-Versionen lassen auch höhere Bitraten zu.

WebP-Export in Photoshop nicht möglich, Troubleshoot - ContentFox

Bilder-SEO: der ultimative Leifaden

Du möchtest mehr darüber erfahren, wie du mit der richtigen Bildformatierung dein SEO voran bringst? Alle Infos dazu findest du in unserem Beitrag «Bilder-SEO: Der ultimative Sichtbarkeits-Boost für Webseiten».

Zurück

Deine Meinung interessiert uns

Bitte rechnen Sie 6 plus 9.
Copyright 2024. All Rights Reserved.
Einstellungen gespeichert
Wir lieben Cookies. Und Sie?

Feini Guetzli helfen dabei, den Arbeitsalltag zu bewältigen - und Cookies sind auch für unsere Webseite nützlich. Sie sorgen dafür, die Nutzererfahrung zu verbessern, was Ihnen garantiert den Tag und Ihren Besuch bei contentfox.ch versüsst. Vielen Dank für Ihre Erlaubnis!

You are using an outdated browser. The website may not be displayed correctly. Close