Blog

Tlačítko „Načíst více“ vs. automatické načítání Infinite Scroll: Co je lepší pro PrestaShop?

Tým PrestaShopAddons Čas na přečtení: 7 minut

Pokud jste se rozhodli, že klasické stránkování působí ve vašem obchodě PrestaShop neohrabaně, další otázka se dělí na dvě části: automatické načítání s nekonečným posouváním (produkty se načítá při posouvání stránky) nebo tlačítko „Načíst další“ (uživatel klikne, aby načítal další sadu). Oba přístupy jsou založeny na technologii AJAX a v obou případech se vyhýbá úplnému načtení celé stránky, avšak jejich dopady na uživatelský zážitek, SEO a přístupnost se výrazně liší.

Zkrácená verze: Tlačítko „Načíst více“ je v e-commerce ve většině případů nejúčinnější. Zde je vysvětlení, proč tomu tak je, a také situace, ve kterých je automatické načítání správným řešením.

Zásadní rozdíl: kontrola ze strany uživatele

Automatické načítání omezuje svobodu volby uživatele. Další sada se zobrazí, ať už to uživatel chce, nebo ne. To je v pořádku u obsahu ve formě feedu (Twitter, Instagram), kde není vyžadován velký závazek. Pro zákazníky v e-shopech, kteří porovnávají produkty, to však představuje překážku:

  • Zákazník najde produkt, který se mu líbí, při procházení stránky
  • Klikne na něj a přejde na stránku produktu
  • Zpět do kategorie
  • Prohlížeč se posune zpět – ale na jakou pozici? Stránka je nyní delší než v okamžiku, kdy ji uživatel opustil

Tento problém se “ztrátou pozice posouvání” je nejčastěji uváděným důvodem, proč uživatelé nesnášejí automatické načítání s nekonečným posouváním na e-shopových stránkách. Výzkum společnosti Nielsen Norman Group uvádí to jako jednu ze tří nejčastějších stížností na nekonečné posouvání v kontextu elektronického obchodování.

Řešením je „Load-more“: uživatel má vše pod kontrolou, DOM se rozšiřuje pouze tehdy, když si o to požádá, a chování tlačítka „Zpět“ v prohlížeči zůstává předvídatelné.

Přímé srovnání

1. Ovládání uživatelem

Vítěz: load-more. Výslovné kliknutí = záměrná akce. Uživatel ví, k čemu se zavazuje. Čtečky obrazovky oznamují, že se jedná o tlačítko. Uživatelé klávesnice se k němu mohou dostat pomocí klávesy Tab.

2. SEO

Obě možnosti mohou být bezpečné – záleží na způsobu implementace. Klíčová otázka: má každá “stránka” s produkty URL, kterou lze prohledat?

  • Načíst další + Aktualizace URL: nejbezpečnější vzor. Kliknutím → se načte ?page=2, aktualizuje adresu URL v prohlížeči a přidává produkty. Googlebot může provádět procházení ?page=2, ?page=3 přímo.
  • Automatické načítání + aktualizace URL prostřednictvím rozhraní History API: při správném provedení je to také bezpečné. Adresa URL se aktualizuje, jakmile uživatel posune stránku za určitou hranici. Googlebot i nadále prochází adresy URL s paginací.
  • Kterýkoli z těchto vzorů bez Aktualizace URL adres: zničí SEO pro vše, co se nachází za první stránkou. Celý kontext: Stránkování vs. Infinite Scroll.

3. Přístupnost (A11y)

Vítěz: jednoznačně „load-more“. Tlačítko s příslušným aria-label je standardní interaktivní prvek, který rozpoznává každá asistenční technologie. Čtečky obrazovky jej přečtou. Uživatelé klávesnice se k němu dostanou pomocí klávesy Tab.

Funkce automatického načítání vyžaduje aria-live regiony s oznámením “Načteno dalších 20 produktů”, zaměření na správu a alternativní navigace – funkce, které mnoho modulů opomíjí. Pokud potřebujete dodržovat standardy WCAG (veřejný sektor EU, podnikové prostředí B2B), nastavte jako výchozí možnost „Načíst další“.

4. Chování tlačítka Zpět

Vítěz: load-more. Jelikož každé načtení představuje akci uživatele, je stav historie prohlížeče přehlednější. Uživatelé mohou na stránce s produktem kliknout na tlačítko „Zpět“ a vrátit se přesně na místo, kde se právě nacházeli.

Automatické načítání vyžaduje pečlivé history.replaceState a logiku obnovení posouvání. Většina výchozích implementací narušuje uživatelský zážitek při používání tlačítka „Zpět“.

5. Výkon na mobilních zařízeních

Záleží na velikosti katalogu.

  • Malý katalog (méně než 200 produktů): automatické načítání je v pořádku, DOM zůstává přehledný
  • Rozsáhlý katalog (více než 500 produktů): Funkce „load-more“ je bezpečnější – uživatel sám rozhoduje, kdy se mají přidat uzly DOM. Funkce automatického načítání může způsobit nekonečné posouvání stránky a výrazně zvýšit spotřebu paměti u telefonů střední třídy

6. Sledování analytických údajů

Funkci „Načíst více“ lze snadno sledovat. Jedna událost kliknutí na jednu dávku. Funkce automatického načítání vyžaduje spouštění událostí na základě prahových hodnot, což mnoho implementací vynechává – proto váš dashboard GA4 zobrazuje “všichni uživatelé prohlížející stránku 1”, i když polovina z nich ve skutečnosti posunula stránku až na stránku 5.

7. Vnímaná záměrnost

Jde o psychologický jev, který je však reálný. Kliknutím na “Zobrazit více” získá uživatel pocit, že postupuje dál (“Stále hledám”). Automatické načítání může působit pasivně nebo vyvolávat úzkost – vždycky je tu “ještě něco”. Výzkumy v oblasti “architektury výběru” naznačují, že v obchodním kontextu funguje omezený výběr lépe než výběr neomezený.

8. Chování podlahy (co se nachází pod výrobky?)

Kategorie často obsahují pod mřížkou produktů další obsah: popis kategorie (užitečný z hlediska SEO), související kategorie, doporučený obsah a zápatí.

  • Automatické načtení na mobilních zařízeních posouvá veškerý obsah zápatí tak daleko, že je prakticky nedostupný. Obsah určený pro SEO, který se nachází pod mřížkou, si uživatelé téměř nevšimnou.
  • Načíst další zajišťuje, že zápatí zůstane viditelné. Jakmile se načte poslední dávka obsahu, uživatel se dostane na skutečný konec stránky a zápatí se mu přirozeně zobrazí.

Kdy je vhodné použít automatické načítání s nekonečným posouváním

Automatické načítání není vždy na škodu. Situace, ve kterých má své výhody:

  • Objevování produktů ve stylu feedu — prohlížení módy a bytových doplňků, kde je aktivní režim “ukázat mi všechno krásné”
  • Průzkumné kategorie — tipy na dárky, sezónní kolekce, výběr redakce
  • Malé až střední katalogy (méně než 500 produktů v každé kategorii) kde velikost DOM zůstává v rozumných mezích
  • Stránky s malým množstvím obsahu — pod mřížkou není nic důležitého, takže na tom, že “nekonečné posouvání nikdy nedosáhne dolní hranice”, nezáleží
  • Kontexty sociálního obchodu — Prezentace ve stylu Instagram Shopu a TikTok Shopu

Kdy je volba „Načíst více“ tou správnou volbou

  • Kategorie vyhledávacích záměrů — zákazníci, kteří hledají konkrétní zboží (většina B2C obchodů)
  • Rozsáhlé katalogy (500 a více produktů v kategorii)
  • Obchody, pro které je SEO klíčové — organická návštěvnost je hlavním kanálem
  • Požadavky na přístupnost — Soulad s WCAG AA nebo veřejný sektor
  • Provoz převážně z mobilních zařízení kde záleží na paměti a obnově svitků
  • B2B obchody kde zákazníci systematicky porovnávají technické parametry

Nastavitelný režim – automatický nebo ruční

Některé implementace nabízejí oba režimy jako konfigurovatelné možnosti – buď čistě automatické posouvání, nebo spouštění pomocí explicitního tlačítka –, takže je můžete přepínat podle typu kategorie, potřeb v oblasti analytiky nebo požadavků na přístupnost. Tato Modul Infinite Scroll pro PrestaShop ukazuje, že se jedná o nastavení v back-office: výchozí je automatický režim, režim s tlačítky je dostupný pouhým zaškrtnutím políčka, což vám umožňuje vyzkoušet, který z nich ve vašem obchodě funguje lépe, aniž byste museli měnit kód.

Praktický přístup: začněte s automatickým posouváním (menší odpor, lepší uživatelský zážitek na mobilních zařízeních pro většinu kategorií e-shopů) a přepněte do režimu s tlačítky u kategorií, kde je důležitější přístupnost nebo rovnocennost analytických údajů – například u velkoobchodních B2B kategorií, obchodů veřejného sektoru nebo jakéhokoli katalogu, kde je prioritou sledování jednotlivých dávek.

Pokyny k implementaci pro PrestaShop

Aktualizace URL adres jsou nezbytné

Ať už si vyberete jakýkoli vzor, adresa URL se musí aktualizovat podle toho, jak se uživatelé pohybují po stránkách. Bez aktualizace adresy URL:

  • Googlebot se nemůže dostat na stránku 2 a další
  • Uživatelé nemohou sdílet konkrétní zobrazení
  • Tlačítko „Zpět“ nedokáže obnovit původní polohu
  • Funkce přidávání do záložek nefunguje

Použití history.pushState() (při kliknutí na tlačítko „Načíst další“) nebo history.replaceState() (pro události automatického načítání a posouvání, aby se zabránilo znečištění historie tlačítka „Zpět“).

Náhradní řešení stránkování pro vyhledávací roboty

Zajistit přístupnost ?page=2 URL adresy, které fungují i při vypnutém JavaScriptu (nebo při prvním procházení robotem Googlebot). Toto zajišťuje výchozí stránkování PrestaShop; moduly pro nekonečné posouvání by měly být nad ním navrstveny, nikoli jej nahrazovat.

Načíst velikosti dávek

24 produktů na jednu dávku je dobré výchozí nastavení. Větší dávky (36–48) snižují počet potřebných načtení, ale při připojení přes 4G může docházet ke zpomalení. Otestujte to na skutečných zařízeních, ne pouze v emulaci na počítači.

Zpracování prázdného stavu

Co se stane, když uživatel dojde na konec? Automatické načítání bez zpětné vazby působí jako chyba. Vždy by se měla zobrazit zpráva “Dostali jste se na konec – celkem X produktů” nebo jiná zpráva o dokončení. Tlačítko “Načíst další” může jednoduše zmizet nebo se změnit na „Žádné další produkty“.

Často kladené otázky

Upřednostňuje Google funkci „Načíst více“ před automatickým načítáním?

Google k této otázce zaujímá od roku 2019 neutrální postoj. Obě možnosti jsou přijatelné, pokud existují stránkované URL adresy a jsou prohledatelné. Co Google dělá penalizovat: obsah, který je bez interakce uživatele neviditelný a který roboti nedokážou napodobit. Oba vzory tuto podmínku splňují, pokud dojde k aktualizaci URL adres.

Je automatické načítání považováno za “dark pattern”?

Ne nutně. „Dark patterns“ vyžadují záměr oklamat uživatele. Automatické načítání je neutrální volba z hlediska uživatelského zážitku, která v některých kontextech (vyhledávání v e-shopech) funguje špatně, zatímco v jiných (sociální kanály) funguje dobře. Jeho použití v oblasti zpravodajství a médií za účelem zvyšování zapojení uživatelů mu však vyneslo negativní pověst.

Mohu na PrestaShop provést A/B testování funkcí „Načíst více“ a „Automatické načítání“?

Ano, pomocí náhrady za Google Optimize (Google Optimize Next, VWO, Convert nebo vlastní řešení na straně serveru). Testované metriky: míra okamžitého opuštění stránky, míra přidání do košíku, počet návštěv stránky s podrobnostmi o produktu na jednu relaci, hodnota košíku. U typického provozu typu PrestaShop počítejte s testovacím obdobím 3–6 týdnů, aby bylo dosaženo statistické významnosti.

A co třeba “Načíst další” s náhradním řešením pro stránkování?

Skvělé řešení. Viditelným ovládacím prvkem je tlačítko “Načíst další” (AJAX, bez obnovení stránky), ale podkladový HTML kód obsahuje také odkaz na stránkování pro uživatele bez podpory JavaScriptu a pro vyhledávače. To nejlepší z obou světů – moderní uživatelské rozhraní pro většinu uživatelů a spolehlivá záložní varianta pro všechny ostatní.

Kolik produktů by měla jedna dávka načtení pomocí tlačítka “Načíst další” načíst?

Stejně jako při prvním načtení – 24–36. Konzistence pomáhá uživatelům vytvořit si určitá očekávání. Při následujících kliknutích nenabízejte méně položek (vypadá to, jako by se zásoby v obchodě tenčily); nenabízejte ani výrazně více (působí to přehnaně).

Závěrem

Pro e-shopy – a konkrétně pro obchody PrestaShop – Tlačítko „Načíst více“ s aktualizací URL adresy je bezpečnější a má vyšší konverzní poměr, a proto je nastaveno jako výchozí volba. Automatické načítání je vhodné pro určité kontexty (móda, orientační prohlížení, malé katalogy), ale v roce 2026 už to není tak zjevně moderní volba, jak se to jevilo v roce 2015.

Ať už si vyberete cokoli, nezbytnými požadavky jsou aktualizace URL adres u každé dávky a indexovatelná záložní verze s paginací – bez nich budou oba přístupy mít negativní dopad na SEO. Úplné srovnání paginace a nekonečného posouvání najdete v Stránkování vs. Infinite Scroll v PrestaShop, a širší optimalizace stránek kategorií v Průvodce optimalizací stránek kategorií PrestaShop.