Core Web Vitals pokazuje trzy wskaźniki, według których Google zajmuje pozycję – LCP, CLS i INP – mierzone na żywo na przeglądanej stronie, oceniane w oparciu o progi Google i powiązane z dokładnym elementem stojącym za każdą liczbą.
Core Web Vitals decyduje o części rankingu Twoich stron, ale zwykłe sposoby ich pomiaru są niewygodne. Narzędzia laboratoryjne oceniają obciążenie syntetyczne, którego nikt nie doświadcza. Search Console raportuje rzeczywistych użytkowników, z czterotygodniowym opóźnieniem, pogrupowanych w segmenty adresów URL. Żadne z nich nie informuje, który element na stronie przed tobą stanowi problem.
To narzędzie mierzy stronę, na którą faktycznie patrzysz, podczas jej używania. LCP, CLS i INP otrzymują kafelek ze swoją wartością, oceną Dobra, Wymaga pracy lub Słaba w stosunku do progów opublikowanych przez Google, a także pasek pokazujący, gdzie siedzisz. FCP i TTFB znajdują się obok nich ze względu na kontekst, ponieważ powolny LCP spowodowany powolnym serwerem to inny problem niż ten spowodowany ciężkim obrazem.
Definicje odpowiadają temu, co Chrome raportuje do CrUX, co ma znaczenie, jeśli zamierzasz porównywać liczby w Search Console. CLS wykorzystuje okna sesji — okno kończy się po jednosekundowej przerwie lub po pięciu sekundach, a najgorsze okno wygrywa — zamiast naiwnie sumować każdą zmianę. INP to 98. percentyl opóźnienia interakcji, który w przypadku normalnej wizyty jest po prostu najwolniejszą interakcją. LCP przestaje się zmieniać przy pierwszej interakcji, dokładnie tak, jak robi to Chrome.
Najbardziej przydatne jest przypisanie każdej liczby. Panel wymienia największy element pomalowany, elementy, które się przesunęły i najwolniejsze interakcje, a przycisk Pokaż umożliwia przewinięcie do dowolnego z nich i obrysowanie go na stronie. Zamiast wiedzieć, że CLS wynosi 0,31, widzisz baner, który spycha Twoją treść w dół. Kopiuj raport, który przekazuje Ci całość jako tekst biletu.
Trzy wskaźniki rankingowe aktualizują się w miarę korzystania ze strony: przewijanie powoduje przesunięcie CLS, kliknięcie i wpisanie przesunięcie INP. Każdy z nich ma ocenę Dobra, Wymaga pracy lub Słaba w stosunku do progów Google.
Nazywa największy element farby, elementy, które się przesunęły i najwolniejsze interakcje. Naciśnij Pokaż, aby przewinąć do dowolnego z nich i obrysować go bezpośrednio na stronie.
CLS wykorzystuje okna sesji z przerwą 1 s i ograniczeniem do 5 s, INP to 98. percentyl opóźnień interakcji, a LCP zawiesza się przy pierwszej interakcji, więc Twoje liczby zgadzają się z Search Console.
First Contentful Paint i Time To First Byte znajdują się obok wielkiej trójki, dzięki czemu możesz odróżnić powolny serwer od ciężkiego obrazu bohatera, zanim zaczniesz optymalizować niewłaściwą rzecz.
Wyświetla listę najwolniejszych interakcji z typem zdarzenia i związanym z nim elementem, dzięki czemu można znaleźć powolne menu rozwijane lub filtr, zamiast zgadywać.
Jedno kliknięcie kopiuje wszystkie dane, oceny i selektory naruszające zasady w postaci zwykłego tekstu — gotowego do wklejenia w zgłoszeniu, żądaniu ściągnięcia lub wiadomości e-mail klienta.
Upewnij się, że LCP, CLS i INP są gotowe do pracy nad nowym szablonem, zanim zostanie on opublikowany, a nie dowiemy się o tym w Search Console miesiąc później.
Search Console informuje, że grupa adresów URL nie spełnia wymagań CLS; otwórz jeden z nich za pomocą tego narzędzia i zobacz dokładnie, który element powoduje przesunięcie.
Przewiń stronę i zobacz, jak CLS wspina się, a następnie naciśnij Pokaż, aby zarysować spóźnioną reklamę, baner lub czcionkę internetową, która przenosi Twoją treść.
Klikaj filtry, menu i moduły, a następnie zapoznaj się z listą najwolniejszych interakcji, aby dowiedzieć się, które sterowanie kosztuje setki milisekund.
Zapisz liczby, zastosuj poprawkę, a następnie ponownie zmierz tę samą stronę i porównaj dwa raporty obok siebie.
Kliknij ikonę Core Web Vitals w doku DevSuite Pro. Kafelki metryczne pojawiają się od razu przy użyciu tego, co strona już zarejestrowała.
LCP ma sens tylko od początku ładowania strony, więc załaduj ponownie przy otwartym panelu, gdy chcesz uzyskać odczyt, któremu możesz zaufać.
Przewiń całą stronę, aby wykonać CLS, a następnie kliknij, dotknij i wpisz, aby wygenerować pomiary INP. Płytki aktualizują się w miarę upływu czasu.
Naciśnij Pokaż obok elementu LCP, źródła zmiany układu lub powolnej interakcji. Strona przewinie się do niego i obrysuje go, więc nie ma wątpliwości, który element jest za to odpowiedzialny.
Kliknij opcję Kopiuj raport, aby wyświetlić podsumowanie wszystkich danych, ocen i selektorów w postaci zwykłego tekstu. Naciśnij Reset, aby ponownie uruchomić CLS i INP od zera.
Zainstaluj DevSuite Pro za darmo i odblokuj ponad 71 narzędzi programistycznych dla swojej przeglądarki.