Use breadcrumbs to show pages that separate the Homepage from the current page. Along with showing users where they are, it allows them to go back to a parent level.
Best Practices
- Due to its complimentary role, breadcrumbs should never be integrated into the main content. Stepper Will be a clickable link that makes you jump to the associated page.
- Breadcrumbs are only used for the hierarchical structure of a site; opt for the stepper for any other paths (for a marketing funnel, for example).
- Each element of the Breadcrumb should be separated by a “>“ to clearly show the chronology.
- The chronology must always be shown from left to right (the element furthest to the left must be the homepage) and the nearest the actual page.
- The last element of the Breadcrumb must always be the same as the title of the current page.
- Breadcrumbs do not show the user’s path, but the parent pages of the current page.
Placement
Breadcrumbs are always located at the top of the page, typically between the navigation bar and the title.
Appearance
The Breadcrumb is displayed in the form of a line of text in which each page is a distinct link separated by an arrow.
Behavior
Each element of the Breadcrumb is a link and mirrors the characteristics of the latter element (see Links).
