Pierwsze sekundy to być albo nie być dla budżetu. Zobacz, jak tempo ładowania przekłada się na utracone kliknięcia, porzucenia i realny przychód sklepu.
Jakub Wieczorek
2.09.2025
Sekundy, które decydują o sprzedaży
Wyobraź sobie Olę. Wraca autobusem z pracy, w jednej ręce zakupy, w drugiej telefon. Zobaczyła Twoją reklamę butów, klika. Mija sekunda. Druga. Trzecia. Przystanek zbliża się szybciej niż Twoja strona. Ola wysiada — a razem z nią wysiada złotówka, którą właśnie zapłaciłeś za klik. Tyle zostało z wizyty: nic. To nie anegdota, to statystyka.
Między 1 a 3 sekundami ładowania na telefonie ryzyko porzucenia rośnie o ok. 32% (dane Google/SOASTA). A im dłużej, tym gorzej. W praktyce oznacza to jedno: spowolnienie o „dwie sekundy tu, trzy tam” zamienia część Twojego budżetu reklamowego w dym.
O co tak naprawdę chodzi w „szybkości”?
Jeśli klient szybko widzi sens, by zostać, zostaje. Kluczowa jest chwila, gdy na ekranie pojawia się „to najważniejsze”: duże zdjęcie produktu, nagłówek oferty, cena.
To właśnie mierzy LCP (Largest Contentful Paint — czas do wyrenderowania największej części treści).
Im bliżej 1–2 sekund, tym lepiej. To moment „aha” — albo „do widzenia”.
Do tego dochodzi:
INP (Interaction to Next Paint — czas reakcji interfejsu): czy po tapnięciu coś dzieje się od razu.
CLS (Cumulative Layout Shift — stabilność układu): czy strona nie skacze, zanim zdążysz trafić w „Kup teraz”.
Te trzy wskaźniki (razem zwane Core Web Vitals, CWV) opisują, czy strona pokazuje treść szybko, odpowiada bez zadyszki i nie płata figli. Gdy są „zielone”, ludzie rzadziej uciekają i częściej kupują — to dokładnie ta sama historia, którą widzisz w wynikach sprzedaży.
„Przepalone” kliknięcia mają imiona i nazwiska
Weź swój budżet: płacisz za kliknięcia, bo wiesz, ile średnio zarabiasz na zamówieniu. Ale jeśli strona ładuje się za wolno w realnych warunkach (telefon, 4G, autobus), część klików nigdy nie zobaczy nawet zdjęcia produktu.
To nie są „straty techniczne”. To realne pieniądze, które miały zamienić się w koszyk, a zamieniły się w nic, bo LCP był po złej stronie sekundnika.
Co mówią liczby?
Google/SOASTA: z 1 do 3 sekund na mobile to ~32% większe ryzyko porzucenia.
Deloitte: skrócenie czasu o 0,1 s (tak, jedna dziesiąta) potrafi podnieść współczynnik konwersji – CR o ~8–10%.
Portent: strona ładująca się około 1 s ma nawet ~2,5× wyższy CR niż ta z 5 s (e-commerce).
Obejrzyj Mobile (ważniejsze) i Desktop – przełącz zakładki u góry.
LCP (największa treść) ≤ 3 s
CLS (stabilność układu) ≤ 0,1.
W w dalszej części raportu zwróć uwagę na listę konkretnych wskazówek, co spowalnia stronę
Przetestuj kluczowe widoki osobno: stronę główną, listing (stronę kategorii), stronę produktu – wyniki mogą się różnić.
Dlaczego to kluczowe?
Co miesiąc wydajesz 50 000 zł na reklamy na Facebooku. Średni CPC (koszt kliknięcia) to 2,00 zł, więc masz 25 000 kliknięć. Za kulisami dzieje się jednak to:
Mini-case: co daje szybsza strona przy tym samym budżecie
Założenia:
Bounce (czyli od razu wychodzący) = 60% → tylko 40% odwiedzających „wchodzi dalej”.
Wśród tych, którzy nie odbijają się, 5% kończy zakup (stała „efektywność” lejka).
AOV (średnia wartość koszyka) = 200 zł.
Przed poprawą szybkości:
Zakupy = 25 000 × (1 – 0,60) × 5% = 500.
CPA (koszt 1 zakupu) = 50 000 / 500 = 100 zł.
Przychód = 500 × 200 = 100 000 zł.
ROAS = 100 000 / 50 000 = 2,0×.
Po przyspieszeniu strony i spadku odrzuceń o 50%:
Zakupy = 25 000 × (1 – 0,30) × 5% = 875.
CPA = 50 000 / 875 ≈ 57 zł (–43% vs. 100 zł).
Przychód = 875 × 200 = 175 000 zł.
ROAS = 175 000 / 50 000 = 3,5×.
Ten sam budżet, ta sama kampania — różnica robi się na stronie. Mniej „uciekających” w pierwszych sekundach = taniej pozyskany zakup i więcej sprzedaży.
A co z SEO? (czyli „darmowy” ruch, który rośnie razem ze szybkością)
Szybkość jest czynnikiem rankingowym: Google ogłosił to dla desktopu już w 2010 r., a dla mobile w 2018 r. („Speed Update”). Innymi słowy, wolne strony mają pod górkę, a szybkie zyskują przewagę – oczywiście przy tej samej jakości treści i intencji zapytania.
Page experience pomaga „rdzeniowym” systemom rankingowym: Google pisze wprost, że ich główne systemy „nagradzają” dobrą jakość doświadczenia strony; nie chodzi o pojedynczy „system”, tylko zestaw sygnałów, w tym szybkość i Core Web Vitals. Od marca 2024 metryką responsywności w CWV jest INP (zastąpił FID). Dobre wyniki CWV nie gwarantują pierwszego miejsca, ale ułatwiają zdobycie widoczności i klików.
Szybsza strona to nie tylko tańszy zakup z reklam płatnych, ale też większa ekspozycja w wynikach organicznych — czyli więcej „bezpłatnego” ruchu, który dokłada się do ROAS i obniża średni koszt pozyskania klienta.
Dlaczego niektórzy bagatelizują tę kwestię?
Krótko: bo wielu dostawców e-commerce utknęło na starym kodzie (często 10+ lat). A jeśli nie da się realnie przyspieszyć, łatwiej powiedzieć, że „szybkość to detal”, niż przyznać, że platforma nie nadąża.
Stary kod ≠ nowe realia
Dzisiejszy ruch to mobile w drodze i Core Web Vitals, a wiele silników wciąż żyje w realiach sprzed dekady (ciężkie motywy, blokujące skrypty, „monolit” trudny do odchudzenia).
Taki fundament nie przyjmie współczesnych rozwiązań wydajnościowych w pełnej skali (m.in. priorytety zasobów, nowoczesne formaty obrazów, renderowanie bliżej użytkownika, „lekki” JS). Efekt? Sekundy zostają, więc narracja przesuwa uwagę w inne miejsca.
Gdy nie można wygrać prędkością, zmienia się temat
Marketingowa zasłona dymna: „u nas liczy się UX i funkcje, prędkość to kosmetyka”.
Mity z wygody: „to tylko dla gigantów”, „klienci i tak kupują”, „SEO to content i linki, nie sekundy”.
Priorytety na skróty: „najpierw nowe ficzery, wydajność później” — ale „później” w monolicie często nigdy nie nadchodzi.
Łatwiej sprzedać funkcję niż przepisywanie
Funkcja robi show — demo, slajd, dopisek w cenniku. Refaktoryzacja/rewrite jest „niewidoczna”, choć skraca sekundy ładowania.
Krótkie KPI > długi horyzont — rozliczamy „ile dowieźliśmy”, nie „o ile spadł dług” za 12–24 miesięcy.
Dziś upsell, jutro dług — funkcje dają pretekst do sprzedaży od razu; fundamenty to koszt teraz i efekt później. Skutek: dług rośnie, strona tyje, sekundy zostają, więc łatwiej bagatelizować szybkość niż ją realnie poprawić.
„U mnie działa” — złudzenie biurowego Wi-Fi
Testowanie na szybkim laptopie w biurze nie ma nic wspólnego z 4G w autobusie.
Stąd bierze się fałszywe poczucie, że „jest OK”, mimo że realni klienci nie doczekują treści.
Skutek: droższa sprzedaż, słabsze SEO
Zostają wysokie odrzucenia i rosnący CPA (koszt zakupu z reklam), a w wynikach organicznych wolne sklepy mają pod górkę.
Bagatelizowanie szybkości bywa więc nie opinią, tylko maską bezradności technologicznej.
Jeśli platforma nie potrafi w realnym ruchu zejść z czasem do pokazania kluczowej treści w okolice 2–3 s, problem nie leży w „czepialstwie o milisekundy”, tylko w architekturze, która nie umie już grać w dzisiejszej lidze.
Absolutne podstawy wydajności (must-have)
HTTP/3 (lub co najmniej HTTP/2)
Nowe protokoły eliminują wąskie gardła znane z HTTP/1.1 dzięki multiplexingowi – wiele plików pobieranych jest równolegle w jednym połączeniu. HTTP/3 (QUIC/UDP) lepiej znosi utraty pakietów i zmienną jakość sieci mobilnych, a wznowienie transferu jest szybsze. W praktyce: włącz HTTP/3 (ALPN h3, TLS 1.3) i pozostaw fallback do HTTP/2; przeglądarka wybierze optymalną ścieżkę.
Jak sprawdzić jaki protokół wspiera Twój sklep? Uruchom Dev Tools (F12 na Chrome), kolumna Protokół może byc ukryta, wtedy prawym na kolumny
Sprawdzanie protokołu połączenia
Lazy loading obrazów
Opóźnione ładowanie elementów spoza widoku przyspiesza pojawienie się pierwszego ekranu i redukuje transfer. Stosuj loading="lazy" dla wszystkich obrazów z wyjątkiem tego który pojawia się na samej górze przy wejściu na stronę. Zawsze deklaruj wymiary (width/height lub aspect-ratio), aby ograniczyć przesunięcia układu (CLS).
Jak sprawdzić czy wyświetlasz obrazki poprawnie? Kliknij prawym przyciskiem myszy na dowolny obrazek i Zbadaj element
Sprawdzanie czy jest lazy-loading dla obrazów
Osobne zdjęcia/wideo na mobile (responsywne media)
Zdefiniuj warianty rozdzielczości przez srcset, aby przeglądarka pobierała mniejszy plik na wąskich ekranach i większy na desktopie – bez dodatkowego JS.Możesz używać atrybutu media w , by kierować konkretne warianty na mobile. Materiały wideo przygotuj w dwóch rozdzielczościach, ustaw preload="none" i miniaturę (poster); automatyczne odtwarzanie tylko wtedy, gdy wnosi realną wartość.
Jak sprawdzić czy jest alternatywna wersja na mobile? Kliknij prawym przyciskiem myszy na dowolny obrazek i Zbadaj element
Sprawdzanie czy jest alternatywna wersja obrazu na mobile
Pamięć podręczna przeglądarki + niski TTFB
Statycznym zasobom nadawaj długi cache, np. Cache-Control: public, max-age=259200, i wersjonuj pliki (hash w nazwie), aby bezpiecznie je odświeżać. Dla HTML stosuj krótkie cache z walidacją (ETag). TTFB obniżysz przez utrzymanie połączeń (keep-alive) oraz sprawne SSR/SSG i backend (indeksy DB, ograniczenie zapytań).
Jak sprawdzić czy jest ETag? Uruchom Dev Tools (F12 na Chrome) i wybierz zakładkę Dokument, kliknij w pierwszy wynik
Sprawdzanie czy serwer wspiera ETag
Nowe formaty obrazów + SVG dla ikon
Automatyczna generacja WebP zapewnia 25–60% mniejsze pliki przy tej samej jakości. Serwuj nowoczesny format, a w razie braku wsparcia przeglądarki – fallback do JPG/PNG. Ikony dostarczaj jako SVG zamiast fontów ikon — są ostre na każdym DPI, ważą niewiele i nie blokują renderowania tekstu.
Jak sprawdzić czy jest wdrożone WebP? Kliknij prawym przyciskiem myszy na dowolny obrazek i Zbadaj element
Sprawdzanie czy jest wdrożone WebP
Jak podeszliśmy do sprawy w Selesto?
Po ośmiu latach obecności na rynku e-commerce postawiliśmy sobie pytanie: czy dalsze „łatanie” i poprawianie starego kodu wystarczy, aby sprostać współczesnym wymaganiom? Odpowiedź była jednoznaczna – nie. Dlatego zdecydowaliśmy się na krok odważny: zbudowaliśmy Selesto od nowa.
Od 14 sierpnia 2025 r. nasi klienci korzystają z zupełnie nowej platformy, zaprojektowanej według najnowszych standardów szybkości i stabilności. Fundamentem stała się architektura stworzona pod Core Web Vitals i responsywne technologie, które zapewniają błyskawiczne ładowanie i najwyższą jakość doświadczenia użytkownika – niezależnie od urządzenia czy sieci.
Dlaczego to było konieczne?
Stare silniki e-commerce, oparte na kodzie sprzed dekady, są coraz trudniejsze do utrzymania i optymalizacji. Można dodawać kolejne funkcje i nakładać „łatki”, ale fundament pozostaje wolny i ciężki. My wybraliśmy inną drogę: zamiast kompromisów postawiliśmy na czysty start i technologię, która z natury jest szybka.
Efekty, które widać w liczbach
Czas do kluczowej treści (LCP) skrócony do 1,8–2,2 s na mobile (p75).
Odrzucenia na wejściu spadły średnio o 30–40% w porównaniu z poprzednią wersją.
Konwersje wzrosły o 12–18%.
Koszt pozyskania zakupu (CPA) w kampaniach reklamowych spadł nawet o 25% przy tym samym budżecie.
Wyniki mówią same za siebie: inwestycja w pełne przepisanie platformy była w pełni uzasadniona. To nie tylko poprawa „metryk technicznych”, lecz przede wszystkim realny wzrost sprzedaży i efektywności działań marketingowych.
Co to oznacza dla właściciela sklepu?
Nowa wersja Selesto to platforma, która pozwala maksymalnie wykorzystać każdy klik z reklamy i każdy ruch organiczny. Strona wczytuje się szybciej, użytkownicy rzadziej rezygnują, a kampanie stają się bardziej opłacalne. To różnica między sklepem, który „traci na sekundach”, a sklepem, który rośnie, bo każda sekunda działa na jego korzyść.
Dlatego wierzymy, że przyszłość e-commerce należy do rozwiązań opartych na nowoczesnych fundamentach. W Selesto już je zbudowaliśmy — a sklepy, które z nami pracują, korzystają z tej przewagi każdego dnia.
