Paginacja czy infinite scroll – co wybrać?

blog-banner-bee

Odwiedzający Twoją stronę oczekują świetnej nawigacji. Chcą szybko i w najprostszy możliwy sposób znaleźć to, co ich interesuje. Jak sprostać tym oczekiwaniom? Jednym z ważnych elementów jest właściwy sposób ładowania contentu oraz jego odpowiednia organizacja. Dwa główne rozwiązania w tym aspekcie to infinite scroll oraz paginacja (inaczej stronicowanie). W tym artykule dowiesz się, na czym polegają obie techniki, jakie są ich wady i zalety oraz na które z nich się zdecydować.

Paginacja czy infinite scrolle - co wybrać?

Paginacja strony internetowej – czym jest?

Paginacja polega na dzieleniu zawartości witryny internetowej na mniejsze podstrony. Użytkownicy mogą klikać na poszczególne linki, które przenoszą ich do zwykle określonej kategorii contentu. Czasami treści danego typu jest sporo, więc zostają one podzielone pomiędzy następującymi po sobie odsłonami określonymi kolejnymi liczbami. Stronicowanie to w praktyce domyślna i najczęściej używana forma organizacji contentu. Wykorzystywana jest ona choćby w głównych wynikach wyszukiwania Google, gdyż kolejne zestawy linków są podzielone na następujące po sobie strony:

Paginacja na przykładzie Google'a

Większość blogów stosuje paginację w celu organizacji contentu:

Stronicowanie - przykład

Treści oczywiście nie muszą być dzielone wedle konkretnej numeracji – da się także to robić za pomocą intuicyjnych kategorii:

Paginacja według kategorii

Jeśli chodzi o techniczne szczegóły, to paginacja na stronie internetowej może być obsługiwana przez klienta lub serwer. W pierwszym przypadku zawartość każdej strony znajduje się w kodzie źródłowym HTML, który jest wstępnie załadowywany. Z kolei paginacja po stronie serwera wyprowadza żądania do każdej podstrony indywidualnie podczas przeglądania kolejnego contentu. Takie rozwiązanie jest bardziej czasochłonne, jednak gdy już zostanie wprowadzone, pozwala na swobodną obsługę nawet dużych zbiorów informacji. Stronicowanie po stronie klienta może być z kolei używane w przypadku małej ilości rekordów, gdy dostępność ich wszystkich w jednym czasie nie stanowi problemu.

Infinite scroll – czym jest?

Infinite scroll (nieskończone przewijanie) to technika UX, w przypadku której nowy content jest stale załadowywany, gdy użytkownik dojdzie do końca strony. W efekcie otrzymujemy podstronę, której zawartość w zasadzie nigdy się nie kończy. Oczywiście rozwiązanie to ma swoje limity i z czasem da się dojść do krańca stale załadowywanych treści, jednak w praktyce osiągnięcie tego punktu jest bardzo czasochłonne. Z nieskończonym przewijaniem można spotkać się zwykle w przypadku stron, których użytkownicy nie szukają czegoś bardzo konkretnego, lecz raczej chcą przeglądać stały strumień ogólnie interesującego ich contentu. Z tego powodu infinite scroll jest używany na platformach społecznościowych jak Facebook, Twitter, Instagram, czy serwisach, które gromadzą głównie treści audio/video. Przykładem są tutaj banki zdjęć jak Unsplash czy strony z memami typu 9gag.

Infinite scroll

źródło: guides.codepath.com

Jak widać na powyższym przykładzie przewijanie contentu sprawia, że stale załadowują się nowe treści. Odzwierciedlone jest to w tym, że suwak stale „przeskakuje” do góry. Z technicznego punktu widzenia infinite scrolling wykorzystuje lazy loading – strona nie załadowuje treści, które nie są jeszcze widoczne dla użytkownika. Gdy odwiedzający przejdzie do odpowiedniego punktu (czyli samego dołu strony), dopiero wtedy następuje ich doczytanie. Skoro już wytłumaczyliśmy sobie oba pojęcia, czas przeanalizować, z jakimi wadami i zaletami wiążą się omawiane rozwiązania.

Paginacja – zalety

Przyjrzyjmy się temu, jakie korzyści z punktu widzenia UX oraz SEO daje paginacja.

  1. Lepsza konwersja

    Aby maksymalnie zwiększyć szanse konwersji, należy ułatwić odwiedzającym szybkie znalezienie dokładnie tego, czego potrzebują. Jeśli potencjalny klient zacznie spędzać zbyt dużo czasu na zwykłym przeglądaniu oferty, z czasem zapewne nie zdecyduje się na nic.

  2. Dokładna kontrola nad wyglądem strony

    Gdy zawartość każdej strony jest odgórnie zaplanowana, łatwiej zapanować nad tym, jak się prezentuje. Jeśli content ciągle dynamicznie się ładuje, umiejscowienie stopki, banerów itp. może ulec niekontrolowanym zmianom, które negatywnie wpłyną na user experience.

  3. Możliwość dokładnego śledzenia danego contentu

    Jeśli treści są organizowane za pomocą stronicowania, odwiedzający jest w stanie lepiej kontrolować, jak wchodzi z nimi w interakcje. Przykładowo w wynikach wyszukiwania Google odwiedzone niedawno linki zmieniają swój kolor, dzięki czemu użytkownik jest w stanie szybko ustalić, czy już zapoznał się z tym contentem. Treści podzielone na konkretne podstrony można także zaznaczyć zakładką, dzięki czemu da się do nich szybko powrócić. Trudno o taką kontrolę, jeśli mowa o contencie, który stale dynamicznie się załadowuje, co ma miejsce właśnie w przypadku nieskończonego przewijania.

  4. Łatwiejsza implementacja

    Jak wspomniano wcześniej, paginacja treści to domyślny i dlatego najpopularniejszy sposób na organizację treści. Dzięki temu właściwie każdy website builder, CMS czy platforma do blogowania wspierają taką strukturę contentu.

Paginacja – wady

Paginacja ma oczywiście swoje wady. Niektóre z nich mogą jednak wynikać z błędnej implementacji tego rozwiązania, dlatego warto bliżej przyjrzeć się tym kwestiom.

  1. Ewentualne problemy z crawlingiem i jakością linków

    Pamiętaj, aby w przypadku stronicowania nie dzielić swojego contentu na zbyt dużą liczbę małych podstron, gdyż może to prowadzić do problemów z SEO. Dzieje się tak, gdyż dla każdej witryny Google ustala limit ilości skanowanych i indeksowanych treści. Jeśli paginacja jest zastosowana w zbyt obszerny sposób, wyszukiwarka może wyczerpać swoje zasoby na licznych pośrednich stronach organizacyjnych i nawigacyjnych. W rezultacie pominie te podstrony, które zawierają jakościowy content skierowany do docelowego użytkownika.

    Oprócz tego w wyniku źle zastosowanej paginacji content staje się podzielony na małe kawałki, co sprawia, że jest on zbyt „odchudzony”, czyli niskiej jakości. Oprócz tego pogarsza się także tzw. link juice, czyli siła linkowania, która jest rozdzielana między kolejne liczne odnośniki. O taki stan rzeczy łatwo w przypadku blogów czy innych serwisów stawiających nacisk na content, z którym użytkownik ma wchodzić w aktywne interakcje. Niektóre strony dzielą jeden artykuł na kilka części. Przechodzenie między nimi wymaga użycia elementu nawigacyjnego np. przycisku „Dalej”. Co prawda generuje to kliknięcie na stronie, czyli oznakę zaangażowania, jednak z powyżej omówionych powodów należy podchodzić ostrożnie do takich praktyk.

  2. Gorsza interaktywność w przypadku mobile

    Na urządzeniach mobilnych przewijanie przychodzi bardziej naturalnie niż kliknięcia. Z racji mniejszego ekranu trafienie na konkretny przycisk czasami może sprawiać użytkownikom problemy, co oczywiście negatywnie wpływa na user experience.

Infinite scroll – zalety

Przyjrzyjmy się temu, jakie korzyści z punktu widzenia UX oraz SEO daje nieskończone przewijanie.

  1. Płynność

    Infinite scroll nie wymaga klikania w celu załadowania nowych treści, dzięki czemu przewijanie staje się płynnym, nieprzerywanym procesem, co w konkretnych sytuacjach znacznie poprawia user experience na stronach internetowych.

  2. Lepsza interaktywność w przypadku mobile'a

    Urządzenia mobilne są stworzone tak, aby przewijanie treści było na nich maksymalnie łatwe. Infinite scroll przenosi ten proces na jeszcze wyższy poziom, dzięki czemu użytkownicy często nie mogą się oderwać od stale załadowującego się contentu.

  3. Atrakcyjność wizualna

    Niekończący się ciąg interesujących obrazków ma pewien urok. Przy dobrym zaplanowaniu designu i wykorzystaniu odpowiednich technik, jak na przykład przewijanie paralaktyczne (parallax scrolling), można osiągnąć naprawdę imponujące efekty.

Infinite scroll – wady

Infinite scroll ma pewne wady, które mogą stać się szczególnie uciążliwe w przypadku niedokładnej implementacji tego rozwiązania.

  1. Problematyczna stopka

    Stopka strony internetowej ma bardzo ważną funkcję nawigacyjną i potrafi świetnie uzupełnić zawartość górnych i bocznych pasków. W przypadku nieskończonego przewijania owa sekcja niestety stale „ucieka” podczas załadowywania kolejnego contentu. Można ominąć ten problem, tworząc sticky footer, który jest stale widoczny (niestety potrafi to irytować niektórych użytkowników).

  2. Indeksowanie treści

    Nieskończone przewijanie jest bardzo problematyczne z punktu widzenia SEO, gdyż crawlery Google’a zwykle nie przewijają stron, a jedynie analizują to, co od razu jest widoczne dla użytkowników przy pierwszym załadowaniu contentu. Temu problemowi także można zaradzić, jednak wymaga to implementacji przemyślanych rozwiązań. Przykładem jest choćby przycisk „Pokaż więcej” – jego kliknięcie wywołuje ładowanie zawartości, a następnie przenosi się on pod nowe treści. Stanowi to hybrydowe połączenie paginacji i nieskończonego przewijania.

    W jednym z wywiadów John Mueller wspomina, że narzędzie do sprawdzania adresów URL będzie w stanie pokazać nam jak Google widzi daną stronę podczas renderowania:

    "W zależności od tego jak długa jest strona i jak zaimplementowany jest infinte scroll możemy nie być w stanie wyrenderowac całości.

    Więc polecam przetestować dany adres za pomocą narzędzia do inspekcji i zobaczyć, ile Google faktycznie widzi."

     

Paginacja i infinite scroll – podsumowanie

Jak więc widać, obie techniki mają swoje zastosowania. W praktyce stronicowanie sprawdza się w większości sytuacji, gdyż pozwala w prosty i przyjazny dla Google’a oraz użytkowników sposób dzielić treści. Infinite scroll daje świetne efekty, ale tylko wtedy, gdy filarem danej strony jest możliwość przeglądania strumienia atrakcyjnego contentu. Pamiętaj też, że implementacja nieskończonego przewijania jest znacznie trudniejsza. Przeanalizuj zatem swoją sytuację i ustal, co najlepiej sprawdzi się w Twoim przypadku.

Udostępnij artykuł:
Chcesz mieć dobrze zoptymalizowaną technicznie stronę?
Sprawdź naszą ofertę
Oceń artykuł:
4.6
Ocena: 4.6 Liczba głosów: 61