print logo

Webperformance und visuelles Web sind kein Widerspruch

Bilder und Videos steigern das Engagement. Doch nicht optimiert, lädt die Website zu langsam und wird von Googles Core Web Vitals bestraft.
Juli Greenwood | 16.09.2021
Webperformance und visuelles Web sind kein Widerspruch © Cloudinary
 

Heute umfasst das riesige und ausufernde Reich des World Wide Web, mehr als 1,5 Milliarden Websites. Die meisten davon sind so lebendig wie Bouvet Island (aka „der einsamste Ort auf der Welt“), aber immerhin noch ganze 200 Millionen Websites sind aktiv. Angesichts dieser Dimension ist ein Leben ohne Suchmaschinen kaum unvorstellbar. 

Doch in den ersten Tagen des Internets gab es noch keine Suchmaschinen. Damals führte Tim Berners-Lee eine Liste von Websites auf dem Webserver des CERN, die er manuell aktualisierte. Es dauerte allerdings nur ein paar Jahre, bis die manuelle Indexierung des Webs nicht mehr praktikabel war. Die ersten Suchmaschinen tauchten auf (erinnert sich noch jemand an Lycos, Magellan oder Aliweb?), um diese Aufgabe zu automatisieren. Ab der Jahrtausendwende jedoch wurde Google immer beliebter und ließ andere Suchmaschinen hinter sich. Heute ist Google mit einem Marktanteil von mehr als 90 Prozent die weltweit meistgenutzte Suchmaschine.

Einhergehend dem Wachstum der Suchmaschinen, entwickelte sich auch die Suchmaschinenoptimierung (SEO), also die Optimierung von Websites, damit sie von den Suchmaschinen leichter gefunden werden. Viele Jahre lang war SEO eine mysteriöse, oft obskure technische Angelegenheit. Glücklicherweise sind diese frühen Tage – in denen es darum ging, den Google-Suchalgorithmus zu „überlisten“ – vorbei. Und auch Google hat seit einigen Jahren seine Vorgehensweise geändert. Mit der Einführung der Core Web Vitals hat das Unternehmen jüngst die Nutzererfahrung in den Mittelpunkt seines Rankings gestellt. 

Bei den Core Web Vitals handelt es sich um drei Metriken, die auf umfassenden Untersuchungen für ein optimales Web-Nutzererlebnis basieren. Seit Juni 2021 beeinflussen diese Metriken, die die Ladezeit, die Interaktivität und die visuelle Stabilität einer Website bewerten, Googles Suchranking.

Die drei Core Web Vitals erklärt

Die erste Metrik, Largest Contentful Paint (LCP), bezieht sich darauf, wie lange es dauert, bis das größte Above-the-fold-Element (alle Elemente einer Website, die ohne zu scrollen sichtbar sind) auf einer Website erscheint. In der Regel handelt es sich bei diesem um ein visuelles Element, oft ein „Hero-Image“. Google empfiehlt, den LCP unter 2,5 Sekunden zu halten. Laut HTTP Archive müssen 47 Prozent der Desktop-Websites und 57 Prozent der mobilen Apps ihren LCP verbessern. 

Die zweite Metrik wird First Input Delay (FID) genannt. Sie misst die Zeit, die eine Website benötigt, um auf eine Nutzerinteraktion zu reagieren, etwa das Klicken auf einen Link oder eine Schaltfläche. Google empfiehlt, dass dies weniger als 100 ms dauert. 

Die dritte und letzte Metrik ist die kumulative Layout-Verschiebung (CLS). Alle kennen dieses Szenario: Die Seite wird teilweise geladen, die User beginnen, den Inhalt zu lesen, und plötzlich verschiebt sich die Seite, sodass der Teil, den sie bisher betrachtet haben, nicht mehr sichtbar ist. CLS misst, wie lange es dauert, bis die Elemente einer Seite nicht mehr hin- und herspringen.

Das Dilemma: Schönheit oder Performance?

Beeindruckende Bilder und Videos steigern nachweislich das Online-Engagement. Je mehr Bilder und Videos auf einer E-Commerce-Website zu finden sind, desto höher ist die Wahrscheinlichkeit, dass Verkäufe, Konversionsraten und der Umsatz steigen. 

Als die größten und Ressourcen-hungrigsten Webobjekte müssen Bilder und Videos jedoch optimiert werden, um bei den Core Web Vitals von Google gut abzuschneiden. Ein Bericht des HTTP Archive hat gezeigt, dass „nicht optimierte Bilder oft am meisten zur Überfrachtung von Seiten beitragen“. Laut dem Web-Almanach 2019 machen visuelle Assets wie Bilder und Videos zwei Drittel der Bytes einer durchschnittlichen Homepage aus.

Hinzu kommt, dass eine durch Bilder und Videos verlangsamte Website abschreckt. Studien zeigen, dass bis zu 40 Prozent der Besucher eine Website verlassen, wenn diese mehr als drei Sekunden zum Laden benötigt. 

Zum Glück gibt es einen Weg, dieses Dilemma zu lösen und gleichzeitig bei den Besuchern und bei den Core Web Vitals zu punkten.

Die Lösung: Optimierung, Automatisierung & Co

Wie das HTTP-Archiv feststellt, sind es die nicht optimierten Bilder, die die Website schwer und langsam machen. Die Optimierung von Bildern und Videos ist sicherlich die einfachste und schnellste Möglichkeit, beim LCP besser abzuschneiden und die allgemeine Webperformance zu verbessern.

Folgende Maßnahmen, können bei der Optimierung von Bildern und Videos helfen:

  • Komprimierung nutzen und dabei eine hohe visuelle Wiedergabetreue beibehalten.
  • Bilder und Videos in neuere, leichtere Formate und Codecs konvertieren, wie zum Beispiel AVIF, JPEG 2000, WebP, AV1 oder HEVC.
  • Generierung von responsiven Bildern, wann immer dies möglich ist.
  • Bereitstellung der Bilder und Videos über verschiedene Content Delivery Networks (CDNs) sowie Zwischenspeicherung der Bild- und Videovarianten an Edge-Standorten.

Diese Maßnahmen manuell durchzuführen wäre mühsam, ganz zu schweigen von dem hohen Zeit- und Ressourcenaufwand. Aber so wie niemand mehr Websites manuell indexiert, gibt es Tools, die die Optimierung von Bildern und Videos in großem Umfang automatisiert haben. 

Stichwort Bildkomprimierung: Viele Entwickler komprimieren Bilder nicht zu sehr, weil sie befürchten, dass die visuelle Qualität leidet. Sie neigen dazu, auf Nummer sicher zu gehen und höhere Qualitätswerte zuzuweisen, als wirklich nötig sind. Die Anpassung des Qualitätskomprimierungsgrads führt jedoch nicht immer zu einem Verlust an visueller Qualität. KI-basierte Tools können dagegen die optimale Dateigröße und visuelle Qualität für ein Bild oder Video automatisch bestimmen. Sie können auch automatisch Bildformate oder Videocodecs in neuere, leichtere Formate konvertieren und abgestimmt auf die Endgeräte der Nutzer diese in dem geeignetsten Format bereitstellen. Die Verwendung vieler Bilder und Videos auf eine Website und eine hervorragende Webperformance sind dank dieser moderner Automatisierungstools kein Dilemma mehr. 

Wenn Google die Nutzererfahrung in den Vordergrund stellt, sollten Unternehmen hier mit ziehen und sicherstellen, dass Besucher ihre Website finden, auf ihr verweilen und mit ihr interagieren –  schließlich will niemand Bouvet Islands des World Wide Webs sein.