Breadcrumbs

Breadcrumbs, czyli tzw. okruszki nawigacyjne, to element interfejsu użytkownika, który pokazuje aktualne miejsce użytkownika w strukturze witryny. Nazwa pochodzi od bajki o Jasiu i Małgosi, którzy zostawiali okruszki chleba, by móc wrócić tą samą drogą. W kontekście stron internetowych breadcrumbs spełniają podobną rolę – pomagają użytkownikowi zrozumieć, gdzie się znajduje, i umożliwiają szybki powrót do poprzednich poziomów nawigacji.

Czym są okruszki nawigacyjne?

Breadcrumbs to ciąg linków, zwykle umieszczony w górnej części strony, który pokazuje ścieżkę od strony głównej do bieżącej lokalizacji. Przykład:

Strona główna > Blog > SEO > Co to są breadcrumbs?

Każdy z elementów (oprócz ostatniego) to aktywny link, który pozwala użytkownikowi cofnąć się do danego poziomu witryny.

Główne typy breadcrumbs

Istnieją trzy główne rodzaje nawigacji okruszkowej:

  1. Hierarchiczne (location-based) – pokazują strukturę strony, np.: Strona główna > Kategorie > Elektronika > Smartfony
  2. Atrybutowe (attribute-based) – stosowane głównie w e-commerce, pokazują cechy produktu: Strona główna > Buty > Damskie > Rozmiar 38 > Kolor: Czarny
  3. Historyczne (path-based) – pokazują ścieżkę użytkownika (rzadziej stosowane): Strona główna > Poprzednia strona > Poprzednia strona 2 > Obecna strona

Korzyści z breadcrumbs

Użyteczność (UX):

  • Pomagają użytkownikom szybko zorientować się w strukturze strony.
  • Ułatwiają nawigację w głąb serwisu i powrót do wcześniejszych sekcji.

SEO (optymalizacja pod wyszukiwarki):

  • Wspierają indeksację witryny przez roboty Google.
  • Okruszki chleba mogą być wyświetlane w wynikach wyszukiwania (tzw. rich snippets), co poprawia widoczność i CTR.
  • Zmniejszają współczynnik odrzuceń, kierując użytkowników do wyższych poziomów zamiast opuszczania strony.

Gdzie warto stosować breadcrumbs?

  • Sklepy internetowe (e-commerce)
  • Blogi z rozbudowaną strukturą kategorii
  • Strony korporacyjne z wielopoziomowym menu
  • Portale informacyjne i edukacyjne

Kiedy nie stosować nawigacji okruszowej?

  • W bardzo prostych witrynach (np. one-page)
  • Jeśli nawigacja okruszkowa byłyba identyczne dla większości podstron – tracą wtedy sens i przejrzystość
Oceń ten artykuł

Podziel się: