Design

Research and rationale

The design of the footer is based on the underlying structure of the DTA Design System whilst incorporating the mandatory legislation and requirements outlined in the pre-existing Queensland Government CUE Web Guidelines. The design also leverages the layout set by the Australia Department of Health website which is also based on the DTA Design System, whilst incorporating existing components and patterns that are currently used in the Queensland Government franchise website.

Modular design

Our footer layout has been designed to be modular and can be tailored to adapt to the addition or removal of optional components. Users can easily tailor the footer content to meet their sites needs and it will still scale and respond correctly across all screen sizes.

Custom links

The design of the footer specifically caters for a region of optional links that allow users to bypass the main navigation, or access external links. This section provides users with easy access to additional links both internal and external, allowing them to continue their journey. The feature was inspired by the NSW Design System footer.

Acknowledgement of country

We received feedback that the current placement of the AoC was not prominent enough, and its position between the Queensland Government coat of arms and the copyright text might undermine its significance. In a recent update to address this, we have added a header to the AoC and repositioned it away from the coat of arms and copyright.

Legal information and link to qld.gov.au

In accordance with conformance with the  Digital services policy all sites must include copyright information. The last link in the footer should also be a link to the Queensland Government homepage the text to be used is 'Queensland Government'.

Government links

Information on using our website and common Queensland Government links are crucial for all sites. The order of these links is  consistent across all Government Websites. These incorporation of these links has been an inherited from pre-existing website guidelines know and the CUE (Consistent User Experience Guidelines).

Colour

The colours and components can be changed easily to cater for any site's identity and brands with the the Queensland Government Brand architecture. It recommends that sites opt for a dark or dark alt footer design to contrast the primary content section.

Social links

In alignment with the brand requirements of the relevant organisations, our design system exclusively employs a black and white colour scheme for all social link icons. Social links are optional and the social section can be turned off if not needed. The order of social links can also be changed based on the preferences of the site owner.

Contact information

As contact information is more frequently required its prevalence in the design was elevated over the other footer navigation links, some contact information is also able to be surfaced within the footer reducing the need for users to click through to a separate contact page.

Border

Like the DTA we’ve used a thick line style to delineate our footers from the body. This supports the ‘visual loudness’ practice we've implemented in the Design System.

Footers in vertical navigation

The footer pattern for vertical navigation websites is similar to the default pattern. The only difference is it's justified to the left and right of the screen rather than centred. This is only visible on the xl screen sizes.

Doormat navigation

Some sites choose to repeat the primary navigation in the footer, this is known as doormat navigation. We chose not to implement this as an option in our footer as we intend to explore sticky header navigation as an alternative to this pattern.