Breadcrumb (okruszki nawigacyjne) to drugorzędna ścieżka nawigacji wyświetlana na stronie internetowej, wskazująca pozycję użytkownika w hierarchii serwisu: Strona główna > Elektronika > Smartfony > iPhone 15. To, co wygląda jak prosty komponent UX, odgrywa znaczącą rolę SEO: wzmacnia linkowanie wewnętrzne, pomaga wyszukiwarkom zrozumieć architekturę serwisu i umożliwia uzyskanie rich snippeta w SERPach Google — techniczny URL jest zastępowany czytelną ścieżką nawigacji bezpośrednio w wynikach wyszukiwania.
Rodzaje breadcrumbów
Istnieją trzy rodzaje breadcrumbów. Breadcrumby oparte na lokalizacji (najczęstsze) odzwierciedlają pozycję strony w hierarchii serwisu: Strona główna > Kategoria > Podkategoria > Produkt. Breadcrumby oparte na ścieżce pokazują rzeczywistą trasę nawigacji użytkownika, która może różnić się od hierarchii strukturalnej — mniej przydatne dla SEO, ponieważ różnią się w zależności od użytkownika. Breadcrumby oparte na atrybutach są używane na stronach z filtrowanymi wynikami: Strona główna > Odzież > Czerwony > Rozmiar M — istotne dla sklepów e-commerce z nawigacją fasetową.
Korzyści SEO z breadcrumbów
- Naturalne linkowanie wewnętrzne: każdy breadcrumb tworzy linki wewnętrzne do stron nadrzędnych, wzmacniając ich PageRank
- Rozumienie architektury: Google używa breadcrumbów do mapowania struktury serwisu i identyfikowania kluczowych stron
- Rich snippety w SERPach: techniczny URL jest zastępowany ścieżką Strona główna > Kategoria > Produkt w wynikach Google
- Zmniejszenie współczynnika odrzuceń: użytkownicy trafiający na głębokie strony mogą poruszać się w górę hierarchii bez użycia przycisku wstecz
- Poprawa CTR: wyniki z breadcrumbami w SERPach są bardziej czytelne i mają tendencję do przyciągania większej liczby kliknięć
Znaczniki BreadcrumbList: implementacja rich snippeta
Aby uzyskać rich snippet breadcrumb w Google, należy zaimplementować schemat BreadcrumbList w JSON-LD. Struktura to lista elementów ListItem, każdy z: @type ListItem, position (numer porządkowy zaczynający od 1), name (wyświetlany tekst dla tego poziomu, np. Elektronika) i item (bezwzględny URL strony nadrzędnej). Ostatni element listy — bieżąca strona — nie potrzebuje URL, ponieważ jest nią sama strona. Google wyświetla następnie w SERPach: Strona główna › Elektronika › Smartfony zamiast technicznego URL.
Breadcrumb wyświetlany w Google
Dobre praktyki implementacji
Skuteczny breadcrumb przestrzega kilku podstawowych zasad: zawsze zaczyna się od strony głównej (jako klikalny link), używa czytelnego tekstu zamiast samych obrazów lub ikon, odzwierciedla rzeczywistą strukturę URL (spójność między URL /kobieta/sukienki/lato a breadcrumbem Kobieta > Sukienki > Sukienki letnie), jest przyjazny dla urządzeń mobilnych (nie obcinany na małych ekranach) i używa wyraźnych separatorów typograficznych (›, /, >). Breadcrumby z więcej niż 4-5 poziomami mogą być obcinane na mobile — preferuj architektury URL z maksymalnie 3-4 poziomami.
Breadcrumby w PrestaShop
PrestaShop zawiera natywny moduł breadcrumb (ps_breadcrumb), który automatycznie generuje ścieżkę nawigacji na stronach produktów, kategorii i CMS, zgodnie z hierarchią kategorii. Znaczniki Schema.org BreadcrumbList są zawarte w domyślnym motywie (Classic) od PrestaShop 1.7.5. Jednak w zależności od używanego motywu jakość znaczników może się różnić. Aby sprawdzić, czy znaczniki są poprawne, użyj narzędzia Rich Results Test Google na stronie produktu swojego sklepu.