The page header is a pattern that helps define the uppermost part a webpage. The page header pattern is a template that helps combine other components (breadcrumbs, headings, actions, and selects) to create a consistent user experience.
The standard page header contains:
1 – Logo: Company logo will be display on the top left corner.
2 – Module menus: The module menus to the left of the interface provides access to the applications modules with three levels: Module, Sub module, and Sub sub-module.
4 – User navigation bar: The bar includes the user’s login credentials, the environment they are logged into (UT or Live), and logout.
4 – Application menu bar: The application provides users with access to the applications they have been granted permissions for.
5 – Breadcrumb bar: Allows users to understand where they are within the context of the applications and modules and to be able to navigate back.
6 – Page location bar: Provides the user with the actual location they are within an application and module, sub module or sub sub-module.
7 – Buttons: Use primary, secondary or other buttons defined in the Button guidelines.
8 – Search Bar/filter: The search bar / filter is an optional but common pattern in co8. It allows users to refine the page content on a more granular level using a search or filter.
9 – Footer Bar: The footer banner defines the end of the page. and display the privacy statement, terms of use and B2BE copyright.
Design Guidelines 