Core Web Vitals: czym są i jak je poprawić?

core web vitals
Witamy w najnowszym przewodniku po Core Web Vitals, czyli Podstawowych Wskaźnikach Internetowych. To baza wiedzy, która pozwoli początkującym osobom w branży SEO czy Web Devu na zrozumienie tego nieoczywistego tematu. Bardziej doświadczeni specjaliści odświeżą sobie za to wcześniej zdobyte informacje i być może dowiedzą się czegoś nowego.

 

Podstawowe Wskaźniki Internetowe (polskie określenie CWV) są tak naprawdę zestawem konkretnych czynników, uważanych przez Google za ważne dla ogólnego doświadczenia użytkownika strony internetowej. Według architektów tego rozwiązania, na doświadczenia użytkowników ma wpływ przede wszystkim szybkość i wydajność strony.

W roku 2021 użytkownicy mają ogromny wybór merytorycznych stron czy sklepów internetowych z korzystnymi ofertami. Przyzwyczajeni są również do sprawnego ich ładowania i płynności działania. Te, które nie spełniają tych warunków są przez użytkowników zazwyczaj gorzej traktowane. Dlatego też w teorii CWV ma służyć do odsiewania stron gorszej jakości pod względem technicznym przez Google i proponowaniu tych, które spełniają ich wytyczne.

Jest to jedna z części zmiany kierunku Google względem generowania wyników wyszukiwania. Coraz większy wpływ ma mieć doświadczenie użytkownika, a nie czynniki, które niekoniecznie mają na nie wpływ per se (jak na przykład linkowanie zewnętrzne). Choć realne mierzenie zadowolenia osób korzystających z Google jest nadal pieśnią przyszłości, to jednak próby faworyzacji doświadczeń użytkowników względem wyszukiwarki są podejmowane przez jej twórców coraz odważniej.

Drugą stroną medalu są jednak opinie mówiące, że Google robi to w celu ograniczenia indeksacji mniej jakościowych stron dla zaoszczędzenia swoich zasobów. Infrastruktura niezbędna do działania indeksacji, jak i całej wyszukiwarki nie jest z gumy. Coraz więcej indeksowanych stron powoduje generowanie coraz większej ilości danych, które trzeba gdzieś gromadzić.

Choć taki argument może brzmieć przekonująco, to jednak same CWV pomagają również w zmianie podejścia twórców stron do ich stanu technicznego. Jest to kwestia zdecydowanie działająca na korzyść wszystkich użytkowników internetu.

Na jakie wskaźniki dzielimy Core Web Vitals?

Core Web Vitals opierają się na 3 podstawowych parametrach:

  • LCP (Largest Contentful Paint) 
  • FID (First Input Delay)
  • CLS (Cumulative Layout Shift)

Te czynniki to część wyniku Google pod kątem “jakości” strony, czyli ich sposobu na określenie poziomu UX danej strony. Dzięki nim w miarodajny sposób można ocenić wydajność strony i podjąć racjonalne działania, aby stała się ona lepsza w oczach Google, jak i użytkowników.

Stan CWV jest określany poprzez poniższą gradację:

  • Poor (kolor czerwony informujący o kiepskim wyniku)
  • Needs improvements (kolor żółty informujący o przeciętnym wyniku)
  • Good (kolor zielony informujący o akceptowalnym wyniku)

Są one zależne od określonych przez Google norm i każdy ze wskaźników ma je ustalone na innym poziomie.

Largest Contentful Paint (LCP)

Ten czynnik określa czas ładowania strony z punktu widzenia rzeczywistego użytkownika. Dotyczy czasu renderowania największego bloku obrazu lub tekstu w widocznym obszarze w stosunku do momentu pierwszego załadowania strony.

LCP na nieodpowiednim poziomie skutkuje wysokim czasem oczekiwania na załadowanie elementów strony. Jest to zdecydowanie niewskazane zjawisko, bo będzie też pośrednio wpływało na wzrost współczynnika odrzuceń, czyli mniejszą ilość wartościowego ruchu na stronie.

First Input Delay (FID)

FID odnosi się do czasu potrzebnego użytkownikowi na faktyczną interakcję z Twoją stroną. Podchodząc do tej definicji nieco bardziej skrótowo, to właśnie ten wskaźnik technicznie mierzy, ile czasu zajmuje, aby “coś” wydarzyło się na stronie. Przykładami podejmowanych interakcji są kliknięcia w przyciski menu, wpisywanie adresu e-mail w polu tekstowym, otwieranie tekstu umieszczonego w tzw. harmonijce czy kliknięcie w aktywny link.

Nie zawsze jest to jednak kluczowy wskaźnik, ponieważ strony oparte przede wszystkim na contencie (na przykład blogi) nie posiadają zwykle wielu elementów do interakcji. 

Na tym wskaźniku powinno nam zależeć priorytetowo w przypadku sklepów internetowych, które posiadają wiele elementów interaktywnych. Im szybciej klient będzie mógł odwiedzić daną kategorię czy produkt, tym większa szansa, że przerodzi się w to w wartościową konwersję Takie podejście do optymalizacji technicznej strony przybliża ją do osiągnięcia niższego poziomu wskaźnika FID.

Cumulative Layout Shift (CLS)

CLS skupia się na przedstawieniu poziomu stabilności ładowania strony, czyli tzw. “Visual stability”. Jeśli elementy na twojej stronie poruszają się podczas ładowania, wtedy wynik wskaźnika CLS będzie wysoki.

W przypadku gdy konkretne linki, czy elementy menu pojawią się w danym miejscu podczas ładowania, a za chwilę przeniosą się gdzieś indziej, użytkownik może poczuć się zagubiony na stronie podczas ich wzrokowego poszukiwania. 

Wpływa to także na potencjalne kliknięcie przez użytkownika innego elementu, który w tym samym momencie pojawi się w miejscu tego pierwszego. Są to sytuacje wpływające zdecydowanie negatywnie na odbiór strony pod kątem technicznym.

Jak sprawdzić stan Core Web Vitals na stronie?

Poniżej znajdują się 3 wybrane przez nas źródła wiedzy o stanie wskaźników CWV. Są one w pełni wystarczające, aby móc je realnie zweryfikować i potencjalnie wdrożyć na ich podstawie poprawki.

PageSpeed Insights

Podstawowym i dostępnym dla każdego źródłem wiedzy jest Page Speed Insights, które już od 2020 roku zaczęło oscylować przede wszystkim wokół CWV. O ile sam ogólny score również ma znaczenie przy zdobywaniu pozycji w SERPach, to jednak warto przede wszystkim skupiać się na szczegółach wskaźników. Przekazują one dużo więcej wartościowych danych, z których da się wyciągnąć równie wartościowe wnioski.

 

Podstawowa forma wizualizacji CWV w narzędziu PageSpeed Insights z uwzględnieniem dodatkowego wskaźnika FCP.

Po weryfikacji strony przez narzędzie otrzymujemy trzy wersje badania. Pierwszym z nich są przedstawione na screenie powyżej rozciągnięte w czasie wyniki. Opierają się one na analizie danych strony z ostatnich 28 dni. Na podstawie ładowania danych w przeciągu tych dni wyliczany jest procent akcji, które spełniły dane wytyczne, a dopiero z tego wyciągany jest ostateczny wynik.

Drugim typem podsumowania jest ten opierający się na stanie wskaźników w chwili przeprowadzania badania. Przedstawia konkretne dane o dodatkowych współczynnikach, nie uznawanych za część CWV. Warto je również brać pod uwagę dbając o poprawę stanu technicznego strony, bo w dalszym ciągu mają wpływ na ogólny Page Score.

Trzecim typem są rekomendacje (podzielone na sekcje “Możliwości” i “Diagnostyka”), które wprost wskazują, co warto na stronie poprawić. Warto mieć na uwadze fakt, że nie mają one bezpośredniego wpływu na stronę. Sam Google o tym informuje, jednakże wprowadzone poprawki mogą przybliżyć witrynę do osiągnięcia lepszych wyników.

Ciekawą opcją jest filtrowanie wyników na te, które odnoszą się do jednego z trzech wskaźników CWV oraz do Total Blocking Time (czas, przez który strona nie może odpowiadać na dane wejściowe użytkownika, takie jak kliknięcia myszą, naciśnięcia ekranu lub naciśnięcia klawiatury). Warto napomknąć, że samo TBT wraz z LCP są wskaźnikami mającym największy wpływ na Page Speed Score.

Google Search Console

Najdokładniejszym źródłem informacji na temat CWV na naszej stronie jest obecnie Google Search Console i zbiór opcji o nazwie “Performance”. Tam właśnie znajduje się specjalna sekcja poświęcona opisywanym wskaźnikom. W założeniu ma pomagać właścicielom stron w jak najszybszym i najskuteczniejszym przystosowaniu ich do nowych standardów.

Pierwszy widokiem, który pojawia się po wejściu we wspomnianą zakładkę jest podsumowanie wszystkich zaindeksowanych podstron pod kątem CWV z podziałem na wersję mobilną i desktopową strony. Jest oparte na przedstawieniu poziomu wskaźników na poszczególnych podstronach za pośrednictwem wykresów z ostatnich 3 miesięcy. W taki sposób można dokładniej zweryfikować, które podstrony działają właściwe, a które wymagają poprawek.

Po kliknięciu w “Open Report” ukażą się nam dokładniejsze dane, które przedstawiają na wykresie liczbę stron z danego przedziału “jakości”. Do tego warto odwiedzić również zakładkę “Details”, która zlicza wszystkie podstrony niespełniające warunków danego wskaźnika CWV.

Tam również można sprawdzić każdy brany pod uwagę w ogólnych obliczeniach adres URL, co zdecydowanie przydaje się podczas prac webdeveloperskich. Dzięki takiemu podsumowaniu mamy możliwość wybrania najbardziej priorytetowych części naszej strony i zadziałanie w miejscach, które wymagają wprowadzenia największej ilości technicznych ulepszeń.

GTMetrix

Pierwsze narzędzie na naszej liście służące pośrednio do analizy CWV spoza stajni Google. Może stać się wartościowym dodatkiem do wcześniej przeprowadzonych za pośrednictwem PSI badań. W jego przypadku pierwszym zalecanym działaniem jest utworzenie konta, dzięki czemu otrzymujemy możliwość dostosowania lokalizacji serwera testowego.

Gdy zrezygnujemy z tej opcji, dane zawarte w badaniu będą dużo bardziej niedokładne, bo domyślnym serwerem jest ten znajdujący się w Kanadzie. Nie daje to szans na w pełni skuteczne zweryfikowanie np. europejskich witryn.

Sam wygląd i działanie narzędzia przypomina PSI. Tutaj również znajdziemy dane odnoszące się do Core Web Vitals, jednak wskaźnik FID został zastąpiony przez wskaźnik TBT. Oprócz tej różnicy badana strona otrzymuje również całkowitą ocenę wzorowaną na tych z amerykańskich szkół (od A do F). Jest ona ściśle połączona z ocenami procentowymi odnoszącymi się do jej wydajności i struktury. Wyciągana jest na podstawie danych z Google Lighthouse połączonych z autorskimi audytami GTMetrixa.

Dużo ciekawszymi danymi są za to rekomendacje poprawek wartych wprowadzenia na stronie, ale także zakładki odnoszące się wprost do CWV. Zdecydowanie warta uwagi jest wizualizacja wskaźników i czasu ich występowania na podstawie rzeczywistego wczytywania witryny. Pozwala ona w bardziej namacalny sposób przekonać się w jaki sposób zachowują się konkretne wskaźniki.

Jeszcze bardziej atrakcyjną opcją jest naszym zdaniem podsumowanie wydajności. W tym przypadku wszystkie wskaźniki Core Web Vitals są przedstawione w przystępnej i spójnej  formie, dodatkowo określane dopuszczalnymi przedziałami zgodnie z wytycznymi od Google. 

Jest to również dobre miejsce dla początkujących w kwestii zagadnień związanych z CWV. Wszystko za sprawą opcji włączenia bardziej szczegółowych informacji (suwak “More details”), wystarczających do zrozumienia danych zagadnień.

Pozostałe narzędzia do weryfikacji CWV

Innymi godnymi uwagi narzędziami są:

  • web.dev – narzędzie od Google, swoiste przedłużenie samego PSI
  • Lighthouse – kolejne narzędzie od Google dostępne za pośrednictwem Chrome DevTools, bardzo podobne do PSI
  • Google Web Developer – uruchamiane z poziomu przeglądarki Chrome, przeznaczone dla bardziej doświadczonych użytkowników
  • WebPage Test – powolnie przeprowadzane badania rekompensowane są dokładną wizualizacją funkcjonowania wskaźników na stronie
  • Ahrefs – integracja opcji Site Audit z CWV wprowadzona na początku lipca tego roku, która nadal jest w fazie testowej

Jak poprawić Core Web Vitals?

Same analizy są oczywiście kluczowe dla właściwej weryfikacji stanu naszej strony, ale co w przypadku, gdy ich dokonaliśmy, a nasza strona nie jest przystosowana do standardów CWV? Wtedy warto samodzielnie lub z pomocą doświadczonego Web Developera zdecydować się na techniczne wzmocnienie strony. Poniżej przedstawiamy uniwersalne porady odnoszące się do tego, co warto poprawić w kontekście danego wskaźnika Core Web Vitals.

Poprawa LCP

  • Zadbaj o stan swojego hostingu – w pierwszej kolejności zalecamy poprawę szybkości działania hostingu. Lepszy hosting to szybsze ładowanie strony, będące kluczowym względem LCP. Jeśli obecne rozwiązania nie dają efektów, to warto wziąć pod uwagę kwestię, taką jak migracja strony na inny hosting.
  • Usuń niepotrzebne skrypty zewnętrzne – tego typu skrypty potrafią zaszkodzić stronie w kontekście szybkości ładowania i spowolnić ją nawet o kilkadziesiąt milisekund (to dużo w przypadku LCP). Większość elementów powinna ładować się z poziomu serwera, co zdecydowanie pomaga utrzymać wyższy poziom responsywności.
  • Skonfiguruj “Lazy load” – leniwe ładowanie sprawia, że zbędne (czyli niewidoczne) w danym momencie elementy (głównie obrazy) się nie wczytują. Dopiero, gdy ktoś przewinie stronę w dół, zaczynają być wczytywane na stronie. Takie rozwiązanie osiąga się zazwyczaj za pomocą wtyczek, jednak w przypadku customowych rozwiązań można je wprowadzić za pomocą JavaScriptu.
  • Usuń zbyt duże elementy strony – czasem jeden element składowy strony może zaważyć na stanie wskaźnika LCP. W PageSpeed Insights lub w GTMetrix można znaleźć wzmiankę o konkretnym obrazie czy elemencie szablonu, który warto usunąć lub zastąpić.
  • Zminimalizuj rozmiar CSS – Zbyt duże rozmiary stylów w formacie CSS są zabójcze dla wskaźnika LCP. Warto je uszczuplić, z czym powinien poradzić sobie każdy doświadczony web developer.

Poprawa FID

  • Używaj pamięci podręcznej – pomaga to szybciej ładować zawartość danej strony. Dzięki temu przeglądarki użytkowników będą ładować części z JavaScriptem dużo szybciej, co wpływa na lepsze wyniki względem FID.
  • Usuń wszelkie skrypty zewnętrzne, z których nie korzystasz aktywnie – skrypty zewnętrzne to także kody z narzędzi analitycznych, umieszczone np. w headerze strony. Jeśli nie potrzebujesz danego kodu pochodzącego z Google Analytics czy kodu należącego do HotJara i generowanych map ciepła to warto je usunąć. Gwarantuje to poprawę wskaźnika FID.
  • Zminimalizuj (lub zrezygnuj z) JavaScriptu – realia dotyczące JavaScriptu nie pozwalają na wchodzenie w interakcje użytkownika ze stroną podczas jego ładowania. Dlatego też kluczowe dla poprawy poziomu FID jest ograniczenie wpływu JS na stronę.

Poprawa CLS

  • Dodaj najważniejsze elementy strony w części widocznej na ekranie – odpowiednie ułożenie strony to nie tylko kwestia typowo wizualna. Przy takim podejściu najczęściej używane elementy nie spychają treści, których użytkownik się spodziewał. Pozostaną za to w przewidywanym miejscu po załadowaniu całej strony.
  • Upewnij się, że elementy reklamy mają zarezerwowane miejsce na stronie – niedopuszczalną sytuacją z punktu technicznego, jak i zadbania o sam CLS jest pojawianie się reklam w niekontrolowanych miejscach. Wertykalne i horyzontalne rozjeżdżanie się strony jest możliwe do uniknięcia, jeśli zadba się o to z poziomu zaplecza strony.
  • Używaj atrybutu “set size” dla dowolnych mediów (wideo, obrazy, infografiki czy GIF-y) – W ten sposób przeglądarka użytkownika dokładnie wie, ile miejsca na stronie zajmie dany element. Dzięki temu nie wystąpi samodzielna interpretacja ze strony przeglądarki, a wyświetlane media po załadowaniu strony pozostaną w miejscu, w którym miały się planowo pojawić.

Jak ważne są Core Web Vitals i kiedy zostaną wprowadzone?

Oficjalna premiera aktualizacji Core Web Vitals została przełożona na sierpień 2021 roku. Mimo to od czerwca jest już stopniowo wprowadzana, aby Google mógł monitorować jak zachowuje się ona na “żywym organizmie”, czyli wyszukiwarce. Ciężko przewidzieć jak będą zachowywać się SERPy po ostatecznym wprowadzeniu CWV.

Naszym zdaniem żadne spektakularne zmiany nie powinny nastąpić. Google chce zmieniać swoją wyszukiwarkę, ale jest to na tyle rozbudowana sieć powiązań, że tak drastyczne zmiany mogłyby odbić się zbyt negatywnie na użytkownikach, stronach internetowych, a ostatecznie na samym Google. 

Jednak nie będzie to też kwestia bez znaczenia, więc pewnych przetasowań należy się spodziewać. W końcu wrzawa w branży SEO (wywoływana częściowo przez samo Google i wypowiedzi ich pracowników) na ten temat pojawia się już od 2020 roku. Gigant wyszukiwarek nie może pozwolić sobie na wizerunkowe straty spowodowane przesadnym pompowaniem balonika.

Są to jednak estymacje oparte na prostych analizach. Na prawdziwe wnioski należy poczekać do następnych miesięcy, gdzie wszystko będzie możliwe do zweryfikowania za pośrednictwem realnych danych. Wstępnej weryfikacji stanu technicznego stron dokonał za to zespół backlinko, który zbadał ponad 200 000 witryn pod kątem ich przygotowania do CWV.

Okazuje się, że w kontekście każdego ze wskaźników liczba stron spełniająca normy CWV przekracza aż 50%, co jest raczej dobrym wynikiem. Czy w takim razie warto się na wzorować na potencjalnej konkurencji? Naszym zdaniem tak i przygotowanie do nowej aktualizacji jest dobrym zabezpieczeniem przed ewentualnymi spadkami pozycji, które bez podjęcia działań są możliwe. Dlatego też na podstawie naszego artykułu i innych źródeł zalecamy poprawienie swoich stron w kontekście wskaźników, a w konsekwencji ogólnej ich wydajności

.

Ostatnie wpisy

Spis treści

Ostatnio na naszym blogu

core web vitals
Porady SEO
Mateusz Stanisławczyk

Core Web Vitals: czym są i jak je poprawić?

Chcesz dowiedzieć się więcej o Core Web Vitals? Zapraszamy do sprawdzenia naszego artykułu, który odpowiada na najważniejsze pytania z tej tematyki!

migracja strony
Porady SEO
Mateusz Stanisławczyk

Migracja strony – poradnik krok po kroku

Szukasz sposobów na skuteczną migrację bez większych spadków ruchu? Sprawdź nasz poradnik i poznaj cały proces krok po kroku!

Chcesz współpracować z nami?

Otrzymaj
Darmową Wycenę

Znajdziesz w niej informację, o tym jak wygląda współpraca z anchor.team oraz szczegółowy plan na pozycjonowanie Twojej strony.

Do you want to cooperate with us?

RECEIVE FREE QUOTE

In it, you will find information about what the cooperation with anchor.team looks like and a detailed plan for positioning your website.

Potrzebujesz wsparcia?

Wypełnij formularz, pomożemy Ci poprawić widoczność Twojej strony.