Test Cumulative Layout Shift (CLS)

Test Cumulative Layout Shift w SEOptimerze pokazuje wynik CLS Twojej strony na tle progów Google, wykorzystując dane terenowe Google pochodzące od rzeczywistych użytkowników.

Audyt SEO dowolnej witryny w kilka sekund
+ Kompleksowe narzędzia SEO / GEO do każdego zadania

Wykonuj ponad 100 kontroli swojej witryny w zakresie SEO on-page, użyteczności, wydajności, mediów społecznościowych i linków. Teraz z GEO w każdym raporcie. SEOptimer oferuje również badanie słów kluczowych, monitorowanie pozycji, analizę linków zwrotnych oraz pełne indeksowanie witryny.

Informacje o skumulowanym przesunięciu układu

Czym jest skumulowane przesunięcie układu?

Skumulowane przesunięcie układu mierzy, jak bardzo zmienia się układ strony podczas jej wczytywania. Za każdym razem, gdy widoczny element przeskakuje w nowe miejsce bez działania użytkownika, przesunięcie otrzymuje wynik, a wyniki te są sumowane.
Jest to wskaźnik, którego objaw jest najbardziej znany: sięgasz po link i klikasz coś innego, ponieważ reklama lub obraz załadowały się powyżej niego i przesunęły stronę w dół.
W przeciwieństwie do dwóch pozostałych wskaźników nie jest mierzony w czasie. Jest to współczynnik opisujący, jak duża część ekranu się przesunęła i na jaką odległość, dlatego wartości są niewielkie, a wynik 0,1 już oznacza zauważalne przesunięcie.

Jaki wynik CLS uznaje się za dobry?

Google uznaje wynik 0,1 lub niższy za dobry, wynik od 0,1 do 0,25 za wymagający poprawy, a każdy wynik powyżej 0,25 za słaby — przy 75. percentylu rzeczywistych wczytań stron.
Przesunięcia powodowane przez samego użytkownika nie są uwzględniane. Otwarcie akordeonu lub zamknięcie banera powoduje uzasadnione przesunięcie strony, a za usprawiedliwione uznaje się tylko przesunięcie następujące w ciągu pół sekundy od interakcji — jest to w przybliżeniu czas, w którym użytkownik przypisuje przesunięcie własnemu działaniu.
Zwykle jest to najłatwiejszy do osiągnięcia z tych trzech elementów. Podczas gdy poprawa LCP i INP wymaga optymalizacji wydajności, większość przesunięć układu można wyeliminować poprzez zarezerwowanie miejsca, co jest zmianą w znacznikach, a nie w architekturze.

Co zwykle powoduje przesunięcia układu

  • Obrazy i filmy bez atrybutów szerokości i wysokości, przez co do czasu ich załadowania nie jest rezerwowane żadne miejsce.
  • Reklamy i elementy osadzane wstawiane do kontenera, który nie miał określonych wymiarów.
  • Czcionki internetowe przełączające się na inny rozmiar niż czcionka zastępcza i powodujące ponowne rozmieszczenie tekstu.
  • Banery, komunikaty i paski plików cookie wstawiane nad istniejącą treścią.
  • Treść wstawiana przez skrypt po wyrenderowaniu strony.
Wspólny schemat jest zawsze taki sam: coś pojawia się z opóźnieniem i zajmuje miejsce, którego wcześniej dla tego elementu nie zarezerwowano. Wszystko poniżej zostaje przesunięte w dół, a element, którego odwiedzający miał zamiar dotknąć, zmienia położenie.

Jak to poprawić

  • Ustaw szerokość i wysokość każdego obrazu i filmu, aby przeglądarka mogła zarezerwować dla nich miejsce.
  • Nadaj miejscom na reklamy i osadzonym elementom stały minimalny rozmiar, nawet gdy są puste.
  • Wstępnie wczytuj kluczowe czcionki i dopasuj parametry czcionki zastępczej, aby ich zamiana nie powodowała ponownego układania strony.
  • Umieszczaj banery i komunikaty poniżej istniejącej treści albo nakładaj je na nią zamiast przesuwać zawartość.
  • Zarezerwuj miejsce na wszystko, co skrypt doda później.
  • Sprawdź stronę na urządzeniach mobilnych, gdzie wąska kolumna sprawia, że niewielkie przesunięcie staje się dużym problemem.

Co sprawdza to narzędzie

Test CLS odczytuje dane terenowe Google dla strony — pomiary zebrane od rzeczywistych użytkowników przeglądarki Chrome — i pokazuje, jak wypada ona względem powyższych progów.
Jeśli nie wyświetla się żaden wynik, oznacza to, że strona ma zbyt mały ruch, aby Google mógł przedstawić raport. W międzyczasie jedynym wskaźnikiem, który można wiarygodnie sprawdzić ręcznie, jest przesunięcie układu: wczytaj stronę na telefonie, przy wolnym połączeniu, i obserwuj, co się przesuwa.
W przypadku pozostałych dwóch wskaźników lub wszystkich trzech naraz użyj narzędzia Test Core Web Vitals.

Co dalej

Większość przypadków przesunięcia układu ma związek z obrazami i zasobami ładowanymi z opóźnieniem. Sprawdź optymalizacja obrazów na stronie, jej rozmiar za pomocą narzędzia rozmiar pliku strony internetowej oraz jej działanie na telefonie za pomocą testu responsywność mobilna.

Kompleksowy zestaw narzędzi SEO obejmujący ponad 55 narzędzi

Sprawdzaj tytuły, metaopisy, nagłówki, dane strukturalne, podstawowe wskaźniki internetowe, SSL i plik robots.txt. Generuj metatagi, mapy witryn i reguły .htaccess, minifikuj CSS, JS i HTML oraz twórz treści za pomocą naszych narzędzi AI do pisania — natychmiast i za darmo.

Dalsza lektura

Zobacz więcej
Core Web Vitals: What are They? How are They Crucial to SEO?
You should optimize your web pages for a seamless user experience. But how can you measure the quality of user experience on a site? That’...
SEOptimer's Core Web Vitals Checks
What are Core Web Vitals?   Google launched the Core Web Vitals (CWV) initiative in 2020 - "essential metrics for a healthy site". T...
Page Speed: What It Is, and How It Impacts SEO
What is Page Speed?   The term page speed refers to the amount of time your media content or web page will take to download from the...
Webpage Size - Why is it important? And how do you optimize it?
What is Webpage Size?   The term webpage size in the SEO world refers to the downloaded file size of a given web page.    The...