Information on using a standard list for site navigation

The standard list is the third level of navigation on the site. Each item in the list represents an article or guide and clicking on it will take the user to the related content page.

Items are displayed in a stacked list which allows longer titles and descriptions to be included, maximising the opportunity for users to identify the specific content they seek.

Tiled menu with first tile showing the hover state applied.

Design Theory Lists are a traditional form of ordering written content and allow users to engage a natural reading pattern to sift through the various options presented. Lists can be easily and quickly scanned and are particularly suited to displaying similar, repetitive content.

Lists can also give the impression of ranked or ordered content and the format translates well to small screen devices, being easily scrolled and selected when adequate target area (selection area for touch screen devices) is incorporated into the design.

Lists also help to bring an impression of consistency to irregular content where text varies in length for the options included.

Usage Lists are ideal for incorporating multiple options below the fold due to their compatibility with scrolling. An adequate target area should always be used for mobile devices, Apple’s iPhone Human Interface Guidelines recommends a minimum target size of 44 pixels wide 44 pixels tall. As with other types of navigation, providing hover and active states for items in the list will provide users with a visual cue which highlights the item selected, guarding against mistaken clicks.

Using lists in combination with other types of navigation will facilitate an experience of progression for users.

The standard list is the third and final levels of navigation used on the site, with a tiled menu being the primary form and a standard list being the third level.

Accessibility All text included in list items should be readable by assistive technology such as screen readers and each item must be operable by a keyboard in addition to a mouse.