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:

Hierarchiczne (location-based) – pokazują strukturę strony, np.: Strona główna > Kategorie > Elektronika > Smartfony
Atrybutowe (attribute-based) – stosowane głównie w e-commerce, pokazują cechy produktu: Strona główna > Buty > Damskie > Rozmiar 38 > Kolor: Czarny
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.