Skip to main content

Breadcrumb

The Breadcrumb informs the users on their current location relative to the homepage of the website and allows them to navigate to higher levels. It is a series links except the last item in the group, which is the current page.

Do's​

  • the first element of the breadcrumb must always be labelled "Home" and must link to the homepage of the actual site where the current user page is located

Don'ts​

  • use long labels which creates visual clutter
  • breadcrumb links cannot exceed 220px in length else they will be truncated

When to use​

  • if your website's navigational structure is a tree of more than 2 levels

When not to use​

  • if your website's navigational structure has less than 3 levels of depth