Co się właściwie zmieniło i dlaczego ma to znaczenie?
| W skrócie: Google oficjalnie zastąpiło FID metryką INP, która mierzy płynność interakcji w całej sesji, a nie tylko pierwsze kliknięcie. To duża zmiana dla sklepów, bowiem liczy się nie tylko szybki start, ale też brak „przycięć” podczas filtrowania, dodawania do koszyka czy checkoutu. Cel dla e-commerce: LCP ≤ 2,5 s, INP ≤ 200 ms, CLS < 0,1. |
INP vs FID – co to zmienia w praktyce?
W 2024 roku Google dokonało kluczowej zmiany w swoich Core Web Vitals, czyli zestawie wskaźników, które wpływają na pozycjonowanie strony. FID (First Input Delay) został całkowicie zastąpiony przez INP (Interaction to Next Paint).
FID mierzył opóźnienie tylko po pierwszej interakcji, natomiast INP ocenia całą responsywność, czyli jak szybko strona reaguje na interakcje użytkownika (kliknięcia, dotknięcia, użycie klawiatury) do kolejnego „paintu” (realnej odpowiedzi interfejsu). Dzięki temu lepiej oddaje doświadczenie klienta, zwłaszcza w kluczowych krokach zakupowych.
Wyobraź sobie, że klient wchodzi do twojego sklepu i klika pierwszy przycisk. FID sprawdzał, jak szybko strona zareagowała na to pierwsze kliknięcie. Wskaźnik ten ignorował jednak wszystko, co działo się później, nie pokazywał więc całego doświadczenia użytkownika. W efekcie mógł pokazać świetny wynik, podczas gdy dodawanie produktów do koszyka, zmiana wariantów czy wypełnianie formularza w ostatnim kroku zakupowym trwały zbyt długo.
INP – nowy szeryf w mieście
INP z kolei mierzy responsywność twojej strony przez całą sesję użytkownika. Każde kliknięcie, dotknięcie ekranu, wpisanie tekstu – wszystko się liczy.
Dla e-commerce to spora zmiana, bo teraz Google sprawdza:
- jak szybko reaguje przycisk „Dodaj do koszyka”,
- czy filtrowanie produktów działa płynnie,
- jak responsywny jest cały proces checkoutu,
- czy wybór opcji dostawy nie powoduje zawieszenia się strony.
Dlaczego to ma znaczenie?
Wysoki INP = tarcie w procesie zakupowym = spadki konwersji. Kiedy interakcje na stronie są powolne, klienci częściej porzucają koszyki, spada zaufanie do sklepu („czy moje zamówienie w ogóle przeszło?”) i rośnie frustracja podczas wypełniania formularzy.
Core Web Vitals są sygnałem rankingowym, więc szybsze, responsywne strony mają przewagę przy wynikach wyszukiwania i w indeksowaniu. Szybka i płynna obsługa buduje profesjonalny wizerunek, co zwiększa zaufanie do marki i wpływa na poprawę konwersji. Wyższa konwersja to z kolei niższy koszt pozyskania klienta.
Użytkownicy sklepów internetowych wchodzą w różne interakcje, więc, poza pierwszym kliknięciem, rozwijają też menu, zmieniają rozmiar lub kolor produktu, wpisują dane dostawy, klikają w koszyk lub filtrują produkty. Wszystkie te akcje muszą być płynne, aby zapewnić jak najlepsze doświadczenie klienta.
Google zauważyło, że strony z niskim INP (czyli szybsze w reakcjach) mają wyraźnie lepsze wskaźniki biznesowe: dłuższy czas na stronie, niższy współczynnik odrzuceń i więcej zakupów.
Jak zmierzyć INP swojego sklepu?
Google ustala jasne granice, wskazując, że „dobry” wynik, czyli kiedy użytkownik nie odczuwa opóźnienia, to INP poniżej 200 ms. To oznacza:
- płynne doświadczenie zakupowe,
- wyższy wskaźnik konwersji,
- lepsze pozycje w Google (Core Web Vitals to oficjalny czynnik rankingowy),
- niższe koszty reklam.
| Dobry INP (poniżej 200 ms): strona reaguje natychmiast,użytkownicy nie zauważają żadnych opóźnień, Google nagradza lepszym rankingiem. | Wymaga poprawy (200-500 ms): zauważalne opóźnienia, szczególnie na słabszych urządzeniach,może negatywnie wpływać na konwersję, Google może obniżać pozycje. | Słaby INP (powyżej 500 ms): frustrujące doświadczenie użytkownika,wysokie ryzyko porzucenia koszyka, kary w rankingu Google. |
Jakie jest ROI z optymalizacji INP?
Na podstawie analizowanych danych:
- Poprawa INP o 100 ms = wzrost konwersji o 1-2%.
- Redukcja INP poniżej 200 ms = nawet 8-10% wzrost konwersji w niektórych branżach.
- Dobry INP = wyższy Quality Score w Google Ads.
Dla sklepu z miesięcznymi obrotami 100 000 zł, poprawa konwersji o 2% to dodatkowe 24 000 zł rocznie. A to tylko wierzchołek góry lodowej.
Jakich narzędzi użyć do zmierzenia tego wyniku?
Sprawdzenie, czy twój sklep ma dobry wskaźnik INP jest proste i możesz to zrobić samodzielnie w kilku minut. Oto 3 najszybsze sposoby:
1. PageSpeed Insights (najprostszy i darmowy sposób)
Wklej URL swojej strony głównej (np. https://stronawwwtwojegosklepu.pl), strony kategorii/produktu i koszyka i kliknij Analizuj. Narzędzie pokaże:
- aktualny wynik INP,
- co konkretnie spowalnia interakcje,
- gotowe wskazówki optymalizacji.
Jak czytać wyniki?
- Zielony wynik (Good) – świetnie, nie musisz się martwić.
- Pomarańczowy (Needs improvement) – warto zoptymalizować.
- Czerwony (Poor) – użytkownicy mogą odczuwać opóźnienia.
Ważne: Sprawdź zarówno wersję mobilną jak i desktop. Skup się głównie na mobile, bo tam ruch w e-commerce jest największy i najbardziej wrażliwy na opóźnienia.
2. Google Search Console (jeśli masz podpięte)
Otwórz raport „Podstawowe wskaźniki internetowe” (Core Web Vitals). To dane z rzeczywistych wizyt klientów w twoim sklepie, a nie symulacje, dzięki którym sprawdzisz, ile URL-i ma problemy z INP, trendy w czasie oraz podział na urządzenia mobilne i desktop.
To najbardziej wiarygodne źródło i, jeśli tu coś świeci się na czerwono, użytkownicy naprawdę to odczuwają.
3. Lighthouse w Chrome (dla podglądu „na żywo”)
Otwórz swoją stronę w przeglądarce Chrome, następnie, po kliknięciu prawym przyciskiem, wybierz Zbadaj (Inspect) i przejdź do zakładki Lighthouse.
Uruchom test dla „Mobile” i sprawdź szczegółowe metryki i sugestie optymalizacji.
4. Web Vitals Extension – monitoring na bieżąco
Zainstaluj rozszerzenie Chrome „Web Vitals”. Pozwoli ci to na monitorowanie INP w czasie rzeczywistym podczas przeglądania swojego sklepu.
Jak sklepy radzą sobie z optymalizacją INP?
Jeden z naszych klientów, globalny sklep z produktami dla dzieci, borykał się z wolną stroną na platformie Shopify, opartą na Liquid. Jednym z głównych problemów był wysoki Total Blocking Time (TBT), czyli metryka bezpośrednio związana z INP.
Klient zdecydował się na migrację do headless commerce z Next.js oraz optymalizację JavaScript, implementację lazy loadingu dla obrazów produktów i przepisanie ciężkich skryptów na lżejsze wersje. W wyniku tych działań, ogólna wydajność w sklepie online wzrosła o 117%, TBT (który bezpośrednio przekłada się na INP) został zredukowany o 80%, a dodawanie produktów do koszyka i nawigacja między ich wariantami była znacznie bardziej płynna.
Czasem warto więc rozważyć większą zmianę technologiczną. Przejście na headless commerce w wielu przypadkach może poprawić INP. Czasem też problem tkwi w samej platformie (przestarzała technologia lub zbyt duża liczba wtyczek).
Co możesz zrobić w swoim sklepie online, aby poprawić INP?
1. Sprawdź Core Web Vitals
Uruchom PageSpeed Insights dla strony głównej i strony produktu (mobile i desktop). Skorzystaj z narzędzi wymienionych wyżej.
2. Wyłącz niepotrzebne wtyczki i aplikacje
Każda aplikacja w twoim sklepie dodaje swój JavaScript. Przejrzyj listę i zadaj sobie pytanie:
- Czy naprawdę potrzebuję 5 różnych chatbotów?
- Czy ten widget social media faktycznie generuje sprzedaż?
- Czy potrzebuję animacji śniegu w styczniu?
Wyłącz tymczasowo wszystkie „nice to have” aplikacje i zmierz INP. Zobaczysz różnicę!
3. Przetestuj checkout na telefonie
Zrób zakup testowy i sprawdź szybkość reakcji przy kliknięciu „Dodaj do koszyka” i „Zapłać”. Jesteś zadowolony z efektu?
4. Ogranicz pop-upy i nakładki
Pop-upy z newsletterem, exit-intent, powiadomienia o „ktoś właśnie kupił” – każdy z nich obciąża przeglądarkę.
Trzymaj się zasady: maksymalnie jeden pop-up na stronę. Najlepiej pokazywany z opóźnieniem, gdy strona już się załaduje.
5. Zoptymalizuj obrazy produktów
Ciężkie obrazy = wolne ładowanie = słaby INP podczas przewijania galerii. Upewnij się, że format obrazków i zdjęć na twojej stronie to WebP/AVIF. Jeśli nie, skorzystaj z dostępnych narzędzi do kompresji (sprawdź listę poniżej). Pomyśl też o wykorzystaniu lazy-loadingu dla obrazów poza ekranem.
Narzędzia do kompresji:
- TinyPNG / TinyJPG – darmowe narzędzie do 20 obrazów dziennie
- Squoosh.app – całkowicie darmowe narzędzie z intuicyjną obsługą i możliwością szybkiego porównania obrazów przed i po kompresji.
- Cloudinary – automatyczna optymalizacja (płatne, ale warte uwagi dla większych sklepów).
6. Uprość formularze
Upewnij się, że ograniczyłeś liczbę pól w formularzu do minimum – pozostaw wyłącznie pola niezbędne do ukończenia transakcji. Zadbaj też o wyświetlanie klientom jasnych etykiet i o walidację w czasie rzeczywistym.
7. Testuj przyrostowo
Nie rób wszystkiego jednocześnie. Implementuj jedną zmianę tygodniowo i sprawdzaj efekty. Przykładowy harmonogram:
- Tydzień 1: Wyłącz niepotrzebne aplikacje.
- Tydzień 2: Zoptymalizuj obrazy.
- Tydzień 3: Wdróż lazy loading.
- Tydzień 4: Przeanalizuj wyniki i zaplanuj kolejne kroki. Być może niezbędna będzie pomoc developerów (np. do usunięcia niepotrzebnych widgetów i tagów, opóźnienia ładowania niekrytycznych skryptów czy włączenia cachingu i CDN) i specjalistów od stron internetowych.
Ważne jest też regularne sprawdzanie danych. Podłącz Google Search Console (Core Web Vitals) i ustaw monitoring PageSpeed/Lighthouse w cyklu (np. co miesiąc). Po zoptymalizowaniu sklepu porównaj konwersje, współczynnik porzuceń koszyka i średni czas reakcji.
Szybkość, która sprzedaje
Jak widzisz, INP to wskaźnik, który bezpośrednio przekłada się na twoje przychody. Każda setna sekundy ma znaczenie. Dane pokazują, że:
- sklepy z INP < 200 ms mają średnio o 15-20% wyższe konwersje niż te z INP > 500 ms,
- Google faktycznie nagradza szybkie strony lepszymi pozycjami (sprawdzone na setkach przypadków),
- klienci nie mają cierpliwości – 53% porzuci stronę mobilną, jeśli interakcja trwa dłużej niż 3 sekundy.
Poprawa INP to bezpośrednia inwestycja w wyższe konwersje, lepsze pozycje w Google i mniejsze koszty reklamy.
Przekonuje cię to? Zacznij już dziś. Nawet małe kroki prowadzą do dużych rezultatów. Wyłączenie jednej niepotrzebnej aplikacji może poprawić INP o 50 ms. A to może być różnica między klientem, który kupi, a tym, który porzuci koszyk.