Overview
Banners are used to introduce a page, their content should reflect the goals, content and purpose of the page they're on.
Our banners have been specifically designed to help communicate the information architecture of the website with different banners recommended for different page types.
Banners in our Design System incorporate the positioning and styling of breadcrumbs, Heading 1 text, page descriptions, call to actions, images or illustrations and range of colour options.
There are four types of standard page banners in our Design System:
- No banner
- Default banner
- Basic banner
- Advanced banners
No-banner
The no banner is comprised of our breadcrumbs style located within a section container.
The no banner style is used for pages where vertical height is an important consideration. This style includes the breadcrumbs only and the rest of the banner content is placed within the content of the page.