Breadcrumb Navigation

Breadcrumb navigationBreadcrumb navigation shows a page's path within the website hierarchy. It improves user orientation and complements internal linking.Open glossary entry → is a small path indicator usually placed above the main content. It shows where a page sits within the site structure, for example:

Home > Guides > Shoe care > Leather shoes

Each level is typically an internal linkInternal linking refers to links that connect pages within the same website. They control how search engines and users find and thematically classify content.Open glossary entry → that leads back to the higher-level page. This gives breadcrumb navigation two functions: it improves user guidance by making a page's context visible, and it complements internal linking with clear, hierarchically ordered links.

Breadcrumbs support flat, comprehensible structures and help link categories and parent pages consistently. However, they do not replace contextual links in the main content, which matter more for topical relationships. Search engines can also display breadcrumbs in search results and thus understand a website's structure better.

Why breadcrumbs help #

Breadcrumbs show users where they are in the site hierarchy and give crawlers a second, structured path through the architecture — useful on deep sites where the main navigation cannot link everything. Google can display the breadcrumb trailBreadcrumbList is a schema type that describes a page's breadcrumb navigation in a structured way, making its position within the site hierarchy machine-readable.Open glossary entry → instead of the raw URL in search results, which makes listings more readable.

Implementation notes #

RenderJavaScript rendering is the process by which a browser or crawler executes JavaScript code to build the final, visible page. Content that is not already in the delivered HTML only appears after this step.Open glossary entry → breadcrumbs as a <nav> with an ordered list, mark the current page as plain text (not a link), and pair the visible trail with BreadcrumbList JSON-LDJSON-LD (JavaScript Object Notation for Linked Data) is a data format for embedding structured data in a page, separate from the visible HTML. Google recommends it where technically possible.Open glossary entry →. The visible path and the schema must match — inconsistencies get both ignored.