Spis Treści
Core Web Vitals to wskaźniki dotyczące szybkości i wydajności stron internetowych. Podstawowe wskaźniki internetowe (CWV) to jeden z czynników zapowiadanej na koniec sierpnia 2021 roku aktualizacji pod kątem Page Experience Signals. CWV, obok responsywności, bezpieczeństwa, szyfrowanego połączenia i braku inwazyjnych reklam, stanie się niezbędnym elementem każdej strony internetowej. Wprowadzenie Core Web Vitals jako dodatkowego czynnika rankingowego związane jest z rosnącą rolą doświadczeń użytkownika w kontekście oceny jakości stron internetowych. Aktualizacje Google jasno wskazują kierunek zmian w pozycjonowaniu, w którym internauta i jego zadowolenie z wyników wyszukiwania stają się kluczowe do osiągania przez serwisy wysokich pozycji w wynikach organicznych.
Źródło: https://developers.google.com/search/blog/2020/05/evaluating-page-experience
Źródła danych o wartościach podstawowych składników internetowych dzielimy na 2 typy:
Do głównych Core Web Vitals zaliczamy:
Źródło: https://web.dev/vitals/
LCP (Largest Contentful Paint), czyli największe wyrenderowanie treści. LCP to metryka pokazująca szybkość ładowania serwisu. Mierzona jest jako czas potrzebny przeglądarce do załadowania największego elementu na stronie (tym elementem może być tekst, grafika lub wideo). Do 2,5 sekundy wskaźnik ten oceniany jest jako pozytywny. Wynik w granicach od 2,5 do 4 sekund uznawany jest za przeciętny, potrzebujący poprawy. Natomiast wartość LCP powyżej 4 sekund wskazuje na wysokie ryzyko opuszczenia strony przez użytkownika i interpretowany jest jako alarmująco niski.
Obszar mierzony w analizie LCP dotyczy obszaru above the fold, czyli pierwszego ekranu widocznego dla użytkownika po załadowaniu strony.
Skutki wysokiego LCP: zbyt długi czas oczekiwania na załadowanie elementów.
Źródło: https://web.dev/vitals/
FID (First Input Delay), czyli opóźnienie przy pierwszym działaniu. FID to metryka wskazująca na interaktywność serwisów. Jest to czas liczony od momentu rozpoczęcia ładowania strony do czasu, w którym strona będzie w pełni interaktywna. Dobry FID mieści się w granicy 100 milisekund do pierwszej interaktywności. Wartość wskaźnika FID między 100, a 300 milisekund informuje o potrzebie poprawy interaktywności witryny. Natomiast wynik powyżej 300 milisekund może już negatywnie wpływać na doświadczenia użytkownika ze stroną.
Skutki wysokiego FID: brak możliwości szybkiej interakcji ze stroną.
Źródło: https://web.dev/vitals/
CLS (Cumulative Layout Shift) to metryka mierząca stabilność wizualną układu strony. Jest liczona jako suma przesunięć, które są widoczne podczas ładowania strony. Dotyczy to przesunięć nieoczekiwanych, czyli tych niezwiązanych z interakcją ze strony użytkownika. Co ważne, wyskakujące pop-upy nie będą liczone w ramach wskaźnika CLS. Wynik uznawany za dobry, czyli wskazujący brak przesunięć układu, znajduje się w przedziale od 0 do 0.1. Wskaźnik wynoszący od 0.1 do 0.25 wskazuje na przeciętną stabilność układu strony. Natomiast wartość powyżej 0.25 uznawana jest za bardzo ubogą i wymagającą pilnej optymalizacji.
Skutki wysokiego CLS: Przypadkowe kliknięcia w przycisk w wyniku niespodziewanego przesunięcia na stronie.
TTFB to wartość mierzona jako czas odpowiedzi serwera, od momentu wysłania zapytania do odebrania przez użytkownika pierwszego bajtu odpowiedzi.
FCP to wskaźnik, który mierzy, ile czasu zajmuje przeglądarce załadowanie pierwszego contentu na stronie (treści, obrazka lub wideo).
TTI to wskaźnik, którzy mierzy, ile czasu upływa od załadowania strony do momentu uzyskania opcji wprowadzenia danych w serwisie.
TBT to metryka mierząca, ile czasu upływa pomiędzy załadowaniem pierwszej treści na stronie (FCP) a uzyskaniem opcji wprowadzenia danych (TTI).
Sposoby weryfikacji wskaźników Core Web Vitals:
Aby wykonać pomiar Core Web Vitals z wykorzystanie Page Speed Insights należy przejść na stronę https://developers.google.com/speed/pagespeed/insights/?hl=pl
Źródło: https://developers.google.com/speed/pagespeed/insights/?hl=pl
W narzędziu podajemy adres URL, który chcemy zweryfikować. Co ważne dla poszczególnych podstron tego samego serwisu wyniki będą inne, dlatego rekomendowana jest weryfikacja stron różnego typu. W przypadku sklepu internetowego warto sprawdzić wyniki dla strony głównej, koszyka i kontaktu czy stron kategorii i podstron produktowych.
Źródło: https://developers.google.com/speed/pagespeed/insights/?hl=pl
Po weryfikacji w narzędziu PSI otrzymujemy 2 zestawy danych: dane laboratoryjne oraz dane zgromadzone (o których pisaliśmy wyżej w akapicie: Sposób mierzenia Core Web Vitals).
W ramach testu wykonanego w PSI otrzymujemy zestaw gotowych wytycznych do wdrożenia na stronie.
Jeśli mamy założone i zweryfikowane konto Google Search Console (jeśli nie posiadasz tego narzędzia, dowiedz się: jak założyć GSC) bardzo łatwo sprawdzimy, czy nasza witryna spełnia kryteria nowego czynnika rankingowego. Po zalogowaniu na stronie https://search.google.com/search-console w sekcji Ulepszenia > Podstawowe wskaźniki internetowe znajdziemy raporty CWV zarówno dla urządzeń mobilnych, jak i komputerów.
Źródło: https://search.google.com/search-console
Gdy otworzymy wybrany przez nas raport, otrzymamy dokładne informacje na temat typu nieprawidłowości występującego na stronie ze wskazaniem konkretnych podstron, których problem dotyczy. Aby przejść do szczegółu, należy kliknąć tabelę i wybrany wiersz z problemem.
Źródło: https://search.google.com/search-console
Pomiar Core Web Vitals jest także możliwy w narzędziu GTMetrix pod adresem https://gtmetrix.com/. Tak jak PageSpeed Insights, GTMetrix podaje wyniki dla konkretnego adresu URL, a nie całej strony, dlatego konieczna jest tutaj weryfikacja wybranych reprezentatywnych stron dla danego serwisu (np. pomiar strony głównej, kategorii, wpisu blogowego, kontaktu). GTMetrix przedstawia tylko dane laboratoryjne. Warto pamiętać, że narzędzie jest darmowe tylko dla wyników desktopowych. W wersji płatnej otrzymamy również dane dla wersji mobilnej.
Źródło: https://gtmetrix.com/
Web Dev to niejako rozwinięcie PSI i znajdziemy je pod adresem https://web.dev/measure/. W Web Dev mamy dostęp tylko do danych laboratoryjnych. Otrzymujemy dokładne wskazówki i przewodnik do optymalizacji elementów słabej jakości, a także mamy możliwość planowania raportów. Te same informacje znajdziemy w Google Dey Tools w zakładce Lighthouse.
Źródło: https://web.dev/measure/
Źródło: https://web.dev/measure/
Kolejne narzędzie do testów CWV to WebPage Test dostępne pod adresem https://www.webpagetest.org/, które uwzględnia tylko dane laboratoryjne. Minusem tego narzędzia może być długi czas oczekiwania na wyniki, plusem zaś przedstawienie graficzne poszczególnych wyników CWV.
Źródło: https://www.webpagetest.org/
Narzędzie jest dostępne w Chrome DevTools po kliknięciu PPM i Inspect albo F12. Lighthouse daje możliwość sprawdzenia danych laboratoryjnych. Ważne, aby weryfikację CWV w Lighthouse przeprowadzać w oknie incognito, ponieważ wtyczki dodane do przeglądarki Chrome mogą opóźniać działanie strony i tym samym fałszować wyniki.
Po naciśnięciu przycisku F12 w przeglądarce Chrome otwiera się panel, w którym użytkownik ma dostęp między innymi do konsoli Java Script. Aby zmierzyć prędkość strony, należy wejść w zakładkę Performance, na której możemy analizować dane laboratoryjne dotyczące Core Web Vitals.
W związku z tym, że narzędzie pokazuje dane laboratoryjne, możemy wykonać test na żądanie – zarówno dla konkretnej strony, jak i wersji (dekstop lub mobile). W narzędziu użytkownik znajdzie dokładne informacje o elementach wypływających na wynik CLS czy LCP.
Analizując TBT (czynnik opisany wyżej w akapicie: Inne wskaźniki CWV) jesteśmy w stanie również zidentyfikować, gdzie występuje zagrożenie związane z FID.
Jeśli naszym celem jest szybka weryfikacja wyników Core Web Vitals na stronie, to możemy do tego celu wykorzystać wtyczkę: Core Web Vitals Extension, którą pobierzemy dla przeglądarki Chrome pod tym adresem: https://chrome.google.com/webstore/detail/core-web-vitals/adeniimnihmbpgpbljmnohjpoolmgabj
Aby pobrać wtyczkę, wystarczy przejść na wskazany wyżej adres i kliknąć dodaj do Chrome.
Źródło: https://chrome.google.com/webstore/detail/core-web-vitals/adeniimnihmbpgpbljmnohjpoolmgabj
Jeśli chcemy szybko sprawdzić działanie naszej strony pod kątem Core Web Vitals, wystarczy kliknąć ikonę wtyczki i sprawdzić wynik. Warto pamiętać, że FID pokaże nam się dopiero po interakcji z serwisem (np. po kliknięciu).
Web Vitals – to kolejna wtyczka do Chrome do szybkiej weryfikacji CWV w czasie rzeczywistym. Narzędzie znajduje się pod adresem https://chrome.google.com/webstore/detail/web-vitals/ahfhijdlegdabablpippeagghigmibma i pozwala w łatwy sposób wyłapać strony o słabszych parametrach. Warto pamiętać, że wtyczka Web Vitals Extension to dopiero wstęp do badania CWV a pogłębiona analiza dostępna jest w innych narzędziach.
W tym artykule przedstawiliśmy najważniejsze informacje o Core Web Vitals. Jak nowy czynnik rankingowy wpłynie na pozycje serwisów w 2021 roku? Nie do końca wiemy. Można założyć, że walka o wysokie pozycje będzie się odbywać na poziomie stron konkurencyjnych. Jeżeli nie zadbamy o CWV, a nasz konkurent dostosuje witrynę do standardów Google, z dużym prawdopodobieństwem będzie miał nad nami przewagę w osiąganiu wyższych pozycji w wynikach organicznych. Zadbanie o podstawowe wskaźniki internetowe (CWV) to zmniejszenie współczynnika odrzuceń czy zapewnienie wysokiego komfortu korzystania ze strony.
W kolejnym artykule (Jak optymalizować stronę pod Core Web Vitals?) przybliżymy sposoby na optymalizację serwisu pod kątem Core Web Vitals. Na jakie elementy warto zwracać uwagę? Co i jak możemy poprawić?
