Lazy loading neboli odložené načítání pomáhá zrychlit web s mnoha obrázky. Prohlížeč díky němu stahuje fotky postupně, až v momentě, kdy se k nim návštěvník při posouvání stránky blíží. Spousta lidí přitom ani netuší, jestli ho jejich stránky opravdu používají. Jak tedy odložené načítání funguje, podle čeho ho poznáte v prohlížeči a na co si dát pozor, aby web skutečně zrychlilo?
Jak odložené načítání funguje
Dejme tomu, že máte kategorie v e-shopu se šedesáti produkty. Bez odloženého načítání stáhne prohlížeč všech šedesát fotek hned po otevření, i když návštěvník uvidí jen prvních šest a možná stránku vůbec neposune. Telefon tak zbytečně stahuje data a zpomaluje se načítání toho, co je vidět.
S odloženým načítáním prohlížeč nejdřív stáhne obrázky v první obrazovce. Ostatní načítá postupně, když se k nim návštěvník při posouvání přiblíží. Stahování přitom začíná s předstihem, takže při běžném posouvání obrázky naskočí včas.
Dnes k tomu stačí jeden atribut v kódu obrázku, loading s hodnotou lazy. Podporují jej všechny hlavní prohlížeče, tedy Chrome, Edge, Firefox i Safari. Starší weby místo něj používají trochu složitější skripty, které ale fungují podobně.
Poznáte to pouhým okem
Na test lazy loadingu nepotřebujete ani žádné speciální nástroje. Jednoduše otevřete delší stránku s mnoha obrázky, například blog či kategorii produktů, a rychle sjedete až na konec. Pokud se obrázky ve spodní části na okamžik objeví jako prázdná místa, šedé plochy či rozmazané náhledy a teprve potom se doplní, web odložené načítání nejspíš používá.
Na rychlém připojení si rozdílu nemusíte všimnout, protože prohlížeč stahuje obrázky s rezervou. Test proto zopakujte v telefonu na mobilních datech, kde je efekt výraznější.
Pohled do kódu bez programování
Spolehlivěji lazy loading ověříte při zobrazení kódu stránky. Klikněte pravým tlačítkem myši na obrázek níže na stránce a zvolte možnost Prozkoumat. Otevře se panel nástrojů pro vývojáře a v něm zvýrazněný kód obrázku. Pokud v něm najdete text loading=“lazy“, obrázek se načítá odloženě.
Pokud tam atribut není, hledejte výrazy jako data-src či lazyload. Ty prozrazují starší řešení pomocí skriptu. Když nenajdete ani jedno, web odložené načítání u tohoto obrázku nepoužívá. Při té příležitosti zkontrolujte i atribut alt s popisem obrázku, jehož význam vysvětluje tento článek o kontrole alt tagů.
Sledujte, co se stahuje
Nástroje pro vývojáře umí ukázat i samotné stahování. Přepněte v panelu na kartu Síť, v angličtině Network, a zvolte filtr obrázků. Pak obnovte stránku a pomalu ji posouvejte dolů.
Pokud během posouvání přibývají v seznamu nové obrázky, odložené načítání funguje. Pokud se všechny objeví hned po načtení stránky, prohlížeč je stahuje najednou.
Tento test zabere pár minut a je efektivnější než pouhé pozorování. Zopakujte ho na úvodní stránce, v kategorii i v článku, protože různé šablony webu se mohou chovat odlišně.
Redakční systémy to často řeší samy
Pokud web běží na rozšířeném redakčním systému, odložené načítání má pravděpodobně zapnuté už v základu. Například WordPress přidává atribut obrázkům v obsahu automaticky od roku 2020. Podobně postupuje řada šablon a doplňků pro optimalizaci rychlosti.
Pozor ale na zdvojení. Pokud zapnete odložené načítání v doplňku a zároveň ho používá šablona, obrázky se mohou chovat nepředvídatelně. Po každé změně nastavení proto test zopakujte.
Nezapomeňte na videa a mapy
Odložené načítání se netýká jen obrázků, ale i vložených (embedded) prvků, jako jsou videa z YouTube, mapy či příspěvky ze sociálních sítí. Tyto prvky bývají datově náročnější než fotky, protože s sebou přinášejí vlastní skripty a styly.
Pokud máte video či mapu až ve spodní části stránky, například v sekci Kontakty, jejich načtení odložte. Jestli se odkládají, ověříte stejně jako u obrázků. Prozkoumejte kód vloženého prvku a hledejte atribut loading s hodnotou lazy.
Kde odložené načítání nepoužívat
Obrázky v první obrazovce, tedy logo, hlavní fotka či banner, by se odloženě načítat neměly. Prohlížeč by s jejich stahováním zbytečně čekal a stránka by se zobrazila pomaleji. U nich je správné ponechat výchozí okamžité načítání.
Odložené načítání bez uvedených rozměrů obrázku navíc způsobuje poskakování stránky, kdy se obsah při doplnění fotky posune. Proto by každý obrázek měl mít v kódu uvedenou šířku a výšku.
Co dělat, když odložené načítání chybí
Pokud test ukáže, že web obrázky stahuje najednou, zkontrolujte nejdřív nastavení redakčního systému a šablony. Často jde jen o zapnutí volby či aktualizaci na novější verzi. U webů na míru předejte úkol webaři a uveďte konkrétní stránky, na kterých jste problém zjistili.
Po úpravě si ověřte, že se obrázky v první obrazovce dál načítají okamžitě. Teprve potom můžete považovat změnu za dokončenou.
Ověřte i celkovou rychlost
Odložené načítání je jen jedním dílkem rychlosti webu. Celkový obraz ukáže test, který změří, jak rychle se stránka načítá a co ji brzdí. Rychlost svého webu si můžete otestovat například zde a výsledky porovnat před úpravou a po ní.
I jednoduchý test prozradí hodně
Lazy loading poznáte i bez znalosti programování. Stačí rychle posunout stránku, pohlédnout do kódu obrázku či sledovat stahování v nástrojích pro vývojáře. Pokud ho web nepoužívá, nastavení bývá v redakčním systému otázkou jednoho zaškrtnutí.
Ještě dnes otevřete nejdelší stránku svého webu a projděte všechny tři testy. Výsledek si zapište, a pokud odložené načítání chybí, předejte zjištění webaři i s konkrétními stránkami.
- Lazy loading pro neprogramátory. Jak bez znalosti kódu poznat, jestli ho váš web používá - 26.10.2026
- Záhradná technika po sezóne: postup, ako ju uložiť, aby na jar naštartovala - 24.10.2026
- GIF v newsletteru, který funguje i bez pohybu? 6 pravidel pro první snímek, délku smyčky a výzvu k akci - 23.10.2026
