Core Web Vitals – jetzt in Chrome integriert

Haben Sie sich gefragt, wie diese Zahlen in den DevTools lauten?

Anfang dieses Jahres hat Google in den DevTools eine browserinterne Vorschau von Core Web Vitals eingeführt. In diesem Artikel geht es eingehend darum, was Core Web Vitals (CWV) sind, warum sie wichtig sind und wie wir sie verbessern können.

Core Web Vitals (CWV) sind eine neue Ergänzung zur Registerkarte „Leistung“ von Google Chrome. Bei CWV handelt es sich um eine Reihe von Kennzahlen, die Google verwendet, um die allgemeine Benutzererfahrung einer Webseite zu bewerten. Sie konzentrieren sich auf drei Schlüsselaspekte der Leistung:

Größter Contentful Paint (LCP)

LCP ist das Maß dafür, wie schnell die Webseite lädt. Ein schneller LCP zeigt an, dass der Benutzer schnell mit den wichtigsten Inhalten auf der Seite interagieren kann.

Laut Dokumentation:

Um eine gute Benutzererfahrung zu bieten, sollten Websites bei mindestens 75 % der Seitenaufrufe einen LCP von 2,5 Sekunden oder weniger anstreben.

Best Practices zur Optimierung von LCP:

• Bilder optimieren und ihre Dateigröße reduzieren.
• Ressourcen, die das Rendern blockieren, minimieren.
• Browser-Caching nutzen.
• Server-Antwortzeiten verbessern.
• Verwenden Sie ein CDN.
• Erfahren Sie hier mehr.

Interaktive Farbe (INP)

INP ist das Maß für die Reaktionsfähigkeit der Seite bei Interaktionen wie dem Klicken auf Schaltflächen oder dem Eingeben von Formularen. Ein schneller INP zeigt an, dass die Seite reagiert und nicht träge oder nicht reagiert.

Laut Dokumentation:

Um eine gute Benutzererfahrung zu bieten, sollten Websites eine Interaktion mit dem nächsten Paint von 200 Millisekunden oder weniger anstreben.

Best Practices zur Optimierung von INP:

• JavaScript-Ausführungszeit minimieren.
• Vermeiden Sie lange Aufgaben, die den Hauptthread blockieren.
• Priorisieren Sie kritische Aufgaben und verschieben Sie unkritische.
• Optimieren Sie die Ereignisbehandlung und Eingabeverarbeitung.
• Erfahren Sie hier mehr.

Kumulative Layoutverschiebung (CLS)

CLS ist das Maß für die visuelle Stabilität der Seite und bewertet, wie oft sich Elemente unerwartet verschieben, nachdem die Seite geladen wurde. Ein Beispiel für unerwartete Layouts finden Sie hier.

Ein niedriger CLS zeigt an, dass die Seite optisch stabil ist und nicht unter unerwarteten Layoutverschiebungen leidet, die das Benutzererlebnis beeinträchtigen können. Laut Dokumentation:

Um eine gute Benutzererfahrung zu bieten, sollten Websites einen CLS-Score von 0,1 oder weniger anstreben.

Best Practices zur Optimierung von CLS:

• Reservieren Sie Platz für dynamische Inhalte.
• Vermeiden Sie Bilder ohne angegebene Abmessungen.
• Font-Display verwenden: gegen Schriftarten austauschen.
• Minimieren Sie durch JavaScript ausgelöste Layoutverschiebungen.
• Erfahren Sie hier mehr.

Warum sind Core Web Vitals wichtig?

Benutzererfahrung: Eine gute Benutzererfahrung ist entscheidend für den Erfolg einer Website. Core Web Vitals wirken sich direkt darauf aus, wie Benutzer die Leistung und Benutzerfreundlichkeit einer Website wahrnehmen.

Suchmaschinenranking: Google hat angegeben, dass Core Web Vitals ein Rankingfaktor sind. Websites mit schlechten Core Web Vital-Werten können in den Suchergebnissen einen niedrigeren Rang einnehmen.

Conversion-Raten:Eine schnelle und stabile Website wandelt Besucher eher in Kunden um.

Abschluss:

Indem Sie sich auf die Verbesserung der Core Web Vitals konzentrieren, können Sie ein besseres Benutzererlebnis schaffen, das Suchmaschinenranking Ihrer Website verbessern und die Konversionsraten Ihrer Website erhöhen.

Das obige ist der detaillierte Inhalt vonCore Web Vitals – jetzt in Chrome integriert. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!