Czym jest Core Web Vitals i na co wpływa?

Web Core Vitals to wskażniki, na podstawie których Google ocenia doświadczenia użytkownika strony internetowej. Dotyczące stabilności layoutu, prędkości ładowania strony oraz szybkości jej interakcji mają ogromne znaczenie dla pozycjonowania strony. Przeczytaj i dowiedz się, jak działa Core Web Vitals oraz na co wpływa!

Czym jest Core Web Vitals?

Core Web Vitals to 3 wskaźniki, które pozwalają Google na dokonanie oceny danej strony internetowej  pod kątem jej przyjazności dla użytkownika. Należą do nich:

• LCP (ang. Largest Contentful Paint) – mierzy czas, jaki strona potrzebuje do załadowania największego elementu, który się na niej znajduje, np. grafiki, czy filmu. Dobry LCP powinien wynosić poniżej 2,5 sekundy. Jeżeli jednak na załadowanie zajmuje do 4 sekund, oznacza to, że wymaga on poprawy. Każdy LCP powyżej 4 sekund jest natomiast kwalifikowany jako słaby.
• FID (ang. First Input Delay) – dotyczy on interaktywności witryny, czyli czas, jaki mija od momentu wejścia przez użytkownika w interakcję ze stroną, np. poprzez kliknięcie w kolejną podstronę, zapisanie się do newslettera itp. Dobry FID powinien wynosić poniżej 100 milisekund. Jeżeli jednak zajmuje on do 300 milisekund, wymaga on poprawy. Z kolei FID powyżej 300 milisekund jest uznawany za zły.
• CLS (ang. Cumulative Layout Shift) – wskaźnik stabilności strony, który ma zapobiegać niechcianemu przechodzeniu na inne witryny w wyniku przypadkowego wejścia w ładujące się na stronie reklamy, czy powiadomienia. Dobry CSs to taki, który wynosi 0,1 lub mniej. Z kolei CLS powyżej 0,25 uznawany jest za zły.

Jak Core Web Vitals wpływa na pozycjonowanie strony?

Core Web Vitals wpływa korzystnie na pozycjonowanie stron, jakie wyświetlają się w wynikach wyszukiwarki. W jaki sposób? Zasada jest prosta – im lepsze wskaźniki LCP, FID oraz CLS strona będzie miała, tym wyżej w wynikach wyszukiwania się one ona znajdzie. Dlaczego tak jest? Przede wszystkim wynika to z dbałości Google, by dostarczyć użytkownikom tej wyszukiwarki jak najbardziej wartościowych treści i stron. Dobre wyniki Core Web Vitals są więc dla właścicieli stron internetowych szansą na wyższe pozycje – zwłaszcza biorąc pod uwagę to, że nie każdy zdążył przygotować swoją witrynę do aktualizacji, jaką wprowadziło Google. Optymalizując wskaźniki, można więc wyprzedzić konkurencję. W przypadku e-sklepów i branży e-commerce, lepsze wskaźniki zwiększają także prawdopodobieństwo sfinalizowania sprzedaży na stronie. To z kolei przekłada się bezpośrednio na zyski firmy.

Jak poprawić wynik Core Web Vitals?

Na końcu warto również wspomnieć o tym, jak poprawić Core Web Vitals na stronie internetowej. Aby to jednak zrobić, należy skupić się na każdym ze wskaźników z osobna.

Jak poprawić LCP?

Aby poprawić ten wskaźnik, należy zająć się rozwiązaniem problemów, które spowalniają szybkość ładowania strony, np.:

• Wolna odpowiedź serwera – w tym celu wystarczy zoptymalizować kod po stronie serwera lub zoptymalizować TTFB (ang. Time To Firs Byte) – poprzez optymalizację infrastruktury serwera i aplikacji. Warto więc zatroszczyć się o to, by serwer posiadał najnowszą wersję PHP oraz został zainstalowany na szybkich dyskach SSD. Warto również wykorzystać mechanizmy cachujące po stronie serwera.
• Wolne ładowanie zasobów – tu warto zastosować kompresje grafik w formacie WEBP. Optymalizacji mogą wymagać również pliki HTML, CSS oraz JS.
• Blokowanie renderowania –  warto pomyśleć o priorytetyzacji kolejności ładowania. Dla internautów najważniejsze jest to, aby najszybciej załadować tę część strony, która wyświetla się na pierwszym ekranie. Z kolei przeglądarka powinna renderować stronę od samej jej góry. Spowalniać renderowanie może m.in. za duża ilość plików CSS czy JS. Dlatego warto pomyśleć o łączeniu i minifikacji CSS i JS, czyli na połączeniu wielu plików w jeden i skompresowaniu go.

Jak poprawić FID?

Zgodnie z zaleceniami Google FID można poprawić poprzez optymalizację TBT (ang. total bloking time). W tym celu wystarczy wyłączyć wszelkie zbędne skrypty JS lub ewentualnie załadować je asynchronicznie. Warto również pozbyć się ładowania skryptów z innych stron oraz używać funkcji Serwer-Side Rendering.

Jak poprawić CLS?

Ostatnim wskaźnikiem do poprawy jest CLS. Jak to zrobić? Tu wystarczy jedynie nadać grafice predefiniowaną wysokość oraz szerokość. Można to zrobić przy użyciu odpowiednich atrybutów, np. media – jeżeli chodzi o responsywność grafiki.