Breacrumb inform the users on their current location relative to the homepage of the website and allows them to navigate to higher levels.
Anatomy
The breadcrumb is an horizontal set of links* starting from the homepage or root of the hierarchy and work down to the current location.
* except the last item in the group, which is the current page
| Elements | Constraint |
|---|---|
| Label | Mandatory |
| Link | Mandatory |
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
- if your site navigational structure isn't a tree
DO's
illustration: Digital Single Market > Policies > Shaping the digital single market
- Put your site name as first segment ex: "digital single market".
DON'Ts
- Put "home" as first segment. "home" is too ambiguous in the context of the EC web-presence, it could be EC homepage or the current "subsite" homepage.
Illustration: European Commission > Priorities > Digital Single Market
Illustration: European Commission > Strategy > Digital Single Market
- Put "European Commission" as a first segment, avoiding inconsistencies and dependencies with the breadcrumb from the main EC site.