Coraz więcej osób zdaje sobie sprawę z tego, że szybkość ładowania się strony internetowej jest kluczowym elementem w procesie pozyskiwania nowych klientów. Nie chodzi tutaj wyłącznie o poprawę wskaźników SEO i optymalizację, ale również o zadowolenie użytkowników. Większość z nich nie czeka dłużej niż 2-3 sekundy, aż załaduje się interesująca ich strona internetowa. Zwiększenie szybkości ładowania się strony staje się coraz częściej głównym celem wielu ekspertów SEO. Tzw. lazy loading to jedna ze strategii, dzięki której można przyspieszyć ładowanie się strony internetowej. Dowiedz się, czym w teorii i praktyce jest lazy loading oraz w jaki sposób można zastosować go do polepszenia wskaźników rankingowych wyszukiwarki.
Co to jest lazy loading?
Lazy loading to tzw. leniwe lub powolne ładowanie. Być może brzmi to dla Ciebie dziwnie, że wolne ładowanie się strony internetowej może wpłynąć na poprawę jej ładowania się. Śpieszymy z wyjaśnieniem! Po otwarciu jakiejkolwiek strony internetowej, zapisuje ona dane w pamięci podręcznej i renderuje je na obraz, który masz zobaczyć. Zazwyczaj jednak, odwiedzający nie zostają na stronie wystarczająco długo, aby zapoznać się z całą jej treścią. Często interesuje ich jedynie krótki wycinek lub chcą przejrzeć konkretny produkt, bądź kategorię.
Lazy loading uniemożliwia ładowanie się za jednym razem całej treści na stronie, szczególnie mając na względzie obraz, grafiki, wykresy, itp. – czyli to, co najczęściej najbardziej spowalnia ładowanie się podstrony, nie tylko na urządzeniach mobilnych.
Dlaczego lazy loading ma znaczenie dla SEO?
Lazy loading może zarówno dobrze, jak i źle wpływać na wyniki SEO. Zależy od tego, w jaki sposób ta funkcjonalność zostanie wdrożona oraz jak widzi ją robot wyszukiwarki. Chociaż sama technologia zapewnia ogromne korzyści, to nie jest pozbawiona wad. Nieodpowiednie wdrożenie jej na stronie może spowodować, że GoogleBot nie zauważy części podstrony, która nie jest widoczna dla użytkowników. Uzna, że jej nie ma i tylko aktualnie renderowana część jest elementem strony, przez co np. treść z frazami kluczowymi nie zostanie pobrana. Google zaleca, aby np. wdrażać unikalne, odsyłające linki do każdej z części strony (rozpoznawalne najczęściej poprzez # w strukturze URL) tak, aby udostępnić całą jej widoczność wyszukiwarce. Jednym z polecanych skryptów do wdrażania lazy loading jest również Puppeteer wykorzystującą bibliotekę Node.js.
Największą zaletą lazy loading jest oczywiście szybkie ładowanie się strony dla użytkowników. Widoczna jest dla nich jedynie ta część, która ich interesuje, a oni sami mogą kontrolować wyświetlanie się poszczególnych partii. Ma to ogromny wpływ na lepsze pojmowanie domeny przez wyszukiwarkę względem UX (user experience). Może to przekładać się na poprawę wyników organicznych oraz dłuższy czas pozostawiania klientów na stronie (możesz to kontrolować analizując wskaźnik „średni czas trwania sesji” w Google Analytics). Jeśli ładowanie strony jest dużo opóźnione (czyli np. powyżej 4s), to wyszukiwarki mogą nie zaindeksować całej strony. Nie oznacza to jednak, że treść strony nie zostanie zaindeksowana w ogóle. Nie będzie ona traktowana przez robota Google priorytetowo, czyli może mieć problemy ze znalezieniem się w TOP10. Wspomniane wyżej linki odsyłające do poszczególnych części strony (zwłaszcza przy długich podstronach), ułatwią nie tylko indeksację w przypadku problemów z załadowaniem się części podstrony, ale pozwolą również dostać się do niej użytkownikom.
Skąd mam wiedzieć, że moja strona potrzebuje lazy loading?
Należy zaznaczyć, że nie każda strona wymaga wdrożenia lazy loading. Jeśli prowadzisz stronę informacyjną, np. usługową, z niewielką liczbą podstron, to najpewniej to rozwiązanie nie jest dla Ciebie. Najczęściej sprawdza się ono w przypadku domen posiadających dużą liczbę długich podstron z długimi treściami. Chodzi o te podstrony, które scrollują się w nieskończoność.
Duże znaczenie lazy loading ma również w przypadku treściwych, specjalistycznych artykułów na blogach, gdzie ważne jest szybkie dostanie się użytkownika do interesującej go części podstrony (gdzie znajdzie odpowiedź na pytanie zadane w Google). W takim przypadku linki odsyłające są szczególnie ważne. Większość użytkowników przyzwyczajona jest do szybkiego przyswajania informacji, co powinno rzutować na sposób budowy stron internetowych. Treść podzielona na krótkie i lakoniczne akapity, do których łatwo trafić, jest szczególnie ceniona w branży UX i odnosi coraz większe znaczenie w SEO.
Czym jest LCP i co ma wspólnego z lazy loading?
Pomocnym wskaźnikiem do analizy renderowania się strony jest LCP (Largest Contentful Paint). LCP to jedna z trzech danych dostępnych w Core Web Vitals (podstawowe wskaźniki internetowe). Określa, ile czasu potrzeba stronie na załadowanie się jej głównej części widocznej dla użytkownik. Mowa tu zarówno o treści, czyli tekście, ale również grafikach i innych multimediach. Za idealny czas uznaje się do 2,5s. ładowania. Najczęstszym wynikiem jest wynik od 2,5, do 4 sekund, co uznawane jest za poprawne. Oczywiście im większy czas ładowania się głównego, widocznego elementu strony (treści, co tutaj ma dość szerokie znaczenie, nie tylko tekst), tym większa szansa, że użytkownik tę stronę opuści.
Wskaźnik LCP możesz zmierzyć na stronie: https://pagespeed.web.dev/ oraz w Google Search Console. Dość często pojawiającymi się tam elementami do poprawy są ograniczenie liczby przekierowań (301), usunięcie niepotrzebnych JavaScript (szczególnie tych blokujących renderowanie), optymalizacja obrazów i filmów do szybkiego wyświetlania. Jeśli w treści natkniesz się na wskazówkę „Odłóż ładowanie obrazów poza ekranem”, jest duże prawdopodobieństwo, że Twoja witryna potrzebuje lazy loading. Zapoznaj się wtedy z oficjalnymi wskazówkami Google odnośnie wdrażania zmian w obrazach: https://web.dev/lazy-loading-images/.
Zanim zdecydujesz się wdrożyć lazy loading, koniecznie skonsultuj to z programistą oraz opiekunem SEO. Choć samo wdrożenie może wydawać się prostą rzeczą, to tak nie jest. Wymaga to ciągłej kontroli i sprawdzania efektów prac. Wszystko po to, aby nie dopuścić do sytuacji, w której robot Google przestanie odczytywać część treści.
Korzyści z wdrożenia lazy loading
Czas podsumować, jakie korzyści wynikają z efektywnego wdrożenia lazy loading na stronie, która tego potrzebuje.
- Lazy loading oszczędza przepustowość witryny, czas Twój, użytkowników oraz przeglądarki. Taka strona wymaga mniejszej ilości czasu na renderowanie, a poszczególne jej elementy ładują się dopiero wtedy, kiedy są potrzebne. Pozwala zmniejszyć obciążenie sieci (nie dopuszcza do transferu niepotrzebnych danych). Leniwe ładowanie pomaga zaspokoić potrzeby wszystkich odbiorców.
- Strona z wdrożonym lazy loading zachęca użytkowników do pozostania na niej dłużej, co jak wspomniano, możesz mierzyć w Google Analytics (średni czas trwania sesji). Dzięki temu skłonni oni są do pozostania na domenie i być może korzystania z niej w większym zakresie, przechodząc na inne podstrony i zwiększając liczbę podstron odwiedzonych podczas jednej sesji (to również dane dostępne na Google Analytics). Szyba strona oznacza również, że użytkownik na nią powróci w celu pozyskania informacji w przyszłości. Być może skorzysta również z newslettera lub formularza kontaktowego.
- Wdrożenie lazy loading przyspiesza czas ładowania się strony, a to wręcz bezdyskusyjne korzyści zarówno dla SEO, jak i UX. Leniwe ładowania sprawia, że użytkownik szybciej otrzymuje informacje. Wskazuje treści tylko wtedy, kiedy sobie tego życzymy, bez wyświetlania nam tego, co nas nie interesuje. Bardzo dużo zyskamy wdrażając lazy loading na podstronach, które zawierają wiele grafik lub zdjęć, gdzie szybkość ich ładowania się jest niemal zawsze obarczona większą mocą obliczeniową.
- Lazy loading poprawia wyświetlanie się strony na urządzeniach mobilnych, gdzie szczególnie ważna jest skondensowana forma treści, w szczególności grafik, zdjęć, itp. Na małym ekranie smartfona musi znaleźć się wyłącznie odpowiedź na zadane przez użytkownika pytanie.
Podsumowanie
Wdrożenie leniwego ładowania optymalizuje proces poruszania się po stronie użytkowników oraz samo wyświetlanie się podstron na komputerach i urządzeniach mobilnych. Lazy loading, a ogólniej mówiąc, szybkość ładowania się strony ma ogromny wpływ na postrzeganie domeny przez potencjalnych klientów. Pamiętaj, że strony internetowe również poddawane są… pierwszemu wrażeniu. Dlatego tak wiele zależy od tego, jak szybko użytkownik otrzyma interesujące go treści. Lazy loading ma na celu podanie odbiorcy odpowiedzi „na tacy”, przez co zachęci go to do dalszej eksploracji domeny. Zachowanie użytkowników na stronie ma ogromny wpływ na poszczególne wskaźniki oceny jakości strony przez Google. Co za tym idzie, również na wyniki organiczne. Już teraz sprawdź, czy Twoja witryna potrzebuje lazy loading!
Kasia Cieślik
Specjalistka ds. SEO