Structuring your content

Typography exists to honour content.

It helps guide the reader’s eye. 

One of the most important techniques for effectively communicating (or “honouring”) content is the use of typographic hierarchy.

Typographic hierarchy is a system for organising type that establishes an order of importance within the content, allowing the reader to easily find what they are looking for and navigate.

It helps guide the reader’s eye to where a section begins and ends, whilst enabling the user to isolate certain information based on the consistent use of style throughout a body of text.

There are a few basic methods for establishing a visual typographic hierarchy:

Use headings and subheadings

This is the easiest and most common method for establishing hierarchy.

Use headings, sub headings and text.

The sizes are set in the website.

Page titles should be Heading 1 or H1. This is the only time on the page that you should use H1.

Then the subheadings should be nestled in size order, such as:

H2
H3
H2

or

H2
H2
H2

Font weight

Our font have been chosen to use bolder weights of fonts to help separate headings, sub headings and text.

Text position

Where sections of information are positioned in relationship to each other can establish a hierarchy.

Spacing matters

One of the most important concepts in type design is spacing.

Proper typographic spacing is critical in establishing hierarchy; it can make the difference between confusion and clarity. It is used in the majority of hierarchical systems.

White space

Another key concept is white space.

Don’t be afraid of it, it helps to create hierarchy and improve usability.

Embrace the white space!