Navigation Bar

Users rely on the navigation bar to navigate and orient themselves in your UI.

The navigation bar is essential to a product’s UI. It is a consistently available user interface element. The navigation bar provides consistent locations to invoke your product’s local navigation as well as giving access to a user's account.

Anatomy

  1. Header menu. The head menu includes the company logo and serves as a link to the homepage.
  2. Menu-items. Menu items trigger sub-menus for further navigation options.
  3. Sub-menu items. Sub-menu items provide secondary navigation links under primary menu items.
  4. Sub-sub-menu items. Sub-sub menu items allow deeper navigation within the sub-menu structure.
  5. Direct-link menu items. Direct-link menu items navigate directly to specific pages.
  6. CTA button. A call to action button provides access to a relevant user action.