Navigation Menu

Our sites will require some form of navigation to help users find the information they’re looking for. Whether or not a mega menu or a simple dropdown menu suffices depends entirely on the size of the information architecture. The navigation components are designed to be used in conjunction with the header component.

The main navigation component is intended to be used as the primary means of navigation around the website. It typically accommodates the first one to two levels of the information architecture. On mobile devices, the menu collapses into a mobile-friendly menu design that has been designed specifically for that purpose.

Desktop

Desktop mega menu

4 column mega menu for desktop. Alternatively, 3 columns can be used also.

Mobile

Primary Mobile navigation menu

The primary navigation menu for mobile devices

Secondary navigation menu for mobile

The secondary navigation menu for mobile devices exposing two levels of the information architecture.