The hat provides a global utility navigation for our websites. It's designed to hold three key website elements:
- Role
- Region
- Login
The hat will be applied to every website in our estate - providing a consistent signpost to global utility functions.
Related
The hat
Usage guidelines
Do's
- The hat must be at the top of the site on all pages
- House global site functions
- Show users the selections they have made and provide function to amend selections
- Remain a consistent height of 48px. Height should not be increased for any reason
- Design should remain consistent across every website
- Only Quilter.com can utilise the hat for share price
Don'ts
- No other content aside from role/region/login/share price should be shown in the hat
Behaviour
Roles
- Tab style role select if there are two or less roles
- Selected state should reflect user choice
- When there are more than two roles the roles this will become a dropdown select list
- Ability to change role selection by clicking on alternative tab or list item
- On selection of role a cookie is set to remember this preference
Regions
- Dropdown select from a list
- Selected state should reflect user choice
- Ability to select from list and change region selection
- Region selection can determine language
- On selection of region a cookie is set to remember this preference
Login
- Primary button to enable users to login to online services
- Button is an optional feature within the hat
- If there is more than one system to choose from this will allow link to a page where the user can choose the correct system
- If in a cookie a user has already chosed a login system the login button will show the system matched to the cookie