Lednové slevy jsou tu! Až 60 % na vše. Vyzkoušejte nový AI WebEditor. 

Co je drobečková navigace

Drobečková navigace (angl. Breadcrumb navigation) je typ sekundárního navigačního prvku na webu, který zobrazuje uživateli hierarchii stránek a cestu, jakou se dostal k aktuální stránce. Obvykle se zobrazuje v horní části stránky, těsně pod hlavním menu. 

Jejím účelem je zlepšit uživatelskou přívětivost (UX), umožnit rychlý návrat na vyšší úrovně webu a poskytnout vyhledávačům jasný signál o struktuře webu. Správně nastavená drobečková navigace může být zobrazena i přímo ve výsledcích vyhledávání (jako tzv. rich snippet). 

Typický příklad: 

Domů > Kategorie > Podkategorie > Produkt 

Na produktové stránce e-shopu s obuví by mohla drobečková navigace vypadat následovně: 

Domů > Pánská obuv > Tenisky > Nike Air Zoom 

Každá část (kromě poslední) je klikací odkaz, který vede na odpovídající úroveň webu. 

Typy drobečkové navigace 

Drobečková navigace se může implementovat různými způsoby v závislosti na povaze webu. 

Nejčastější typy: 

  • Hierarchická (location-based) – ukazuje strukturu webu od domova po aktuální stránku 
  • Cestovní (path-based) – zobrazuje skutečnou cestu, jakou uživatel přišel na stránku 
  • Podle atributů (attribute-based) – využívá filtry a vlastnosti (např. „Elektronika > Mobily > Značka: Samsung“) 

SEO přínos drobečkové navigace 

Kromě uživatelského komfortu má drobečková navigace i vliv na SEO. Pomáhá vyhledávačům lépe chápat hierarchii webu a může zlepšit zobrazení stránky v SERPu 

Google doporučuje implementovat drobečkovou navigaci pomocí strukturovaných dat (Schema.org BreadcrumbList). 

Výhody z pohledu SEO a UX: 

Doporučené postupy 

Aby drobečková navigace správně fungovala, je důležité ji dobře navrhnout a implementovat. 

  • používejte jasnou a konzistentní strukturu odkazů 
  • implementujte strukturovaná data Schema.org 
  • umístěte drobečkovou navigaci na viditelné místo (obvykle pod hlavní menu) 
  • zajistěte, aby byla responzivní a fungovala i na mobilních zařízeních 
  • nepřehánějte délku – měla by zůstat přehledná a jednoduchá 
Poslední aktualizace: