Lazy loading a SEO: ako odložiť načítanie a nestratiť obsah v Google

Autor: Peter Weidinger · Publikované 14. 10. 2026

Lazy loading, po slovensky odložené načítanie, znamená, že prehliadač stiahne obrázok, video alebo vložený prvok až vtedy, keď sa k nemu návštevník blíži. Google túto techniku označuje za bežný osvedčený postup pre výkon a používateľský zážitok, no zároveň upozorňuje, že pri nesprávnej implementácii môže obsah pred vyhľadávačom neúmyselne skryť. Článok vychádza z dokumentácie Google Search Central a z návodov web.dev a ukazuje, ktoré spôsoby odkladania sú pre indexovanie bezpečné, čomu sa lazy loading dávať nemá a ako si výsledok skontrolovať.

1. Čo je lazy loading a prečo sa týka SEO

Bežná stránka načíta všetky obrázky hneď, aj tie, ktoré sú hlboko pod prvou obrazovkou a ku ktorým sa veľa návštevníkov nikdy neposunie. Lazy loading tento postup obracia: sťahovanie zdroja sa odloží, kým nie je potrebný, čím sa šetria dáta a uvoľní sa pripojenie pre zdroje, od ktorých závisí prvé vykreslenie stránky. Návod web.dev k tomu pripomína, že obrázky sú na väčšine webov najčastejšie vyžiadaným typom súboru a zvyčajne zaberú viac prenosovej kapacity než ktorýkoľvek iný zdroj (Browser-level image lazy loading for the web, web.dev).

S vyhľadávaním to súvisí z dvoch strán. Tá prvá je rýchlosť, lebo menej dát pri úvodnom načítaní pomáha metrikám, ktoré rozoberá článok o Core Web Vitals a rýchlosti webu. Druhá strana je indexovanie a tu môže odkladanie uškodiť. Google v dokumentácii píše, že odkladanie nekritického alebo neviditeľného obsahu je bežný osvedčený postup, no ak sa neimplementuje správne, môže obsah pred Google neúmyselne skryť (Fix lazy-loaded content, Google Search Central).

Dôvod je v tom, ako Google stránku spracúva. Podľa tej istej dokumentácie vyhľadávanie Google so stránkou neinteraguje, teda neposúva ju a na nič nekliká, takže obsah, ktorý sa objaví až po akcii používateľa, sa do indexu dostať nemusí. Celý zvyšok článku je vlastne odpoveďou na jednu otázku: ako odkladať tak, aby sa obsah načítal aj bez posúvania a klikania.

2. Tri spôsoby, ktoré Google uvádza ako bezpečné

Základné pravidlo dokumentácie znie, že implementácia má načítať všetok relevantný obsah vždy, keď je viditeľný vo výreze prehliadača (anglicky viewport, teda časť stránky, ktorú práve vidno na obrazovke). Google k tomu vymenúva tri spôsoby a o všetkých troch hovorí, že sa nespoliehajú na akcie používateľa, ako je posúvanie alebo klikanie.

Rozhodujúce je slovné spojenie „pri vstupe do výrezu“. Skript, ktorý čaká na udalosť posunutia stránky alebo na kliknutie na tlačidlo, do tejto trojice nepatrí, lebo robot Google takú udalosť nevyvolá. Ak web používa staršiu knižnicu a nie je jasné, na čo reaguje, odpoveď dá test z poslednej časti článku, nie dokumentácia knižnice.

Zabudovaný lazy loading má oproti skriptom jednu praktickú výhodu, ktorú návod web.dev uvádza výslovne: netreba písať vlastný kód ani pripájať samostatnú knižnicu. Prehliadače, ktoré atribút loading nepoznajú, ho podľa toho istého návodu jednoducho ignorujú, takže obrázok sa načíta bežným spôsobom a nič sa nepokazí.

3. Čo neodkladať: obsah v hornej časti stránky

Najčastejšia chyba nevzniká z toho, že web lazy loading nemá, ale z toho, že ho má všade. Google v dokumentácii žiada nepridávať lazy loading obsahu, ktorý je pravdepodobne viditeľný hneď po otvorení stránky, lebo jeho načítanie a zobrazenie potom môže trvať dlhšie a návštevník si to všimne.

Návod web.dev to vysvetľuje technicky. Prehliadač nemôže obrázok odložiť skôr, než zistí, kde sa na stránke nachádza, a toto čakanie spôsobí, že sa obrázok načíta pomalšie. Pri obrázkoch viditeľných po prvom načítaní, a zvlášť pri obrázku, ktorý tvorí metriku LCP (Largest Contentful Paint, čas vykreslenia najväčšieho prvku na obrazovke), preto odporúča ponechať predvolené okamžité načítanie a loading="lazy" použiť len mimo úvodného výrezu.

Že nejde len o teóriu, ukazuje test, ktorý autori web.dev urobili na ukážkovom webe vo WordPresse. Vtedajšia implementácia odkladala aj obrázky v hornej časti stránky a podľa záveru testu veľmi zreteľne znižovala objem prenesených obrázkov, no za cenu oneskoreného LCP. Odporúčanie, ktoré z analýzy vzišlo, je načítať obrázky v úvodnom výreze okamžite a ostatné odkladať bez zábran (The performance effects of too much lazy loading, web.dev).

V praxi sa preto oplatí prejsť šablónu a pri týchto prvkoch lazy loading vypnúť:

• hlavný obrázok stránky, teda úvodná fotografia článku, banner alebo prvá fotografia produktu,
• logo a obrázky v hlavičke, ktoré sú viditeľné na každej stránke,
• prvý rad produktov alebo článkov vo výpise kategórie,
• prvý obrázok v karuseli, hoci ďalšie snímky sa odkladať môžu.

Ak chcete hlavnému obrázku naopak pomôcť, web.dev odporúča atribút fetchpriority="high", ktorý zvyšuje prioritu sťahovania. Hodnota loading="eager" na to neslúži, lebo podľa návodu znamená len bežné načítanie a obrázok nenačíta rýchlejšie než obrázok bez atribútu.

4. Obrázky: atribút loading, rozmery a pasca data-src

Pri obrázkoch mimo prvej obrazovky stačí jediný atribút. Správny zápis podľa web.dev obsahuje aj rozmery:

<!-- viditeľný hneď: bez lazy loadingu -->
<img src="uvodna-fotka.jpg" alt="Predajňa zvonka" width="1200" height="600" fetchpriority="high">

<!-- pod prvou obrazovkou: odložené načítanie -->
<img src="interier.jpg" alt="Interiér predajne" width="800" height="533" loading="lazy">

Atribúty width a height nie sú formalita. Kým sa obrázok nenačíta, prehliadač jeho rozmery nepozná, a ak mu ich kód neprezradí, nevie preň vyhradiť miesto a obsah po načítaní poskočí. Návod opisuje aj menej zjavný dôsledok: bez rozmerov má obrázok predvolene 0 × 0 pixelov, takže pri galérii môže prehliadač usúdiť, že sa všetky obrázky zmestia do výrezu, a načíta ich naraz, čím sa stránka spomalí.

Z toho istého návodu vyplývajú ešte tri pravidlá, ktoré pri úprave šablóny ušetria čas:

• pri značke <picture> stačí pridať loading na záložný prvok <img>, na prvky <source> netreba,
• obrázky na pozadí v CSS atribút loading použiť nemôžu, funguje len na značke <img>,
• vzdialenosť od výrezu, pri ktorej sa obrázok začne sťahovať, je v prehliadači pevne daná a cez API sa zmeniť nedá.

Druhé pravidlo má aj rozmer pre vyhľadávanie. Google v odporúčaniach pre obrázky uvádza, že obrázky nachádza v atribúte src prvku <img> a že obrázky z CSS neindexuje (Google image SEO best practices, Google Search Central). Fotografia produktu vložená ako pozadie v CSS sa teda do vyhľadávania obrázkov nedostane bez ohľadu na to, ako sa načítava.

Tu je aj najväčšia pasca starších riešení. Knižnice často ukladajú skutočnú adresu obrázka do atribútu data-src a do src ju presunú až skriptom. Google pritom ako znak správneho nastavenia uvádza, že adresy obrázkov alebo videí sa vo vykreslenom HTML nachádzajú v atribúte src. Ak skript adresu presunie až po posunutí stránky, vo vykreslenom HTML ostane src prázdny alebo so zástupným obrázkom a Google skutočný obrázok nevidí. Ďalšie zásady práce s obrázkami zhŕňa článok o SEO obrázkov.

5. Vložené videá, mapy a nekonečné posúvanie

Atribút loading="lazy" funguje rovnako aj na značke <iframe>, teda na vloženom videu, mape alebo príspevku zo sociálnej siete. Tieto prvky bývajú ťažké, lebo návštevník podľa web.dev platí za sťahovanie dát a náročného JavaScriptu každého rámca, aj keď sa k nemu vôbec neposunie. Pri vloženom videu z YouTube návod uvádza úsporu okolo 500 kB pri úvodnom načítaní stránky (It's time to lazy-load offscreen iframes!, web.dev).

<iframe src="https://www.youtube.com/embed/ID_VIDEA"
        loading="lazy" width="560" height="315"
        title="Názov videa" allowfullscreen></iframe>

Odložiť sa však má len rámec pod prvou obrazovkou. Video, ktoré je hlavným obsahom stránky a nachádza sa hneď pod nadpisom, patrí medzi obsah viditeľný po otvorení, pre ktorý platí pravidlo z tretej časti.

Osobitným prípadom odkladania je nekonečné posúvanie, pri ktorom sa ďalšie položky alebo časti článku dokladajú, keď návštevník príde na koniec stránky. Keďže robot stránku neposúva, Google žiada, aby web popri tom podporoval stránkované načítanie týchto častí:

1. každá časť má vlastnú trvalú a jedinečnú adresu,
2. obsah na danej adrese je pri každom načítaní rovnaký, čo zabezpečia napríklad absolútne čísla strán v tvare ?page=12,
3. adresy neobsahujú relatívne údaje, ako je ?date=yesterday,
4. jednotlivé adresy sú navzájom postupne prepojené odkazmi, aby ich vyhľadávače vedeli objaviť,
5. keď sa po posunutí načíta nová časť a stane sa hlavným viditeľným prvkom, adresa v prehliadači sa aktualizuje cez History API.

Rovnakú logiku má tlačidlo „Načítať ďalšie“. Dokumentácia Google o stránkovaní uvádza, že jeho roboty na tlačidlá neklikajú a spravidla nespúšťajú funkcie JavaScriptu, ktoré na úpravu obsahu vyžadujú akciu používateľa, a že pri hľadaní stránok prechádzajú adresy v atribúte href prvkov <a> (Pagination, incremental page loading, and their impact on Google Search, Google Search Central). Ako stránkovanie v e-shope nastaviť, rozoberá článok o stránkovaní a filtroch.

6. Ako lazy loading otestovať a kontrolný zoznam

Či sa odložený obsah dostane ku Google, sa nedá spoľahlivo zistiť pohľadom v prehliadači, lebo človek stránku posúva a robot nie. Google preto odporúča nástroj Kontrola adresy URL v Search Console a v ňom vykreslené HTML, teda kód stránky po spracovaní JavaScriptu (URL Inspection Tool, Search Console Help). Postup je krátky:

1. V Search Console vložte adresu stránky do poľa na kontrolu adresy a spustite živý test zverejnenej verzie stránky.
2. Po skončení testu otvorte zobrazenie testovanej stránky, v ktorom nástroj ukáže jej kód HTML.
3. Vyhľadajte v ňom názov súboru obrázka alebo vetu z textu, ktoré sa na stránke nachádzajú až nižšie.
4. Pri obrázkoch a videách overte, že ich adresa je v atribúte src prvku <img> alebo <video>. Ak áno, nastavenie podľa Google funguje správne.

Ak sa hľadaný obsah vo vykreslenom HTML nenachádza, lazy loading čaká na akciu, ktorú robot nevykoná, a treba ho nahradiť jedným zo spôsobov z druhej časti. S nástrojom Kontrola adresy URL pomôže návod na Google Search Console a širší kontext toho, ako Google spracúva skripty, dáva článok o JavaScript SEO.

Pred nasadením zmien a po každej aktualizácii šablóny alebo doplnku na optimalizáciu rýchlosti prejdite tento zoznam:

Lazy loading sám osebe pozície nezlepší, lebo je to nástroj na rýchlejšie úvodné načítanie. Jeho prínos sa prejaví len vtedy, keď odkladá správne prvky a keď všetko, čo má byť v indexe, ostane dostupné aj návštevníkovi, ktorý stránku nikdy neposunie, čo je presne spôsob, akým ju číta Google.

Časté otázky

Škodí lazy loading SEO?

Správne nastavený neškodí. Google ho označuje za bežný osvedčený postup pre výkon a používateľský zážitok, no upozorňuje, že nesprávna implementácia môže obsah pred vyhľadávačom skryť. Rizikové sú riešenia, ktoré obsah načítajú až po posunutí stránky alebo po kliknutí.

Vidí Google obrázky s atribútom loading="lazy"?

Lazy loading zabudovaný v prehliadači uvádza Google ako prvý z odporúčaných spôsobov odkladania obrázkov a iframe. Adresa obrázka pri ňom ostáva v atribúte src prvku img, čo je podľa Google znak správneho nastavenia.

Ktorým obrázkom lazy loading nedávať?

Obrázkom viditeľným hneď po otvorení stránky, najmä hlavnému obrázku, ktorý tvorí metriku LCP. Podľa web.dev prehliadač nemôže obrázok odložiť, kým nezistí jeho polohu na stránke, a preto sa taký obrázok načíta pomalšie.

Ako zistím, či Google vidí odložený obsah?

V Search Console použite nástroj Kontrola adresy URL a pozrite si vykreslené HTML. Ak v ňom nájdete text z dolnej časti stránky a adresy obrázkov v atribúte src, nastavenie funguje správne.

Je nekonečné posúvanie problém pre indexovanie?

Samo osebe áno, lebo Google stránku neposúva. Google preto žiada, aby mala každá dokladaná časť vlastnú trvalú adresu s nemenným obsahom, aby boli adresy navzájom prepojené odkazmi a aby sa adresa v prehliadači pri posúvaní aktualizovala cez History API.