Zurück zum Blog

Folgen und abonnieren

Core Web Vitals: Verbessern Sie die Geschwindigkeit Ihrer Website | Fastly

Natalie Griffeth

Senior Content Marketing Manager

Es ist kein Geheimnis, dass Websites, die sich auf das Nutzererlebnis konzentrieren, im Google-Ranking besser abschneiden. Wie schnell eine Seite lädt und wie mobilfreundlich eine Website ist, sind seit Langem Faktoren, die in ihre Suchergebnisse einfließen

Google verwendet drei Schlüssel-Metriken, die sogenannten Core Web Vitals (CWV), um die Nutzerfreundlichkeit Ihrer Website zu bestimmen. Die CWV berücksichtigen die Performance der Website (oder Webseite), ihre Interaktivität und ihre visuelle Stabilität. Wenn Sie bei einer dieser Metriken schlecht abschneiden, wird sich dies negativ auf Ihre Such-Performance, die Transparenz Ihrer Website und Ihre Rankings auswirken. 

Was sind Core Web Vitals?

Die Core Web Vitals sind eine Reihe von Faktoren, die Google für die User Experience einer Website als wichtig erachtet. Die Core Web Vitals bewerten die Seiten Ihrer Website von schlecht (verbesserungsbedürftig) bis gut.

Um diese Signale zu messen, empfiehlt Google den Websites, sich auf folgende Seitenmetriken zu konzentrieren:

Was sind die drei wichtigsten Core Web Vitals und warum sind sie wichtig? 

Core Web Vitals helfen bei der Bewertung mehrerer Faktoren, die das Nutzererlebnis beeinflussen. Eine gute Bewertung in jeder dieser drei Kategorien ist entscheidend für ein gutes Ranking bei Google und eine gute Leistung für Ihre Kunden. 

Cumulative Layout Shift

 CLS misst die visuelle Stabilität und quantifiziert das Ausmaß der Layoutverschiebung, die unerwartet bei sichtbaren Inhalten auftritt. Eine Layoutverschiebung tritt immer dann auf, wenn ein sichtbares Element seine Position von einem Frame zum nächsten ändert. CLS ist keine Kennzahl für die Geschwindigkeit, daher berechnet Google einen Score, der auf den Auswirkungen und der Entfernung der Layoutverschiebung basiert.

Ein anschauliches Beispiel: Bei einem Nutzer, der im Warenkorb soeben seinen Kauf abschließen wollte, verschiebt sich der „Zur Kasse“-Button ganz plötzlich um ein paar Pixel nach unten, sodass er aus Versehen auf „Aus dem Warenkorb entfernen“ klickt.  Ein guter Wert für diese Metrik liegt bei weniger als 0,1.

Interaction to Next Paint

Seit 2024 bewertet die INP als neue CWV die allgemeine Reaktionsfähigkeit einer Seite auf die Interaktionen des Nutzers, indem die Latenz der Tastatureingaben während der gesamten Zeit, in der der Nutzer die Seite besucht, beobachtet wird. Der INP-Wert ist die längste Interaktion, die während des Besuchs des Nutzers beobachtet wurde. Einfacher ausgedrückt, ist es die längste Zeit, die vergeht, bis etwas geladen wird, nachdem ein Nutzer darauf klickt. 

Was ist ein guter INP-Wert? 

  • Eine INP unter oder bei 200 Millisekunden bedeutet, dass eine Seite eine gute Reaktionsfähigkeit hat.

  • Eine INP über 200 Millisekunden und unter oder bei 500 Millisekunden bedeutet, dass die Reaktionsfähigkeit einer Seite verbessert werden muss.

  • Eine INP über 500 Millisekunden bedeutet, dass eine Seite eine schlechte Reaktionsfähigkeit aufweist.

Largest Contentful Paint

Der LCP-Wert misst die Zeit, die zwischen dem Beginn des Ladevorgangs der Seite und der Darstellung des größten Elements vergeht. Bei den gemessenen Elementen handelt es sich in der Regel um Bilder, Videos und Elemente auf Blockebene, die Textknoten enthalten. 

Ein anschauliches Beispiel: Das Erste, was ein Besucher Ihrer Website sieht, ist ein hochauflösendes Video. Wir hoffen, das Laden dauert nicht zu lange! Ein guter Richtwert ist alles unter 2,5 Sekunden.

Wie man die Core Web Vitals verbessert

Die Nutzung eines modernen CDN ist eine der schnellsten und effektivsten Methoden, um Ihre Core Web Vitals zu verbessern, insbesondere den Largest Contentful Paint – den wichtigsten der drei CWVs. 

Obwohl Ihre CDN-Konfiguration zur Verbesserung von INP und CLS beitragen kann, sind sie nicht die Hauptfaktoren. Der Largest Contentful Paint kann direkt durch Ihre CDN-Konfiguration und Ihr API-Design beeinflusst werden.  

Eine der Möglichkeiten zur Optimierung des LCP besteht darin, sich auf die Time to First Byte (TTFB) zu konzentrieren. Durch das Cachen von API-Antworten und das Komprimieren von Bildern auf der Edge können Sie Ihre TTFB und damit Ihren LCP verbessern. Optimiertes API-Design kann erheblichen Einfluss darauf haben, wie schnell dynamische Inhalte geladen werden – und bietet dabei nicht nur ein personalisierteres Nutzererlebnis, sondern auch ein schnelleres. 

Am besten ist es, ein modernes CDN zu verwenden, das bei all diesen Herausforderungen helfen kann: 

Möglichkeiten zur Verbesserung der Core Web Vitals mit einem CDN

Google empfiehlt, sich auf die Core Web Vitals zu konzentrieren. Ein modernes CDN kann Ihnen bei der Performance für all diese Metriken helfen, aber besonders bei derjenigen, die Google als die wichtigste betrachtet – der Largest Contentful Paint (LCP) – Ihre Ladeperformance. Sowohl Ihre CDN-Konfiguration als auch Ihr API-Design können Ihren LCP enorm verbessern, indem sie die TTFB verkürzen, API-Antworten zwischenspeichern und Bilder auf der Edge komprimieren. 

Ein optimiertes API-Design und ein Netzwerk, das seine offenen Verbindungen aktiv aufrechterhält, können die Ladezeit für Ihre gecachten Inhalte, Ihre dynamischen Inhalte und sogar Ihre nicht gecachten Inhalte erheblich verbessern, während Sie eine personalisiertere und schnellere User Experience bieten. Sie können in diesem Bericht weitere Details darüber lesen, wie Fastly mit dem LCP hilft

Hier sind die Möglichkeiten, wie ein CDN die CWVs verbessert:

Auslieferung von veralteten Inhalten
Ein modernes CDN kann „veraltete“ Inhalte ausliefern, wenn Ihr Origin zu lange braucht. Nehmen wir an, ein Kunde sucht nach einer FAQ-Seite zu einem Branchenthema, aber Ihr Origin-Server ist ausgefallen oder reagiert zu langsam. Ein CDN wie Fastly kann den Zuschauern weiterhin „veraltete“ (zwischengespeicherte) Inhalte ausliefern, bis das Problem behoben ist. Dadurch wird die Auslieferung der Inhalte an Ihr Publikum nicht unterbrochen. Dadurch werden nicht nur das Nutzererlebnis und die Zufriedenheit aufrechterhalten, sondern auch Ihre SEO-Rankings verbessert (Google erkennt nicht, dass Ihre Website nicht oder nur langsam geladen wird). Sobald Ihre ursprüngliche Website wieder verfügbar ist, werden die Inhalte aktualisiert. 

Behandlung von Anfragen mit hohem Volumen
Das Web ist voll von Crawlern, die ständig alles im Web konsumieren. Die Anfragen von Webcrawlern können Ihre Server übermäßig belasten und Ihre Leistung beeinträchtigen. CDNs wie Fastly lassen sich leicht so konfigurieren, dass sie Crawlern veraltete Daten bereitstellen und so die Belastung Ihrer Server verringern. Die Crawler erhalten immer noch echte und relevante Inhalte, es ist nur vielleicht nicht die absolut neueste Version. Ein gutes CDN kann eine große Menge an Anfragen (sogar DDoS-Angriffe) ohne Performanceeinbußen verarbeiten und die Alltagsprobleme des Internets intelligent umgehen. 

Bessere Sicherheitsbewertung
Großartige CDN-Anbieter bieten Sicherheitsfunktionen wie DDoS, Bot-Schutz und TLS. Dies bedeutet eine sicherere Website für Ihre Kunden und die Verhinderung verschiedener Cyber-Angriffe. Die wiederholten Algorithmus-Updates von Google machen deutlich, dass die Sicherheit einer Website stark in den Ranking-Faktor des SEO einer Website einfließt. Websites mit schlechten oder fehlenden Sicherheitsmaßnahmen haben negative Auswirkungen auf Rankings und Suchergebnisse. 

Schnellere Ladezeiten für große Dateien
Wenn Sie Ihren Kunden größere Videodateien bereitstellen, kann die Nutzung eines CDN die Seitengeschwindigkeit schnell verbessern. Google indiziert Videodateien in der Regel nicht, es sei denn, sie befinden sich auf Plattformen wie YouTube; wenn Ihre Website also verschiedene eingebettete Videodateien auf demselben Webserver hostet, besteht die Gefahr, dass die Seite langsam lädt. Die Verwendung eines CDN zur Bereitstellung gecachter Versionen der Videodateien kann eine hervorragende Möglichkeit sein, diese Herausforderung zu umgehen. 

Zwischenspeicherung dynamischer Inhalte 

APIs
Eine weitere Leistungsverbesserung durch ein modernes CDN betrifft API-Anfragen: Eine gute CDN-Lösung kann Ihren Origin vor übermäßigen API-Anfragen schützen. Unternehmen halten den API-Traffic oft für zu dynamisch, um einen Vorteil aus der Bereitstellung durch ihr CDN zu ziehen. Fastly setzt sich seit Langem für Best Practices im API-Design ein, die es ermöglichen, API-Antworten auf der Edge zu cachen. Leider werden API-Antworten allzu oft als „nicht zwischenspeicherbar“ abgetan, was bedeutet, dass man einige der einfachsten Performance- und Zuverlässigkeitsvorteile verpasst, die man erzielen könnte, wenn man seine API-Antworten nur in einem Edge-Netzwerk cachen würde. Die Verfügbarkeit von APIs kann sich auf die Verfügbarkeit der Websites und Services von Partnern auswirken. Daher ist es von entscheidender Bedeutung, dass Sie Maßnahmen ergreifen, um eine möglichst hohe API-Verfügbarkeit zu gewährleisten. Sie können dies erreichen, indem Sie mehr Ihrer API-Inhalte auf der Edge mit dem richtigen CDN cachen. 

Dynamischer Inhalt 
Moderne CDNs bieten eine wichtige Funktion, die es Ihnen ermöglicht, mehr zu cachen; sie können „dynamische“ oder sich häufig ändernde Inhalte cachen (denken Sie an Account-Informationen, standortspezifische Produkte, sich ändernde Lagerbestände, neue Schlagzeilen). Traditionelle CDN-Kunden leiden, da ihr Traffic zum Ursprung zurückkehren muss, was zu langsameren Reaktionszeiten, höheren Infrastrukturkosten und höheren Kosten für Ausgangsdaten für diese zahlreichen (unnötigen) Antworten führt. Moderne CDNs ermöglichen es Ihrem Unternehmen hingegen, wirklich dynamische, sich mit jeder Anfrage ändernde Inhalte bereitzustellen, die nicht vom Ursprung, sondern von der Edge aus bereitgestellt werden. Dadurch können Sie Ihren Code näher am Endnutzer ausführen und so kostspielige und zeitaufwendige Performance-Einbußen vermeiden. 

Bildoptimierung
Ein CDN kann die Bildoptimierung erheblich verbessern – indem Kopien eines Bildes auf verteilten Servern gespeichert werden, wird dem Endnutzer ein Bild vom nächstgelegenen Standort bereitgestellt. Dadurch werden die Ladezeiten verkürzt und Sie können Bilder dynamisch an das Gerät und die Bildschirmgröße des Endnutzers anpassen, komprimieren oder konvertieren. Durch die Bereitstellung der optimalen Version eines Bildes bietet ein CDN dem Endnutzer nicht nur das bestmögliche Erlebnis, sondern minimiert auch die häufige Belastung, die lange Ladezeiten von Bildern für eine Website darstellen. Im Durchschnitt machen Bilder 21 % des Gesamtdatenvolumens einer Webseite aus, was bedeutet, dass das langsame Laden von Bildern erhebliche Auswirkungen auf die Gesamt-Performance Ihrer Website haben kann. Wenn es Ihnen gelingt, die Bearbeitung und Bereitstellung von Bildern auf Ihrer Website oder in Ihrer Anwendung so zu optimieren, dass jedes Bild kleiner, die Ladezeiten kürzer und die Aufrufe am Origin-Server weniger werden, wird sich dies positiv auf Ihre Performance als Ganzes auswirken.

Sind Sie bereit, loszulegen?

Treten Sie noch heute mit uns in Kontakt