seoraporu.co

Jak obniżyć wskaźniki Core Web Vitals i LCP

Czym są Core Web Vitals?

Core Web Vitals to trzy podstawowe wskaźniki wydajności zdefiniowane przez Google w celu pomiaru komfortu użytkowania: LCP (Largest Contentful Paint — czas wyświetlenia największego elementu treści na ekranie), INP (Interaction to Next Paint — szybkość reakcji na interakcję użytkownika) oraz CLS (Cumulative Layout Shift — skala przesunięć wizualnych podczas ładowania strony). Te trzy wskaźniki są mierzone na podstawie rzeczywistych danych użytkowników (field data); oznacza to, że nie są obliczane na podstawie testów laboratoryjnych (np. jednorazowej kontroli), lecz na podstawie danych zebranych w rzeczywistych warunkach urządzeń i sieci odwiedzających stronę.

Te trzy wskaźniki odzwierciedlają różne aspekty doświadczenia użytkownika: LCP oddaje „wrażenie, jak szybko strona się załadowała”, INP odpowiada na pytanie „jak szybko strona reaguje na interakcję”, a CLS mierzy, czy „strona przesuwa się na moich oczach”. Jeśli wszystkie trzy wskaźniki nie są na dobrym poziomie, ogólne wrażenia użytkownika nie można uznać za w pełni „dobre”.

W niniejszym przewodniku skupiamy się przede wszystkim na wskaźniku LCP, ponieważ jest to zazwyczaj wskaźnik, na który najłatwiej wpłynąć i który stanowi najbardziej konkretny obszar do poprawy; duży obrazek lub film w sekcji hero może sam w sobie opóźnić LCP o kilka sekund.

Dlaczego to jest ważne?

Wskaźniki te bezpośrednio odzwierciedlają wrażenia użytkownika: wolno ładująca się, opóźniona w reakcji na interakcje lub ciągle przesuwająca się strona zniechęca użytkownika do korzystania z witryny. Google wykorzystuje Core Web Vitals jako jeden z sygnałów rankingowych; wpływ tych wskaźników może być szczególnie wyraźny w przypadku wyszukiwań mobilnych, ponieważ urządzenia mobilne i sieci są zazwyczaj bardziej ograniczone niż w przypadku komputerów stacjonarnych.

Zgodnie z aktualnymi progami, aby wskaźnik LCP został uznany za „dobry”, musi wynosić poniżej 2,5 sekundy, a warunek ten musi być spełniony u co najmniej 75% rzeczywistych użytkowników. Witryna przekraczająca ten próg, nawet jeśli działa poprawnie pod względem technicznym, z punktu widzenia doświadczenia użytkownika zaliczana jest do kategorii „powolnych”, co może negatywnie wpłynąć zarówno na współczynnik konwersji, jak i na pozycję w wynikach wyszukiwania.

Źródło spowolnienia LCP może być różne w zależności od witryny: w niektórych przypadkach przyczyną jest duży, nieskompresowany plik graficzny, podczas gdy w innych główną przyczyną jest powolna odpowiedź serwera (TTFB) lub skrypty stron trzecich blokujące renderowanie (np. sieci reklamowe, narzędzia analityczne). Dlatego przed rozpoczęciem optymalizacji ważne jest ustalenie, który element został oznaczony jako LCP.

Jak to naprawić?

Przykład

<link rel="preload" as="image" href="/hero.webp" fetchpriority="high">

Zły przykład: ustawienie obrazu LCP <img src="hero.jpg" loading="lazy"> — uniemożliwia to przeglądarce natychmiastowe pobranie obrazu podczas ładowania strony i znacznie wydłuża czas LCP.

Często popełniane błędy