Breadcrumbs

Breadcrumbs potocznie nazywane "okruszkami chleba" to ścieżki nawigacji użytkownika. Dzięki nim podczas przeglądania witryny możemy bez problemu zorientować się, gdzie w strukturze serwisu jesteśmy i możemy łatwo powrócić do innych kategorii. Dobrze skonstruowana ścieżka ułatwia szybkie znalezienie kategorii i strony, które interesuje użytkownika.
2021-03-19 00:00
2 minuty czytania

Gdzie znajdują się breadcrumbs na stronie?

Breadcrumbs znajdują się w widocznym miejscu, najczęściej na górze witryny. Są niezwykle ważne przy tworzeniu serwisów o hierarchicznej strukturze, gdzie występuje wiele katalogów i podkatalogów. Przykładowo mogą to być sklepy internetowe lub blogi.

Skąd wzięła się nazwa breadcrumbs?

Słowo breadcrumbs z języka angielskiego dosłownie oznacza okruszki chleba. Inspiracją do użycia tej nazwy do oznaczenia ścieżki struktury serwisu była bajka o Jasiu i Małgosi. Dzieci podczas swojej wędrówki po lesie zostawiały okruszki chleba, które miały pomóc im w powrocie do domu.

Podobnie jak mali bohaterzy, użytkownicy twojego serwisu internetowego także czasem chcieliby wiedzieć, jak daleko się wybierają, klikając w wyświetlone przez wyszukiwarkę zagadnienie. Za pomocą ścieżki nawigacyjnej przeglądający, wyświetlając podstronę, może także bezproblemowo wrócić do wyższej hierarchicznie struktury i z łatwością odnaleźć się na witrynie.

Dlaczego breadcrumbs są ważne dla SEO?

Nazwy kategorii najczęściej zawierają słowa kluczowe. Zainteresowany, wpisując hasło w wyszukiwarkę, określa konkretnie, czym jest zainteresowany. Jeżeli breadcrumbs są dobrze zoptymalizowane, potencjalnemu klientowi wyświetli się cała strona wraz z podstroną, która zawiera słowo kluczowe. Zwiększy się wtedy częstotliwość wyświetlania witryny w wyszukiwarce.

Taki zabieg ma także na celu zmniejszenie współczynnika odrzuceń. Użytkownicy paradoksalnie wolą wyszukać interesujące ich treści w pasującej kategorii niż błyskawicznie otrzymać oczekiwaną zawartość. Celem SEO jest przyciągnięcie odbiorcy na konkretną stronę i jak najdłuższe zatrzymanie go na witrynie. Prawdopodobnie zainteresowany więcej czasu spędzi podczas szukania potrzebnego elementu w całym dziale, niż wyświetlając gotowe zagadnienie.

Rodzaje breadcrumbs

Możemy wyróżnić trzy rodzaje breadcrumbs.

Breadcrumbs oparte na lokalizacji

To najczęściej stosowane "okruszki chleba". Na stronie, gdzie zostały zastosowane, użytkownikowi wyświetlają się kategorie od najwyższej do najniższej, gdzie aktualnie znajduje się zainteresowany. To elementy, na które można kliknąć, więc przeglądający może wybrać wyższy hierarchicznie katalog.

Breadcrumbs oparte na atrybucie

Wynikają z zastosowania przez użytkownika filtrów wyszukiwania na stronie. Po przesortowaniu wyników przeglądający wybiera podstronę, na której najprawdopodobniej znajdzie interesujące go zagadnienie.

Breadcrumbs oparte na ścieżce

Jest to rzadko używany rodzaj breadcrumbs, ścieżka prezentuje historię wcześniej odwiedzonych stron.

Elementy breadcrumbs

Ważnym elementem breadcrumbs jest nazwa ścieżki. Hasło powinno być krótkie, lepiej nie używać długich linków zawierających słowa kluczowe. Gdy nazwy kategorii są długie, ścieżka będzie wykraczać poza miejsce wyświetlenia. W takim wypadku zostanie ona zastąpiona wielokropkiem w wyszukiwarce.

"Okruszki chleba" zawierają także tzw. separatory, które oddzielają linki. Najczęściej używa się znaków ">" lub ">>". Przekazują użytkownikowi informacje na temat hierarchii strony. Separator dobiera się do wyglądu konkretnej witryny. Na wybór tego elementu wpływa także rodzaj menu używanego na stronie. Znaki oddzielające w ścieżce nawigacyjnej powinny mieć mniejszy rozmiar niż nadrzędne menu nawigacji.

Przy konstruowaniu ścieżki nawigacyjnej trzeba także pamiętać o tym, aby była subtelna. Nie powinna dominować nad innymi ważniejszymi elementami strony. Breadcrumbs mają bowiem charakter pomocniczy dla przeglądającego.


Blog Artykuły
Ustawienia dostępności
Wysokość linii
Odległość między literami
Wyłącz animacje
Przewodnik czytania
Czytnik
Wyłącz obrazki
Skup się na zawartości
Większy kursor
Skróty klawiszowe