Menu okruszkowe tzw. Breadcrumbs – Poradnik
Zastanawiałeś się kiedyś, dlaczego na niektórych stronach czujesz się zagubiony, a na innych od razu wiesz, gdzie jesteś? Często chodzi o jeden mały element – menu okruszkowe, czyli breadcrumbs.
Co to w ogóle jest?
Wyobraź sobie, że jesteś w galerii handlowej. Stoisz przed sklepem z butami, ale szukasz też czegoś dla dziecka. Zamiast wracać do głównego wejścia i szukać od nowa, patrzysz na tabliczkę nad sobą: “Poziom 2 > Moda > Buty”. I od razu wiesz, że żeby znaleźć ubranka dziecięce, musisz wrócić do “Moda”.
Tak właśnie działają breadcrumbsy w internecie. To taka nawigacja, która pokazuje:
- Gdzie jesteś
- Jak tu trafiłeś
- Jak wrócić do poprzednich sekcji
Przykład z życia: Jak szukam części do swojego samochodu, to widzę:Strona główna > Sklep > Części samochodowe > BMW > Seria 3 > 2015-2018 > Felgi
Po co to komu?
Dla Ciebie jako użytkownika:
- Nie musisz ciągle klikać “wstecz” w przeglądarce
- Wiesz, w którym miejscu strony jesteś
- Możesz łatwo przeskoczyć 2-3 poziomy wyżej bez szukania
Dla właściciela strony:
- Google lubi takie strony – lepiej się pozycjonują
- Ludzie dłużej zostają na stronie, bo nie gubią się
- W wyszukiwarce czasem widać całą ścieżkę, co przyciąga uwagę
Rodzaje breadcrumbsów – nie wszystkie są takie same
- Standardowe (hierarchia)
To te najczęstsze. Pokazują strukturę strony:Home > Blog > WordPress > Jak zainstalować motyw - Atrybutowe (filtry)
Używane głównie w sklepach. Pokazują, jakie filtry wybrałeś:Home > Laptopy > Marka: Dell > Cena: do 3000 zł > Ekran: 15 cali - Ścieżkowe (Twoja historia)
Rzadko używane, bo mogą mylić. Pokazują, gdzie klikałeś:Home > O nas > Kontakt > Cennik– nawet jeśli Cennik jest w głównym menu
Jak to zrobić dobrze? Z mojego doświadczenia
Gdzie to umieścić?
Zawsze na górze strony, pod głównym menu. Ludzie szukają tego w jednym miejscu.
Jak to wygląda?
Używaj strzałek “>” albo ukośników “/”. Ostatni element (gdzie jesteś) niech będzie nieklikalny, może być pogrubiony.
Najważniejsze – dane dla Google:
Jeśli chcesz, żeby Google pokazywało Twoją ścieżkę w wynikach wyszukiwania, musisz dodać specjalny kod. Wygląda to mniej więcej tak:
html
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "Strona główna",
"item": "https://twojastrona.pl"
},
{
"@type": "ListItem",
"position": 2,
"name": "Blog",
"item": "https://twojastrona.pl/blog/"
}
]
}
</script>
Sprawdź potem w Google Rich Results Test, czy wszystko działa.
Kiedy NIE robić breadcrumbsów?
- Jak masz małą stronę (5 podstron) – to bez sensu
- Na stronie jednopoziomowej (one page)
- Jak główne menu jest tak dobre, że breadcrumbsy są zbędne
Z mojej praktyki
Pamiętam klienta, który miał sklep z elektroniką. Ludzie wchodzili na produkt i… wychodzili. Dodaliśmy breadcrumbsy i okazało się, że:
- Współczynnik odrzuceń spadł o 15%
- Ludzie częściej wracali do kategorii nadrzędnej
- W Google pojawiły się ładne ścieżki przy wynikach
Nie mówię, że to magiczna różdżka, ale często te proste rzeczy robią robotę.