Już w połowie zeszłego roku Google ogłosiło, że w 2021 r. tzw. Core Web Vitals (w skrócie CWV), czyli Podstawowe Wskaźniki Internetowe, staną się ważnym czynnikiem rankingowym. I rzeczywiście tak się ostatecznie stało wraz z nadejściem sierpnia 2021 r. Czym zatem są czynniki Core Web Vitals, jakie informacje można z nich wyciągnąć i w jaki sposób je sprawdzić?

Core Web Vitals – co to właściwie jest?

Podstawowe wskaźniki internetowe to zestaw czynników, wchodzących w skład szerszego zbioru Page Experience Signals, czyli sygnałów świadczących o użyteczności strony, które Google uważa za ważne dla ogólnego doświadczenia użytkownika. Na Core Web Vitals  składają się z trzy główne pomiary: LCP, FID oraz CLS.

LCP, czyli największe wyrenderowane treści

LCP (ang. Largest Contentful Paint) – jest to wskaźnik, który mierzy, jak długo ładuje się największy element na stronie (to może być zarówno plik wideo, obraz, grafika w tle czy spory blok tekstu). 

Szacuje się, że optymalnie wskaźnik LCP powinien wynosić nie więcej niż 2,5 sekundy, a im niższy tym lepszy. Z kolei wynik powyżej 4 sekund uznawany jest za niski. Strony, które ładują się powyżej tego czasu mogą zniechęcić użytkownika do korzystania ze strony i w efekcie spowodować jej szybkie opuszczenie. 

Co ważne, wskaźnik LCP obliczany jest wyłącznie na podstawie elementów widocznych w tak zwanym above the fold, czyli na pierwszym widocznym przez użytkownika ekranie (zanim zacznie on przewijać stronę w dół). 

Jeśli więc jakiś element pojawia się na ekranie w trakcie ładowania się strony, a następnie zostaje zepchnięty poza obszar ekranu, i tak zostanie uwzględniony w wyniku LCP. I analogicznie – jeśli użytkownik nie widzi danego elementu w trakcie ładowania, a następnie “wskakuje” on w obszar pierwszego widoku, to nie jest on uwzględniany w wyniku LCP.

FID, czyli opóźnienie przy pierwszej interakcji ze stroną

FID (z ang. First Input Delay) – jest to czas pomiędzy pierwszą interakcją użytkownika ze stroną np. kliknięciem w linka, a reakcją przeglądarki na to zdarzenie. Czas ten optymalnie nie powinien przekraczać 100 milisekund. Natomiast uzyskanie czasu powyżej 300 milisekund to już wynik wymagający naprawy, gdyż może powodować negatywne doświadczenie u odwiedzającego stronę użytkownika. 

Google uważa wskaźnik FID za ważny, ponieważ bierze pod uwagę sposób, w jaki użytkownicy realnie wchodzą w interakcję ze stroną. Ale wskaźnik ten nie zawsze jest raportowany. Jeśli po załadowaniu strony użytkownik nie “klika” z żaden element akcji czy link, nie loguje się na swój profil ani nie wypełnia formularza kontaktowego (co zdarza się np. na stronach z artykułami o aktualnych wydarzeniach, blogach itp.), Google nie ma możliwości zmierzenia czasu reakcji, a więc nie wyświetla także raportu o FID w Google Search Console.

CLS, czyli wizualna stabilność układu strony

CLS (z ang. Cumulative Layout Shift) – wskaźnik stabilności wizualnej, sprawdzający, czy i w jakim stopniu elementy strony przemieszczają się w jej obrębie w trakcie ładowania, przy czym pod uwagę brane są elementy zmieniające swoje położenie samoistnie, a nie na skutek interakcji użytkownika. 

Im więcej elementów “przeskakuje” w trakcie ładowania, tym gorszy wynik CLS. Co istotne, dane odnośnie stabilności wizualnej strony pobierane są nie tylko w chwili jej ładowania, ale przez cały okres wizyty użytkownika na stronie. 

Strona celująca w wysoką użyteczność dla użytkownika powinna utrzymywać ten wskaźnik na poziomie poniżej 0.1. Wynik przekraczający 0.25 wskazuje, że wskaźnik ten wymaga optymalizacji. 

Największe problemy ze wskaźnikiem CLS mogą mieć strony zawierające wiele grafik i plików wideo, które nie mają podanych atrybutów “width” oraz “height” lub nie stosują tak zwanego “CSS ratio box” (nie mają narzuconych proporcji w jakich mają się wyświetlać za pomocą kodu CSS) oraz strony, na których nie zastosowano placeholderów dla obrazów ładowanych dynamicznie.

Dlaczego Google uznaje Core Web Vitals za istotne wskaźniki?

Na to pytanie jest bardzo prosta odpowiedź – UX stron zawsze miał duże znaczenie dla Google, a dodanie wskaźników Core Web Vitals do listy czynników algorytmicznych było tylko kwestią czasu. 

Procent osób korzystających z urządzeń mobilnych do przeglądania stron od wielu lat systematycznie wzrasta, stąd konieczność troski o to, aby ich doświadczenia na urządzeniach mobilnych i desktopowych były porównywalne. 

Nie da się ukryć, że promowanie stron przyjaznych dla użytkownika jest dla Google również działaniem wizerunkowym, które ma na celu pozyskanie i utrzymanie zaufania internautów do tej wyszukiwarki.  

Stąd wynika też walka ze spamem i regularne aktualizacje pod kątem wykluczania stron potencjalnie niebezpiecznych dla użytkownika (np. w roku 2021 Link Spam Update dwukrotnie przetoczył się przez SERPy, najpierw w lipcu, potem w pierwszym tygodniu listopada). Co to ma wspólnego z Core Web Vitals? 

Przykładowo wizualna niestabilność strony, na którą wskazuje niski wskaźnik CLS, może powodować, że użytkownik przypadkowo kliknie w link, za którym nie zamierzał podążać. To częste zjawisko na źle zoptymalizowanych pod tym kątem mobilnych wersjach stron, ale jest to również popularny mechanizm działania stron spamerskich i potencjalnie niebezpiecznych, które chcą doprowadzić do pobrania przez nieświadomego użytkownika szkodliwego kodu czy oprogramowania.  

Na palcach jednej ręki można policzyć tych, którym na komórce nigdy nie otworzyła się niechciana zakładka i nie musieli się zastanawiać, czy przypadkiem nie będzie to miało negatywnych konsekwencji. 

Nie dziwi zatem, że Google stara się wykluczać z wyników wyszukiwania i nie promować na wysokich pozycjach w SERPach stron, które nie są w pełni przyjazne dla internautów, stąd też konieczność ich stałej analizy pod tym kątem.

Jak sprawdzić czy strona wymaga optymalizacji pod Core Web Vitals?

Istnieje wiele narzędzi, dzięki którym przeanalizujesz wskaźniki CWV strony. Najpopularniejsze z nich to: PageSpeed Insights, Google Search Console, Google Web Developer, Lighthouse, GTmetrix i WebPageTest.

PageSpeed Insights (PSI)

Od niedawna znajdziesz je pod adresem https://pagespeed.web.dev/. Narzędzie to prezentuje dwa zestawy danych – laboratoryjne oraz dane rzeczywiste (odzwierciedlające dane zgromadzone przez Google od realnych użytkowników odwiedzających analizowany adres w okresie ostatnich 28 dni).

W pasku narzędziowym wystarczy dodać adres strony, którą chcemy przetestować i poczekać na prezentację wyników. Otrzymamy je jako zestaw wskaźników dla wersji mobilnej i desktopowej. Jeśli dla danej strony Google nie zgromadził dotychczas odpowiedniej ilości danych rzeczywistych, PSI przedstawi tylko dane laboratoryjne. 

PageSpeed Insights sprawdza wyłącznie wskaźniki CWV dla wprowadzonego w pasku adresu, nie dla całej witryny. Dlatego, aby jak najlepiej poznać wydajność poszczególnych sekcji strony, należy przetestować wyrywkowo kilkanaście stron, np. tych z których użytkownicy odwiedzają najczęściej (popularne kategorie produktowe, blog, cennik usług), nie tylko samą stronę główną.

Google Search Console

Właściciele stron znajdą również raport o wskaźnikach CWV w narzędziu Google Search Console w dziale “Podstawowe wskaźniki internetowe”, który jest częścią kategorii “Eksperymenty i personalizacja”. 

Podobnie jak PageSpeed Insights, Google Search Console prezentuje odrębne wyniki wskaźników CWV na urządzeniach mobilnych i desktopowych. 

W przeciwieństwie jednak do PSI, które pozwala analizować pojedyncze adresy strony, Google Search Console raportuje całe grupy stron, które spełniają lub nie spełniają konkretnych standardów CWV, przy czym z góry grupuje razem adresy, które według zebranych od użytkowników danych mogą mieć podobną przyczynę problemu z wydajnością.

Google Web Developer w Chrome

Po wejściu na stronę i wciśnięciu klawisza funkcyjnego F12, przeglądarka Chrome udostępnia panel Google Web Developer, gdzie w zakładce “Wydajność” (Performance) można ją przetestować w wersji desktopowej oraz w różnych ustawieniach mobilnych. W ten sposób można uzyskać szczegółowe informacje o elementach, które wpływają na wynik wskaźników CWV. 

Dodatkowo w Google Web Developer znajduje się również inne bardzo popularne narzędzie do testów laboratoryjnych, czyli Lighthouse.

Lighthouse

To narzędzie jest szczególnie lubiane przez twórców stron internetowych, ponieważ umożliwia nie tylko szybką analizę strony pod kątem wydajności i użyteczności, ale jednocześnie wskazuje, czy strona jest zoptymalizowana pod kątem SEO i czy nie ma problemów z ułatwieniami dostępu czy bezpieczeństwem. 

Lighthouse – podobnie jak Google Web Developer – umożliwia testy w wersji mobile i desktop. Jeśli korzystasz z jakichkolwiek wtyczek do przeglądarki Chrome i chcesz przeprowadzić test w Lighthouse, rekomenduję wykonać go w trybie incognito, aby uniknąć ewentualnego przekłamania wyników.

Zaletą Lighthouse jest łatwość użycia oraz bardzo jasna prezentacja wyników, umożliwiająca ich zrozumienie nawet osobom dopiero zaczynającym swoją karierę jako projektant stron lub specjalista SEO. 

Ponadto narzędzie to jest stale aktualizowane przez zespół programistów Google, więc nie ma obaw, że będzie prezentowało wyniki oparte na nieobowiązujących już wytycznych.

Zamiast korzystać z narzędzia Lighthouse przez Google Web Developer, można pobrać je w sklepie Google jako rozszerzenie do przeglądarki i mieć zawsze pod ręką czy raczej “na jedno kliknięcie”, w pasku narzędziowym. 

Informacje o wynikach wskaźników CWV strony, zaprezentowane i opisane identycznie jak w narzędziu Lighthouse, można uzyskać również pod adresem  https://web.dev/measure/.

GTmetrix i WebPageTest

To mniej popularne narzędzia do laboratoryjnych testów wskaźników Core Web Vitals. Znajdziemy je odpowiednio pod adresem https://gtmetrix.com/ i https://www.webpagetest.org/ . Pierwsze z nich – podobnie jak PageSpeed Insights – sprawdza wskaźniki wyłącznie dla adresu podanego przez testującego. Zmiana opcji analizy (typ urządzenia i lokalizacja) wymaga jednak założenia konta i logowania się do serwisu, a przetestowanie strony w wersji na mobile (na rzeczywistych urządzeniach) wymaga już wykupiona wersji PRO. 

Drugie narzędzie udostępnia większą ilość opcji bez potrzeby logowania, jednak przeprowadzenie testu zaawansowanego może trwać na nim dość długo przy bardziej rozbudowanych stronach.

Narzędzia pokazują dobre wyniki wskaźników CWV? To świetnie, ale…

…warto zwrócić uwagę na fakt, że wyniki uzyskane przez dewelopera strony podczas jej tworzenia i testowania jej użyteczności, w tym także wskaźników CWV, rzadko będą idealnie pokrywać się z późniejszymi wynikami gromadzonymi i analizowanymi przez Google. Dlaczego? 

Z tej prostej przyczyny, że dadzą wyniki właściwe dla jakości połączenia internetowego oraz sprzętu, na którym pracuje web developer oraz kilku możliwych ustawień, które oferuje narzędzie, z którego korzysta w danej chwili. 

Testy projektowanej strony w warunkach laboratoryjnych (czyli te wykonywane m.in. poprzez narzędzia Lighthouse, WebPageTest czy DevTools w przeglądarce Chrome) pozwolą na wykluczenie oczywistych błędów mających wpływ na doświadczenia użytkowników, jednak nigdy nie gwarantują, że po uruchomieniu strona sprawdzi się tak samo w każdym innym środowisku u odbiorców docelowych. 

Tymczasem Google ocenia stronę na podstawie danych zbieranych w czasie rzeczywistym od faktycznych użytkowników odwiedzających stronę, którzy korzystają z niej w różnych środowiskach, tj. na różnych urządzeniach mobilnych, ekranach różnej rozdzielczości, korzystając raz z szybszych, innym razem słabszych połączeń internetowych (Wi-Fi, danych komórkowych czy światłowodowych).

Przykładowo, na wynik wskaźnik LCP mogą wpłynąć opóźnienia serwera po stronie użytkownika, na które web developer nie ma przecież wpływu. Z kolei wskaźnik CLS może zwracać różne wyniki nie tylko ze względu na rozdzielczość ekranów urządzeń, ale również wtedy, gdy użytkownik korzysta z wtyczek blokujących reklamy, co może znacząco zmienić ostateczny układ strony, którą widzi odwiedzający. 

Tym samym narzędzia do testów laboratoryjnych są świetnym punktem wyjściowym do analizy potencjalnych błędów i optymalizacji strony pod kątem CWV, jednakże nigdy nie dają 100% pewności, że algorytmy Google ocenią stronę w ten sam sposób.Dobrze jest też sprawdzić wskaźniki CWV strony w kilku narzędziach, gdyż rozbieżność wyników między nimi może być znacząca. Dane najbliższe rzeczywistego stanu otrzymamy z PageSpeed Insights czy informacji zawartych w dziale Podstawowe wskaźnike internetowe w Google Search Console, ale dopiero po opublikowaniu strony i po zgromadzeniu przez Google wystarczającej ilości danych pozwalających tym narzędziom na sporządzenie pełnego raportu.