Co to jest Breadcrumbs?

Zobacz kurs SEO w formie e-booka, który krok po kroku pokazuje jak pozyskiwać klientów z Google. Dowiesz się z niego, jak zaplanować i wdrożyć stronę nastawioną na pozyskiwanie klientów z wyszukiwarek.

Breadcrumbs zazwyczaj są wyświetlane na górze strony i pokazują ścieżkę od strony głównej (home) do bieżącej lokalizacji użytkownika na stronie. Na przykład, jeśli użytkownik znajduje się na stronie z artykułem o ogrodnictwie na blogu o ogrodnictwie, breadcrumbs mogą wyglądać mniej więcej tak:

Home > Blog > Ogrodnictwo > Jak dbać o rośliny doniczkowe

Każdy z tych elementów jest zazwyczaj klikalny, co pozwala użytkownikowi na szybki powrót do dowolnej wcześniejszej lokalizacji w hierarchii.

Breadcrumbs są szczególnie użyteczne na skomplikowanych witrynach z dużą ilością zawartości i wielopoziomową strukturą, ponieważ pomagają użytkownikowi zorientować się, gdzie się znajduje, i jak można wrócić do innych sekcji strony. Nie są jednak zawsze konieczne na prostych witrynach z niewielką liczbą stron.

Dlaczego stosowanie breadcumbs pomaga w UX?

Breadcrumbs (okruchy chleba) są narzędziem nawigacyjnym, które poprawia doświadczenie użytkownika (UX) na różne sposoby:

1. Orientacja w Witrynie: Pomagają użytkownikom zrozumieć, gdzie się znajdują w kontekście witryny. To jest szczególnie przydatne w dużych i skomplikowanych witrynach z wieloma poziomami nawigacji.
2. Łatwy Dostęp do Wyższych Poziomów Hierarchii: Umożliwiają użytkownikom łatwy powrót do wyższych poziomów struktury witryny, bez konieczności korzystania z przycisku „Wstecz” w przeglądarce lub nawigowania na nowo przez menu.
3. Oszczędność Czasu: Dzięki klikalnym elementom breadcrumbs, użytkownicy mogą szybko przechodzić między różnymi sekcjami strony, co oszczędza czas.
4. Zwiększenie Zrozumienia Struktury Witryny: Pokazując hierarchię witryny, breadcrumbs pomagają użytkownikom zrozumieć, jak jest zorganizowana zawartość i jak można do niej dotrzeć.
5. Zmniejszenie Liczby Kliknięć: Umożliwiają użytkownikom przejście do poprzednich sekcji witryny za pomocą jednego kliknięcia, w przeciwieństwie do nawigowania przez menu, co często wymaga wielu kliknięć.
6. Zwiększenie Poziomu Zadowolenia: Zrozumiała i efektywna nawigacja zwiększa satysfakcję użytkowników, co ma pozytywny wpływ na ich ogólne doświadczenie.
7. SEO (Optymalizacja dla Wyszukiwarek): Choć nie są bezpośrednio związane z UX, breadcrumbs mogą również wpłynąć pozytywnie na optymalizację dla wyszukiwarek, ponieważ pomagają robotom wyszukiwarek zrozumieć strukturę witryny.
8. Spójność: Breadcrumbs mogą dodawać element spójności do różnych stron na witrynie, co również ułatwia użytkownikom zrozumienie, jak różne elementy są ze sobą powiązane.
9. Możliwość Personalizacji: Na niektórych witrynach breadcrumbs mogą być dostosowane do indywidualnej ścieżki użytkownika, co dodatkowo poprawia UX.

Dzięki takiemu zestawowi zalet, breadcrumbs są szeroko stosowane w projektowaniu witryn internetowych i aplikacji, aby ułatwić nawigację i poprawić ogólne doświadczenie użytkownika.

Jakie są rodzaje breadcrumbs ?

Breadcrumbs można klasyfikować na kilka sposobów w zależności od ich funkcji i prezentacji. Oto kilka najpopularniejszych typów:

Lokalizacyjne (Location-based Breadcrumbs)

Te breadcrumbs śledzą strukturę nawigacyjną strony i pokazują użytkownikowi, gdzie obecnie się znajduje w kontekście hierarchii strony. Na przykład:

Home > Artykuły > Ogrodnictwo > Jak dbać o rośliny

Historyczne (Path-based Breadcrumbs)

Te breadcrumbs pokazują ścieżkę, którą użytkownik przebył, aby dostać się do bieżącej lokalizacji. Działa to podobnie do historii przeglądarki i jest dynamiczne w zależności od interakcji użytkownika. Na przykład:

Home > Wyszukane wyniki > Artykuł o ogrodnictwie

Atrybutowe (Attribute-based Breadcrumbs)

Są stosowane głównie w sklepach internetowych i innych stronach, gdzie zawartość można filtrować według różnych atrybutów. Na przykład, na stronie z produktami:

Home > Elektronika > Laptopy > Intel > i7

Hierarchiczne (Hierarchical Breadcrumbs)

Jest to najbardziej tradycyjny typ breadcrumbs, który pokazuje strukturę hierarchiczną strony. Jest to bardzo podobne do breadcrumbs lokalizacyjnych, ale zawsze odzwierciedla strukturę witryny, a nie koniecznie ścieżkę, którą użytkownik przebył.

Home > Dział > Poddział > Strona

Niektóre strony używają kombinacji tych różnych typów, w zależności od kontekstu i potrzeb użytkowników. Wybór odpowiedniego rodzaju breadcrumbs zależy od wielu czynników, takich jak rodzaj zawartości na stronie, oczekiwania użytkowników i celów biznesowych.