Obecnie internet towarzyszy nam niemalże w każdej minucie życia. Nieustannie jesteśmy podłączeni do sieci, każdego dnia odwiedzamy różne strony internetowe, a także bezpośrednio w wyszukiwarce próbujemy znaleźć odpowiedź na nurtujące nas pytania.
Czy w takim natłoku informacji mamy czas czekać na zawartość strony, która zbyt długo się ładuje? Raczej szybko zmienimy ją na kolejną pozycję z wyszukiwarki, niż poczekamy na załadowanie wszystkich jej elementów. Takie podejście ma praktycznie każdy użytkownik internetu, co bezpośrednio prezentują dane dostarczane przez Google – jeśli strona ładuje się dłużej, niż 5 sekund, to spadki konwersji mogą sięgnąć nawet kilkudziesięciu procent!
Dlaczego strona długo się ładuje?
Powodów zbyt długiego ładowania strony może być naprawdę wiele. W zależności od tego, jak jest zbudowana i z czego składają się jej poszczególne elementy, możemy wyróżnić kilka szczególnie istotnych czynników, mogących wydłużyć czas ładowania strony. Są to między innymi:
- Zbyt duża waga zamieszczonych na stronie dodatkowych elementów – grafik, animacji, filmów czy plików audio. Warto pamiętać, że zamieszczone na stronie zdjęcia lub inne obrazy powinny być odpowiednio zoptymalizowane, aby ich waga nie przekraczała kilkuset kB.
Nieoptymalny kod witryny także ma wpływ na prędkość jej działania. W sytuacji, gdy strona na początku ładowania będzie musiała wykonać wiele skryptów JavaScript, w znacznym stopniu może wydłużyć się czas jej otwierania. - Zbyt wiele zainstalowanych i uruchomionych wtyczek w stronach opartych o systemy CMS – na przykład WordPress. Dzięki wtyczkom z tysiącami różnych funkcjonalności praca właścicieli stron, administratorów i webmasterów jest znacznie prostsza. Należy jednak pamiętać, że ich liczba powinna być ograniczona do niezbędnego minimum. Każda z uruchomionych wtyczek wiąże się z wykonywaniem pewnych operacji, których zbyt duża ilość także wpływa na szybkość ładowania zawartości dla użytkownika.
To trzy najczęściej spotykane problemy, których efektem jest zbyt długie ładowanie strony internetowej. Oczywiście istnieją także inne sytuacje – słaby, wolny i niestabilny serwer, działanie złośliwego oprogramowania, czy wolne łącze internetowe użytkownika. Jednak zdarzają się one znacznie rzadziej lub zupełnie nie mamy na nie wpływu.
Jak sobie radzić z powolnym ładowaniem strony na WordPress? Co daje nam Lazy Load?
W celu przyspieszenia procesu ładowania strony dla użytkownika należy przede wszystkim zadbać o dwie najważniejsze kwestie – optymalizację strony i wybór dobrej jakości serwera.
Optymalizacja strony może polegać na podmianie grafik na ich skompresowane wersje o znacznie mniejszej wadze. Oczywiście delikatnie ucierpi ich jakość, ale w przypadku strony internetowej nie jest to duży problem. W przypadku konieczności dostarczenia grafiki w wysokiej rozdzielczości pomocna może okazać się funkcjonalność, która umożliwi załadowanie pełnego obrazu dopiero po kliknięciu konkretnego odnośnika.
Warto sprawdzić, czy możliwe jest usunięcie pewnych elementów kodu JavaScript, który wywoływany jest w trakcie ładowania strony. Jeśli istnieje taka ewentualność, to należy zrezygnować z wszelkich zbędnych dodatków i pozostawić wyłącznie te skrypty, które są niezbędne do poprawnego funkcjonowania strony. Dodatkowym elementem, poprawiającym prędkość ładowania może być przeniesienie przynajmniej części skryptów JavaScript na sam koniec kodu strony.
W przypadku korzystania z rozwiązań typu WordPress lub podobnych należy zweryfikować listę aktywnych wtyczek. Często okazuje się, że w tle uruchomionych jest wiele dodatkowych wtyczek, które nie spełniają żadnej istotnej funkcji na stronie. Warto wszystkie niepotrzebne wyłączyć, a następnie sprawdzić, czy nie da się w jeszcze większym stopniu ograniczyć ich liczby – na przykład przez zainstalowanie jednej, lepiej zoptymalizowanej większej wtyczki, która swoją funkcjonalnością może zastąpić 3 aktywne na stronie.
Zobacz też: audyt strony internetowej przed optymalizacją
Optymalizacja na wyższym poziomie – LAZY LOADING
Zdarza się, że bardzo rozbudowane strony nawet po odpowiedniej podstawowej optymalizacji budowy, zawartości i działających wtyczek, ładują się stosunkowo długo. W takim przypadku konieczne jest zastosowanie dodatkowych sposobów, których zadaniem jest maksymalne skrócenie czasu oczekiwania na pojawienie się zawartości strony.
Doskonałą odpowiedzią w takim przypadku okazuje się metoda zwana lazy loading. Wbrew temu, co może sugerować nazwa, lazy loading przyspiesza ładowanie standardowej zawartości strony. Jest to specjalny skrypt, który zaimplementowany na stronie pozwala na pewną fragmentację ładowanych treści.
Działanie skryptu polega na tym, że ciężkie obrazy i pliki wideo nie są ładowane w momencie otworzenia strony przez użytkownika, a dopiero w chwili, gdy dotrze do miejsca na stronie, w którym znajdują się wspomniane zdjęcia lub filmy. Dzięki temu początkowa treść pojawia się błyskawicznie, a kolejne elementy są stopniowo ładowane w trakcie przeglądania witryny.
Lazy load okiem użytkownika
Warto podkreślić, że implementacja lazy loading nie wpływa negatywnie na wrażenia z użytkowania strony internetowej, a wręcz przeciwnie!
Użytkownicy nieporównywalnie szybciej otrzymują wgląd w początkową zawartość strony internetowej, więc mogą niemal natychmiast zająć się szukaniem interesujących ich treści. Zupełnie nie odczuwają tego, że wraz z przeglądaniem strony ładowane są kolejne jej elementy – wszystko przebiega szybko i sprawnie.
Co więcej – często użytkownicy po prostu nie docierają do miejsca, w którym znajdują się obrazy czy pliki wideo. Przecież nie zawsze oglądamy stronę od nagłówka, aż po stopkę, więc nie ma konieczności, aby wszystkie dane były pobierane na samym początku.
Lazy loading to także sprzymierzeniec przeglądania internetu z ograniczonym transferem danych. Dotyczy to w szczególności urządzeń mobilnych, ale nie tylko. Dzięki lazy loading pobierana jest wyłącznie niezbędna pula danych, umożliwiająca wyświetlenie aktualnie przeglądanego fragmentu witryny.
Lazy loading – wpływ na SEO
Każdy, kto ma choćby najmniejsze pojęcie o pozycjonowaniu stron internetowych, doskonale wie, że prędkość ładowania witryny jest jednym z kluczowych czynników rankingowych, który widnieje w oficjalnych wytycznych Google.
Bazując na takiej wiedzy, można bez obaw stwierdzić, że implementacja lazy loading w wielu przypadkach bezpośrednio wpływa na uzyskiwanie wyniki w wyszukiwarce. Również zachowanie użytkowników po uruchomieniu lazy loading na stronie poprawia pozycję witryny. Dzięki szybszemu działaniu serwisu zmniejsza się współczynnik odrzuceń, a internauci korzystają ze strony chętniej i dłużej. Dla Google jest to bezpośrednim znakiem tego, że znajdują się tam wartościowe i użyteczne informacje, które warto wyświetlać na początku wyników wyszukiwania.
Jednak implementacja lazy loading niesie za sobą pewne minusy, które mogą mieć wpływ na SEO. To przede wszystkim dwie podstawowe kwestie:
- Jest to dodatkowy skrypt, który musi zostać uruchomiony w momencie wejścia na stronę.
- Nie wszystkie roboty wyszukiwarek mogą poradzić sobie z odpowiednim indeksowaniem treści, które są pobierane w trakcie korzystania z serwisu.
Należy jednak pamiętać, że załadowanie i wykonanie pojedynczego skryptu w większości przypadków będzie o wiele krótsze, niż pobieranie wszystkich zamieszczonych na stronie grafik i plików wideo, więc ostatecznie tak czy siak „wyjdziemy na plus”.
Kwestia indeksowania przez roboty nie jest do końca wyjaśniona. Na pewno wiadomo, że najlepiej indeksowane są strony oparte o prosty, czysty i czytelny kod HTML. Wtedy roboty bez problemu skanują całą zawartość strony.
Witryna z zaimplementowanym lazy loading działa na odrobinę innej zasadzie i to może generować pewne problemy z indeksowaniem grafik lub plików wideo. Nie należy jednak zbytnio się martwić – znaczna część robotów (w tym roboty Google) z powodzeniem indeksuje większość treści na wszystkich stronach internetowych. Lazy loading jest rozwiązaniem tak powszechnie stosowanym, że największe wyszukiwarki dostosowały działanie swoich botów do indeksowania zawartości stron z taką funkcjonalnością.
Czy warto zaimplementować lazy loading na każdej stronie internetowej?
Lazy loading nie jest idealnym rozwiązaniem i z pewnością nie należy go stosować na wszystkich stronach internetowych. W wielu przypadkach okazuje się naprawdę świetną metodą, ale innym razem jego wykorzystanie nie jest optymalne.
Lazy loading nie warto implementować na stronach o stosunkowo prostej budowie, które nie mają wielu dodatkowych elementów w postaci ciężkich grafik lub plików wideo. W takim przypadku znacznie korzystniejszym rozwiązaniem okazuje się porządna, standardowa optymalizacja budowy strony. W taki sposób można uzyskać efekty lepsze niż z wykorzystaniem dodatkowego skryptu.
Z kolei na witrynach rozbudowanych, bogatych w zdjęcia, animacje i pliki wideo, lazy loading niejednokrotnie okazuje się jedynym słusznym rozwiązaniem. W przypadku bardzo rozbudowanej i ciężkiej strony standardowa optymalizacja może nie przynieść oczekiwanych rezultatów. Warto jednak zawsze w pierwszej kolejności skupić się na poprawie budowy i działania strony, a dopiero później korzystać z rozwiązań typu lazy loading.
Jak wdrożyć lazy loading na stronie internetowej?
Jak już wspominałem, lazy loading to skrypt, który warunkuje sposób działania strony. Metod jego implementacji jest kilka:
- Wprowadzenie zmian w kodzie strony przez programistę;
- Wykorzystanie gotowych pluginów JavaScript;
- Użycie gotowych wtyczek w przypadku stron zbudowanych na CMS typu WordPress -> https://pl.wordpress.org/plugins/search/Lazy+load/.
Oczywiście pierwszy z wymienionych sposobów jest „najlżejszy” i zapewnia najlepsze efekty, ponieważ w najmniejszym stopniu obciąża stronę, ale to dwa kolejne podpunkty wskazują na najprostszy i najwygodniejszy sposób implementacji lazy loading na większości stron internetowych, który również spełnia wszelkie założenia i przynosi odpowiednie rezultaty. audio. Warto pamiętać, że zamieszczone na stronie zdjęcia lub inne obrazy powinny być odpowiednio zoptymalizowane, aby ich waga nie przekraczała kilkuset kB.