Core Web Vitals — jak poprawić LCP, INP i CLS

Praktyczny przewodnik po wskaźnikach CWV, które Google uwzględnia w rankingach. Jak mierzyć, diagnozować i poprawiać wyniki bez przebudowy całej strony.

Core Web Vitals — jak poprawić LCP, INP i CLS

Core Web Vitals to zestaw wskaźników wydajności strony, które Google traktuje jako sygnał rankingowy od 2021 roku. Standardy są dziś wyższe niż kiedykolwiek — warto regularnie sprawdzać, czy Twoja strona spełnia aktualne progi.

Co to są Core Web Vitals?

To trzy wskaźniki mierzące różne aspekty doświadczenia użytkownika:

  • LCP (Largest Contentful Paint) — czas wyświetlenia największego elementu na stronie. Powinien być poniżej 2,5 sekundy.
  • INP (Interaction to Next Paint) — opóźnienie odpowiedzi na interakcję użytkownika. Cel: poniżej 200 ms.
  • CLS (Cumulative Layout Shift) — stabilność wizualna strony. Wartość powinna być poniżej 0,1.

Jak poprawić LCP

Najczęstsze przyczyny złego LCP to niezdoptymalizowane obrazy, powolny serwer i blokujące skrypty w sekcji <head>. Rozwiązania:

  • Konwersja obrazów do formatu AVIF/WebP z fallbackiem
  • Atrybut fetchpriority="high" na obrazie hero
  • Preload kluczowych zasobów (fonty, CSS)
  • SSR lub statyczne generowanie zamiast czystego CSR

Jak poprawić INP

INP zastąpił dawne FID w 2024 roku. Skupia się na realnym opóźnieniu interakcji. Co pomaga:

  • Code-splitting i lazy-loading JavaScriptu
  • Debouncing i throttling kosztownych handlerów
  • Minimalizacja głównego wątku — przeniesienie ciężkich obliczeń do Web Workers

Jak poprawić CLS

Aby uniknąć przesunięć layoutu:

  • Zawsze deklaruj width i height dla obrazów
  • Rezerwuj miejsce na reklamy i embeddy
  • Używaj font-display: swap z rozsądnym fallbackiem

Narzędzia diagnostyczne

PageSpeed Insights, Lighthouse, Chrome DevTools (Performance) oraz Web Vitals Extension w przeglądarce. Dla danych z produkcji warto włączyć Real User Monitoring (RUM).

#SEO #Core Web Vitals #Performance

Masz pytania?

Pomożemy wdrożyć rozwiązania z tego artykułu na Twojej stronie. Bezpłatna konsultacja.

Skontaktuj się z nami