DCJ Digital Design System

Side navigation

The side navigation shows a user's current position in the content hierarchy beyond the main navigation, allowing them to navigate between sections and related content.

Refer to NSW Digital Design System - Side navigation for full guidance and demo on how and when to use this.

Preview

A screenshot of the side navigation component with red labels to describe its feature.
Labels: 01 title, 02 parent link.

Placement

Side navigations should only be placed on the narrower left-hand or right-hand side of a content page.

DCJ usage guidelines

Consider the type of content and choose a navigation method that can facilitate a smooth flow through the website. Ensure that the parent page is relevant to the content the user is reading.

Single level navigation

Navigation that shows only the pages on the same level of content hierarchy.  Please refer to the Digital NSW single level navigation (sibling navigation). This user guide for the component uses the single level side navigation.

Multiple level navigation

If one level does not offer enough context, it may be appropriate to select a maximum of up to two levels above. For example, on the "NSW Statutory Declaration Forms" page,  (see screenshot) the side navigation selects up to two levels above the current page, identifying "Justice of the Peace" as its parent page in side navigation. However, if we opt for single level navigation, then "Find a JP" becomes the parent page.

A screenshot of the side navigation component with red labels to describe its feature.
Labels: 01 parent page, 02 reflect the site's hierarchy, 3 current page.

Customisation

  • Your website's primary brand colour or a brand accent colour will be applied to the highlights bar.

Accessibility features

  • Providing an ARIA Heading role defines the side navigation title as a heading. 

Page type

A side navigation can be used on:

  • content pages.

It cannot be used on:

  • homepage
  • landing pages
  • campaign pages
  • Easy Read.
Last updated:

19 Jun 2024