Jak zwiększyć szybkość strony? 8 elementów, na które musisz uważać

Użytkownicy są coraz bardziej niecierpliwi, a ich oczekiwania względem stron internetowych rosną. Oczekują, że strony będą ładowały się ekspresowo, niezależnie do połączenia sieciowego czy urządzenia. Optymalizacja czasu ładowania strony to dziś spore wyzwanie. Jak zwiększyć szybkość strony?

Co to jest czas ładowania strony?

Czas ładowania strony, to czas potrzebny do tego, aby załadować treści na stronie. Czasem stosuje się również wskaźnik Time to First Byte, który określa czas ładowania się strony do momentu załadowania pierwszego bajta informacji na stronie. Nie należy natomiast mylić pojęcia czasu ładowania strony z pojęciem szybkości strony, która to odnosi się do ładowania się strony w trakcie jednej sesji użytkownika. 

Jak zmierzyć czas ładowania strony?

Aby sprawdzić czas ładowania strony, możemy sięgnąć po bezpłatne i płatne narzędzia. Podstawowym narzędziem jest Google PageSpeed Insights. Możemy za jego pomocą przeanalizować wersję strony na urządzenia mobilne i na desktop. Co ważne, narzędzie uwzględnia wskaźniki Core Web Vitals. Innym popularnym narzędziem jest Pingdom, który dostarcza więcej wskaźników na temat czasu ładowania strony. Co ważne, narzędzia dostarczają wiedzy nie tylko ogólnie o stronie, ale o czasie ładowania każdego elementu strony. Dzięki temu łatwo namierzymy winowajców dłuższego ładowania strony i zaplanujemy optymalizację. Narzędzie Google wręcz sugeruje możliwości optymalizacyjne, ale oczywiście należy je przeanalizować i rozważyć, czy faktycznie dana optymalizacja byłaby opłacalna czasowo, względem możliwych korzyści.

Czy czas ładowania strony jest czynnikiem rankingowym?

Czas ładowania strony pojawia się często w kontekście technicznej optymalizacji witryny. Czy wpływa istotnie na pozycje w Google? Eksperci zgodnie twierdzą, że dobry czas ładowania się strony jest niezbędny. Jednak jeśli strona już ładuje się w akceptowalnym czasie (ocenionym w ten sposób przez narzędzia), dalsza optymalizacja czasu nie wpłynie znacząco na poprawę pozycji strony w wynikach wyszukiwania. Czy to oznacza, że można zaniedbać ten obszar w kontekście pozycjonowania? Nie, ponieważ z drugiej strony - długi czas ładowania może uniemożliwić wypracowanie dobrych efektów SEO. Tym samym nie możemy zaniechać takiej optymalizacji. Warto przyjąć, że bez wdrożenia innych działań optymalizacyjnych, poza optymalizacją czasu ładowania strony, nie uzyskamy wzrostu pozycji. To działanie należy traktować jako element strategii SEO. 

Czas ładowania strony stał się w ostatnim czasie jeszcze istotniejszy i trudniejszy w pozycjonowaniu z uwagi na update algorytmu Page Experience o wskaźniki Core Web Vitals. Google ocenia strony już nie tylko pod kątem czasu ładowania, ale sprawdza to szczegółowo z rozbiciem na takie wskaźniki jak:

• Largest Contentful Paint (LCP) - czas potrzebny do załadowania największego elementu na stronie
• First Input Delay (FID) - czas potrzebny na pierwszą reakcję strony na działanie użytkownika
• Cumulation Layout Shift (CLS) - czas ładowania strony do ostatecznego rozmieszczenia elementów

Taki podział znacznie utrudnia prace nad optymalizacją czasu ładowania strony, szczególnie, że część z nich zależy od jakości hostingu strony. Specjalista ds. pozycjonowania powinien więc współpracować tu z administratorem strony, sugerując np. zmianę hostingu na lepiej dostosowany do wymogów Google. Pierwotnie Google weryfikowało Core Web Vitals wyłącznie na urządzeniach mobilnych, obecnie robi to również dla wersji stron na desktop.

Dlaczego warto poprawić czas ładowania strony? Doświadczenia!

Warto jednak pamiętać, że celem pozycjonowania jest nie tylko uzyskanie wysokich pozycji strony w Google. Chcemy pozyskać ruch na stronę, który zakończy się konwersją. W związku z tym powinniśmy poważnie podejść do czasu ładowania strony, jako do czynnika, który znacząco wpływa na pozyskanie konwersji. Użytkownicy stron mają wyśrubowane oczekiwania i akceptują coraz krótsze czasy ładowania stron, obecnie mówi się o maksymalnie 2 sekundach. 

Nieustanna praca nad poprawą tego wskaźnika jest niezbędna, jeśli nie chcemy tracić pozyskanego na stronę ruchu. Każdy ułamek sekundy opóźnienia to większe ryzyko, że użytkownik zrezygnuje i odejdzie do jednej z setek konkurencyjnych stron. Dobry czas ładowania strony to dobre doświadczenia użytkownika. Czas ładowania strony to element optymalizacji UX. 

Wyzwaniem w tym obszarze na pewno jest fakt, że nie mamy wpływu na to, z jakiej sieci i urządzenia korzystają nasi użytkownicy. Możemy mieć rewelacyjne wyniki czasu ładowania strony, ale użytkownik będzie niezadowolony, bo akurat ma słabszy zasięg i strona ładuje się wolniej. Tym bardziej powinniśmy dążyć do tego, aby nawet w tak trudnych warunkach dostarczyć użytkownikom pozytywne doświadczenia ze stroną. Można rozważyć wersję mobilną strony, która będzie zawierała mniej obciążających elementów, będzie uproszczona i tym samym załaduje się szybciej. Takie rozwiązanie wskazane jest szczególnie dla stron, które mają spełnić określoną funkcję, np. strona z rozkładem jazdy. Gdy czekam na przystanku, nie zależy mi na grafikach, bogatych treściach, tylko na jak najszybszym załadowaniu się strony z rozkładem jazdy. Niektóre strony dają również wybór użytkownikom, czy chcą widzieć pełną wersję, czy uproszczoną, ale mimo to dostarczającą niezbędne informacje czy funkcje. 

Co opóźnia Twoją stronę www?

Wiemy już, że czas ładowania strony jest istotny zarówno w pozycjonowaniu, jak i w pozyskiwaniu konwersji. Gdy mówimy o problemach z czasem ładowania strony, zawsze warto rozpocząć od weryfikacji hostingu. Największe opóźnienia mogą wynikać właśnie z niskiej przepustowości lub technologii stosowanych przez hostingodawcę. Gdy masz pewność, że to nie serwer wpływa na zły czas ładowania się strony, warto przyjrzeć się temu, co mamy na stronie i jak jest zbudowana. Czynniki, które mogą ją obciążać to m.in.:

Duże pliki graficzne

Niektóre strony automatycznie zmniejszają pliki graficzne i tym punktem nie trzeba się martwić. Jednak dobrą praktyką jest optymalizacja plików graficznych, zarówno w kwestii wielkości, jak i typu pliku. Nie chodzi o to, by dodawać jak najmniejsze zdjęcia. Szczególnie w sklepach internetowych możliwość powiększania zdjęcia produktów do uzyskania szczegółów jest bardzo ważna. Jeśli dodasz tylko miniaturowe zdjęcie, uzyskasz korzyść dla ładowania się strony, ale przy tym utrudnisz podjęcie decyzji zakupowej użytkownikom. Warto przetestować różne rozmiary zdjęć i sprawdzać, czy nie spowalniają znacząco czasu ładowania się strony. Nie ma tu uniwersalnej porady, jednak możesz spróbować np. od zdjęć o wielkości 2000px i w razie potrzeby je zmniejszać lub zwiększać. 

W tym punkcie ważny jest również typ plików graficznych. Google sugeruje wybór nowoczesnych formatów, dostosowanych do internetu. Dzięki temu pliki graficznie są maksymalnie skompresowane bez znaczącej utraty jakości. Są to takie formaty jak WebP i HEIC. Dobrym wyborem jest też JPG. Jeśli nie potrzebujesz przezroczystości na grafice, wybieraj PNG lub SVG dla grafiki wektorowej.

Pliki video 

Podobnie jak zdjęcia - pliki video należy maksymalnie skompresować, aby nie spowalniały strony. Szczególnym typem pliku video na stronie są filmy osadzone w tle, których odtwarzanie jest zapętlone. Może to mocno spowalniać stronę, więc jeśli decydujesz się na takie rozwiązanie, lepiej ustaw zatrzymanie filmu po pewnym czasie od uruchomienia strony.

Najbezpieczniejszym rozwiązaniem w kwestii filmów na stronie jest osadzenie ich z YouTube’a, Vimeo czy innego zewnętrznego serwera. Automatycznie zmniejszy to wielkość całej strony, co również ma duże znaczenie.

Personalizowane fonty

Efekty starannie dobranych fontów na stronę mogą przepaść, jeśli w nieprawidłowy sposób przygotujesz pliki z fontami. Błędy w plikach powodują nie tylko nieprawidłowe ładowanie się samego fontu, ale również opóźnienia w ładowaniu całej strony. Upewnij się więc, że używasz odpowiedniego dla internetu formatu (zalecany obecnie to woff i woff2). Aby duży plik z fontami zajmował jak najmniej miejsca, pakuje się go w skompresowanym folderze gzip. Stosuj w kodzie atrybut rel=”preload” as=”font”, dzięki czemu przeglądarka priorytetowo ładuje fonty na stronie. Dobrym pomysłem jest też wskazanie w kodzie, aby przeglądarka nie pobierała fontu, jeśli użytkownik ma u siebie na urządzeniu już zainstalowany taki font.

Duża liczba przekierowań na stronie

Przekierowania wewnętrzne są przydatne, ale mogą pogorszyć czas ładowania strony. Za każdym razem, gdy użytkownik jest przekierowywany, przeglądarka musi odczytać zarówno stronę przekierowaną, jak i przekierowującą. Bywa, że i na tym nie kończy się ścieżka przekierowań. Zbyt rozbudowana i skomplikowana sieć wewnętrznych przekierowań negatywnie wpływa na czas ładowania się strony. Warto co jakiś czas przeprowadzić audyt przekierowań i zniwelować niepotrzebne lub łańcuchy przekierowań. 

Bałagan w kodzie strony

Kod strony, który zawiera niepotrzebne elementy, również wydłuża czas ładowania strony. Każdy dodatkowy, zbędny element, musi być odczytany przez przeglądarkę, a to zajmuje czas. Warto wprowadzić minifikację kodu, czyli zmniejszenie kodu poprzez usunięcie zbędnych elementów. Często dotyczy to usuwania pustych wersów, komentarzy programistów, nadmiarowych znaków czy też podziału wierszy. Narzędzia pozwalają też wykryć ewentualne duplikacje w kodzie i usunąć je automatycznie. Minifikacja dotyczy m.in. plików HTML, CSS czy też JavaScript.

Niepotrzebne skrypty

Nie tylko nieuporządkowany skrypt spowalnia stronę. Szczególnie właściciele stron zbudowanych na CMS-ach, które zakładają używanie wtyczek i rozszerzeń, mogą ryzykować sporymi spowolnieniami. W ferworze “ulepszania” strony chętnie instalujemy kolejne wtyczki, ale po czasie nie weryfikujemy, czy są nam potrzebne, czy nadal działają poprawnie i czy są aktualne. Każdy nieużywany, zbędny skrypt na stronie obciąża ją. Warto co jakiś czas zaplanować przejrzenie takich skryptów i usunięcie tych, które nie są potrzebne. 

Duża liczba reklam

Szczególnym typem skryptów zewnętrznych na stronie są reklamy. Za duża liczba reklam obciąży stronę. W raporcie Ad Lightning czytamy, że reklamy na stronie niemal dwa razy wydłużają czas ładowania, przy tym wiele jest źle zaprojektowanych, ładuje się niepoprawnie i dodatkowo wpływa na wiarygodność witryny. Zaleca się, aby reklama nie przekraczała wielkości 300KB, jednak jak pokazują analizy reklam, nie zawsze się tego przestrzega. Wina leży zwykle w samych systemach reklamowych, które nie egekwują prawidłowo wymaganej maksymalnej wielkości reklam. Skutek? Obciążona strona docelowa i złe doświadczenia użytkowników.

Brak cachingu

Caching, czyli pamięć podręczna, to zapisywanie kopii strony w przeglądarce użytkownika, a mówiąc dokładniej - przeglądarka korzysta z zasobów dysku twardego Twojego komputera. Dzięki temu strona nie musi ładować się od zera, gdy odwiedzamy ją ponownie. Programista powinien ustawić odpowiednio cache na stronie, tzn. zdefiniować, jakie elementy strony (zdjęcia, pliki), mają być zapisywane w pamięci podręcznej. Cache można zastosować wobec takich plików jak favicony o rozszerzeniu ico, pliki js, CSS, HTML i oczywiście pliki graficzne. 

Podsumowanie

Czas ładowania stron zawsze był istotnym czynnikiem, który wpływał zarówno na pozycjonowanie, jak i na pozyskiwanie konwersji na stronie. Z roku na rok jednak jego waga rośnie, co pokazuje m.in. wdrożenie zmian w algorytmie Google PageExperience i wprowadzenie wskaźników Core Web Vitals. Właściciele stron stoją przed wyzwaniem nieustannej optymalizacji stron pod względem czasu ładowania, jeśli chcą zatrzymać u siebie użytkowników i wyprzedzić konkurencję. 

Inni przeczytali także:

Działania, które przyspieszą prędkość ładowania Twojej strony internetowej
9 technicznych problemów, których naprawa poprawi wyniki strony www
Optymalizacja techniczna strony krok po kroku
Jak stworzyć mapę strony? Sprawdź, co musisz wiedzieć o sitemap