W inżynierii webowej minęły czasy, w których szybkość strony oceniało się „na oko". Dziś Google wymaga twardych danych o doświadczeniach użytkownika. Te dane to Core Web Vitals (CWV) – Podstawowe Wskaźniki Internetowe.
Jeśli Twoja strona nie spełnia tych norm, tracisz podwójnie: algorytmy tną Twoją widoczność, a zniecierpliwieni użytkownicy porzucają koszyki.
Co to są Core Web Vitals i dlaczego są ważne?
Core Web Vitals to ustandaryzowany zestaw metryk oceniający stronę z perspektywy rzeczywistego doświadczenia użytkownika. Mierzą trzy kluczowe aspekty: szybkość ładowania głównej treści, czas reakcji na interakcję oraz stabilność wizualną interfejsu.
Od 2021 roku są oficjalnym czynnikiem rankingowym Google. Badania korelują zielone wyniki CWV ze spadkiem bounce rate i wzrostem konwersji.
Wielka Trójka: LCP, INP oraz CLS
1. LCP (Largest Contentful Paint)
LCP mierzy czas renderowania największego bloku tekstu lub obrazu widocznego w viewport. Odpowiada na pytanie: „Czy ta strona jest użyteczna?"
Dobry wynik: Poniżej 2,5 sekundy
Co jest mierzone: Obrazki (w tym tła CSS), tagi <video>, duże bloki tekstowe (np. nagłówki H1).
2. INP (Interaction to Next Paint)
INP mierzy opóźnienia wszystkich interakcji na stronie (kliknięcia, dotknięcia ekranu, wciśnięcia klawiszy) i raportuje tę najgorszą.
Ważne: W marcu 2024 Google oficjalnie zastąpiło FID nową metryką – INP. FID mierzyło tylko pierwsze opóźnienie, INP mierzy wszystkie interakcje.
Dobry wynik INP: Poniżej 200 ms
3. CLS (Cumulative Layout Shift)
CLS mierzy stabilność wizualną. Sumuje wszystkie nieoczekiwane przesunięcia elementów układu strony. Odpowiada za frustrujące sytuacje, w których chcesz kliknąć w przycisk, ale baner przesuwa treść w dół.
Dobry wynik: Poniżej 0,1
Co jest mierzone: Ułamek wpływu (część ekranu ulegająca zmianie) × ułamek odległości (jak daleko przesunął się element).
Jak mierzyć w PageSpeed Insights (PSI)?
Google PageSpeed Insights to podstawowe laboratorium diagnostyczne. Po wpisaniu URL system dzieli wyniki na dwie sekcje:
Dane z obiektywu użytkownika (Field Data / CrUX)
Rzeczywiste dane od prawdziwych użytkowników Chrome z ostatnich 28 dni. Na te dane patrzy algorytm Google.
Diagnozuj problemy (Lab Data / Lighthouse)
Symulacja w kontrolowanych warunkach. Pomaga debugować problemy, ale nie wpływa bezpośrednio na SEO.
Jak poprawić wyniki? Konkretne kroki
Optymalizacja LCP:
- Skróć TTFB: Szybki hosting, CDN (np. Cloudflare), agresywne buforowanie.
- Zoptymalizuj główny zasób: WebP/AVIF, kompresja grafiki stanowiącej LCP.
- Wyeliminuj zasoby blokujące renderowanie: Niekrytyczne CSS/JS na dół lub
defer/async. - Preloading:
<link rel="preload">dla krytycznych zasobów.
Optymalizacja INP:
Problemy z responsywnością wynikają z przeciążonego głównego wątku przeglądarki przez JavaScript.
- Zminimalizuj i skompresuj JS: Usuń nieużywany kod (Code Splitting).
- Podziel długie zadania: Funkcje JS dłuższe niż 50ms „zamrażają" interfejs.
- Lazy Loading skryptów: Czaty, tagi analityczne, piksele społecznościowe — dopiero po załadowaniu głównej treści.
Optymalizacja CLS:
- Deklaruj wymiary: Każdy
<img>,<video>,<iframe>musi miećwidthiheight. - Rezerwuj miejsce: Dla reklam i powiadomień stwórz sztywny kontener (
min-height). - Optymalizuj fonty:
font-display: swapluboptionalw@font-face.
Kluczowa konkluzja: Optymalizacja Core Web Vitals to nie jednorazowy zryw, ale ciągły proces utrzymywania higieny kodu i serwera. Wymaga połączenia wiedzy z zakresu infrastruktury, front-endu oraz analityki.