Szybkość strony nie jest sportem polegającym na zdobyciu 100 punktów w PageSpeed Insights. Dla firmy ważniejsze jest to, czy użytkownik szybko widzi ofertę, może wygodnie kliknąć, nie obserwuje przesuwających się elementów i bez problemu wysyła zapytanie. Core Web Vitals są użyteczne, bo porządkują ten temat w trzech wymiarach: ładowanie, interakcja i stabilność wizualna.
Co mierzą Core Web Vitals?
| Metryka | Co pokazuje | Typowy problem na stronie MŚP | Co zwykle pomaga |
|---|---|---|---|
| LCP | czas załadowania największego widocznego elementu | ciężkie zdjęcie w hero, wolny hosting, brak cache | optymalizacja obrazu, preload, cache, lepszy serwer |
| INP | reakcja strony na interakcję użytkownika | zbyt dużo JavaScriptu, ciężkie wtyczki, nieoptymalny motyw | ograniczenie JS, usunięcie zbędnych skryptów, poprawa motywu |
| CLS | stabilność układu w czasie ładowania | brak wymiarów obrazów, banery, fonty, dynamiczne elementy | rezerwacja miejsca, stabilne style, kontrola reklam i widgetów |
Dlaczego szybkość strony jest decyzją biznesową?
Właściciel firmy często widzi szybkość jako temat „techniczny”, który można odłożyć. Tymczasem wolna strona działa jak niewidoczny podatek od każdej kampanii, każdej publikacji i każdego linku. Jeżeli użytkownik wchodzi z telefonu, czeka zbyt długo, a następnie rezygnuje przed kontaktem, firma płaci za pozyskanie uwagi, której nie potrafi wykorzystać.
Największym błędem jest poprawianie szybkości bez kontekstu. Strona z ruchem głównie desktopowym ma inne priorytety niż lokalna usługa, którą klienci sprawdzają w telefonie. Inaczej optymalizuje się landing page z jednym formularzem, inaczej sklep z filtrowaniem i setkami zdjęć, a jeszcze inaczej serwis poradnikowy z rozbudowanym linkowaniem.
Case study: kiedy problemem nie był hosting, tylko szablon
W jednym z audytów strona firmowa była oceniana jako „wolna”, a pierwszym pomysłem była zmiana hostingu. Po analizie okazało się, że serwer odpowiadał akceptowalnie, ale strona ładowała kilka bibliotek używanych tylko w jednej sekcji, duże zdjęcia bez wersji mobilnych i skrypt slidera, który wyświetlał statyczną grafikę. Zmiana hostingu poprawiłaby objaw, ale nie przyczynę.
| Element | Przed optymalizacją | Po optymalizacji | Znaczenie |
|---|---|---|---|
| Obraz główny | jeden duży plik dla desktopu i mobile | wersje WebP/AVIF, poprawne rozmiary, preload | szybszy LCP |
| JavaScript | kilka bibliotek ładowanych globalnie | skrypty tylko tam, gdzie są potrzebne | lepszy INP |
| Fonty | kilka odmian i wag | ograniczony zestaw, font-display | mniej przesunięć i krótsze ładowanie |
| Cache | brak spójnej konfiguracji | cache po stronie serwera i przeglądarki | stabilniejsza praca serwisu |
Jak czytać PageSpeed Insights bez wyciągania złych wniosków?
PageSpeed Insights może pokazywać dane laboratoryjne i dane użytkowników, jeżeli są dostępne. Dane laboratoryjne są przydatne do diagnozy, bo powstają w kontrolowanych warunkach. Dane rzeczywiste są cenne, bo pokazują doświadczenie użytkowników korzystających z różnych urządzeń i sieci. W małych serwisach nie zawsze będzie wystarczająca próbka danych terenowych, dlatego trzeba łączyć narzędzia, a nie traktować jednego wyniku jak wyroku.
Przykładowa waga problemów przy optymalizacji mobile
Najczęstsze techniczne przyczyny słabego LCP
- grafika główna większa niż potrzebuje realny ekran użytkownika,
- brak priorytetu ładowania dla najważniejszego obrazu,
- slider zamiast statycznej sekcji hero,
- wolne generowanie strony przez CMS,
- brak cache lub konflikt wtyczek cache,
- zewnętrzne skrypty blokujące renderowanie,
- zbyt duża liczba fontów i wariantów typografii.
INP - metryka, która obnaża przeciążone strony
INP zastąpił FID jako metryka responsywności w Core Web Vitals. W praktyce oznacza to większy nacisk na to, czy strona sprawnie reaguje na realne interakcje użytkownika, a nie tylko na pierwsze kliknięcie. Dla stron firmowych problemem bywają rozbudowane motywy, ciężkie kreatory wizualne, nadmiar efektów, widgety czatu, mapy, formularze i skrypty reklamowe ładowane na każdej podstronie.
CLS - mały wynik, duże zdenerwowanie użytkownika
Przesunięcia układu są szczególnie irytujące na telefonach. Użytkownik chce kliknąć numer telefonu, ale element przeskakuje. Chce wysłać formularz, ale pojawia się pasek zgody lub reklama. Chce przeczytać nagłówek, ale font przeładowuje się po chwili. Te problemy nie zawsze są kosztowne do naprawy, ale mocno wpływają na poczucie jakości.
| Objaw | Techniczna przyczyna | Naprawa |
|---|---|---|
| Obraz przesuwa treść po załadowaniu | brak wymiarów width/height lub aspect-ratio | rezerwacja miejsca dla grafiki |
| Nagłówek zmienia wysokość | font ładuje się późno | font-display, ograniczenie wariantów fontu |
| Baner cookies zasłania CTA | zły sposób osadzenia komponentu | test na mobile i stabilne miejsce komunikatu |
| Mapa lub widget przeskakuje | ładowanie zewnętrznego komponentu bez kontenera | ustalona wysokość kontenera lub lazy loading |
Optymalizacja techniczna bez pogorszenia marketingu
Nie każda poprawka szybkości jest dobra dla biznesu. Usunięcie formularza, mapy, galerii, czatu lub sekcji opinii może poprawić wynik testu, ale pogorszyć konwersję. Dlatego optymalizacja powinna być kontrolowana: najpierw mierzymy problem, potem zmieniamy konkretny element, a następnie sprawdzamy, czy strona nadal realizuje cel.
Najlepsze efekty daje połączenie trzech działań: odchudzenie szablonu, uporządkowanie obrazów i ograniczenie zbędnych skryptów. Dopiero później warto zajmować się drobnymi technikaliami, które poprawiają wynik, ale nie zmieniają doświadczenia użytkownika.
Wnioski dla MŚP
- Najpierw sprawdzaj podstrony, które generują ruch i zapytania.
- Nie optymalizuj wszystkich metryk naraz - ustal, czy problemem jest LCP, INP czy CLS.
- Analizuj mobile osobno, bo tam najczęściej powstają realne straty.
- Nie usuwaj elementów konwersyjnych tylko po to, aby podnieść wynik testu.
- Po zmianach porównuj dane, a nie tylko pojedynczy screenshot z narzędzia.