Czym są Breadcrumbs? Czyli jak nawigować na stronie!

Czym są Breadcrumbs? Czyli jak nawigować na stronie!
Czas czytania 2 minuty

Jak zapewne już zauważyłeś w Internecie stosowanych jest dużo określeń, których nazwa odwołuje się do codziennego życia (np. do kuchni). Takich jak np. Cookies (ciasteczka), hamburger menu.

Kolejnym analogicznym przykładem są Breadcrumbs czyli dosłownie tłumacząc okruszki chleba.

Czym są Breadcrumbs?

Breadcrumbs to element witryny internetowej umożliwiający poruszanie się w obrębie witryny. Jednak poruszanie to różnie się dość istotnie od tego co znamy z menu (paska nawigacyjnego). Breadcrumbs umożliwiają nam bowiem przejście jedynie do elementów nadrzędnych strony na, której aktualnie się znajdujemy.

Nasze pole manewru – w tym wypadku poruszania jest więc pozornie dość ograniczone. W tym przypadku powinno być jednak wystarczające bo Breadcrumbs jest dodatkiem a nie zamiennikiem do menu. Breadcrumbs ma nam uświadamiać gdzie obecnie jesteśmy na stronie (blogu, w sklepie) – w jakiej kategorii, podkategorii.

Breadcrumbs źródło: www.w3schools.com
Breadcrumbs
źródło: www.w3schools.com

Gdzie się je stosuje Breadcrumbs?

Stosuje się je na:

  • blogu
  • w sklepie internetowym
  • w aktualnościach

Pozwala nam on się odnaleźć w gąszczu kategorii stanowiąc swoisty drogowskaz. Bardzo uproszczoną nawigację witryny z poziomu wpisu, artykułu, produktu czy konkretnej aktualności.

Struktura Breadcrumbs

Strona Główna >> kategoria >> pod kategoria >> artykuł

Jak widać Breadcrumbs składa się z

  • odnośnika do strony głównej
  • separatora (w tym przypadku „>>”)
  • odnośników / linków do nadrzędnych kategorii wskazujących na lokalizację artykułu w strukturze witryny
  • nie podlinkowanej nazwy artykułu / produktu na którym aktualnie się znajdujemy

Pamiętajcie – artykuł, produkt, post, strona nie powinna sama do siebie likować.

Zalety używania Breadcrumbs

Wśród zalet warto tego elementu warto jest wymienić:

  • ułatwienie w poruszaniu się na stronie (poprawienie nawigacji)
  • skraca czas przejścia do innych produktów / artykułów umieszczonych w tej samej kategorii w witrynie
  • pomoc wyszukiwarką internetowym w lepszym zrozumieniu struktury strony

Warto przeczytać: