Čo je drobčeková navigácia?
Drobčeková navigácia sa vzťahuje na sled interných odkazov - známych ako "drobky" - ktoré informujú používateľa o jeho aktuálnej polohe na webovej lokalite v rámci hierarchie stránok. Termín "breadcrumb" je inšpirovaný príbehom o Jeníčkovi a Mařenke z rozprávky bratov Grimmovcov, kde zanechali stopu z omrviniek, aby našli cestu späť domov.
Typy navigácie v omrvinkách
- Drobky založené na hierarchii: Zobrazujú pozíciu používateľa v rámci hierarchie webových stránok.
- Drobky založené na atribútoch: Bežne sa používajú na webových stránkach elektronického obchodu.
- Drobky založené na histórii: Usporiadané na základe konkrétnych krokov, ktoré návštevník vykonal, aby sa dostal na aktuálnu stránku.
Dôležitosť navigácie v omrvinkách
Drobčeková navigácia je dôležitá, pretože zlepšuje používateľský zážitok a uľahčuje navigáciu na webových stránkach. Poskytuje sekundárnu navigáciu, ktorá pomáha n ávštevníkom nájsť to, čo hľadajú, a znižuje počet kliknutí potrebných na návrat na stránky vyššej úrovne. Zlepšuje tiež použiteľnosť v mobilných zariadeniach a zohráva kľúčovú úlohu v SEO.
Výhody SEO
- Skúsenosti používateľov: Google odmeňuje webové stránky, ktoré uprednostňujú používateľský zážitok. Drobky uľahčujú navigáciu, čo môže zvýšiť spokojnosť používateľov.
- Pochopenie hierarchie webových stránok: Drobky pomáhajú spoločnosti Google pochopiť štruktúru vašej webovej stránky a efektívnejšie rozdeľovať PageRank, čo môže zlepšiť vaše umiestnenie.
- Nižšia miera odmietnutia: Tým, že používateľom poskytuje alternatívny spôsob navigácie, môže znížiť mieru odchodov tým, že podporuje preskúmanie ďalšieho obsahu na stránke.
Ako implementovať drobečkovú navigáciu
Implementácia drobečkovej navigácie je jednoduchá. Ak máte webové stránky WordPress, pluginy ako Yoast SEO tento proces zjednodušujú. Niektoré témy WordPress môžu dokonca podporovať omrvinky už v predvolenom nastavení. V prípade webov, ktoré nie sú súčasťou WordPressu, môžete omrvinky implementovať ručne pomocou HTML a CSS.
Príklad šablóny HTML
<ul class="breadcrumb"> <li><a href="#">Home</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Kategória</a></li> <li>Aktuálna stránka</li> </ul>
Táto šablóna vytvára zoznam odkazov s odrážkami. Prispôsobte si štýl pomocou CSS tak, aby vyhovoval vašim potrebám.
Štruktúrované údaje
Ak chcete zabezpečiť, aby sa drobky zobrazovali v SERP, implementujte na svojom webovom sídle príslušné štruktúrované údaje. Podrobný návod nájdete v dokumentácii o omrvinkách od spoločnosti Google.
Najlepšie postupy pre navigáciu v omrvinkách
- Podpora primárnej navigácie: Drobky sú doplnkovou navigačnou funkciou, nenahrádzajú primárne navigačné menu.
- Používajte oddeľovače: Oddeľte textové odkazy v drobečkovej ceste špeciálnymi znakmi, ako sú ">", "/" alebo šípky.
- Úplná navigačná cesta: Vždy uveďte celú navigačnú cestu bez ohľadu na to, ako používateľ prišiel na stránku.
- Čítanie zľava doprava: Drobčeková cesta by sa mala čítať zľava doprava, pričom domovská stránka by mala byť naľavo a aktuálna stránka napravo.
- Aktuálna stránka: Poslednou položkou v drobečkovej ceste by mala byť aktuálna stránka a nemal by to byť odkaz, na ktorý sa dá kliknúť.
- Nenápadný dizajn: Drobčeková navigácia musí byť jednoduchá a nenápadná, umiestnená v hornej časti stránky a musí mať malé, ale čitateľné písmo.
Ďalšie informácie a tipy o webovej navigácii a SEO nájdete na blogu Ranktracker a v našom komplexnom sprievodcovi SEO. Okrem toho si pozrite náš slovník SEO, aby ste sa oboznámili s kľúčovými termínmi a pojmami SEO.