Why we need headings
We use headings on web pages to add structure to our content and make it accessible to everyone.
Well-structured content makes our web pages and the information on them easier to find, read, and understand.
Use the correct heading hierarchy
When you add headings to your content, you must use heading styles in the correct hierarchy.
Heading styles help people understand how the content fits together on the page.
Visually, they are the size that headings are presented on the page. They also tell screen readers and other assistive technology how to read the text aloud. Assistive technology allows users to hear the headings on the page, with the heading style, so they can understand the structure of the page.
The first heading for every section on a page should be Heading 1. If you need to add subsections within this section, use Heading 2, and so on. When you make a new section, go back to Heading 1.
In other words:
- Heading 1 describes the whole section
- Heading 2 is a subsection of Heading 1
- Heading 3 is a subsection of Heading 2
Never skip heading styles, for example, don't follow a Heading 1 with a Heading 3. This confuses users and makes our content inaccessible to people using assistive technology.
Don't choose your heading based on visual appearance. The pages on the University website are designed to display content clearly based on the needs of our users, so it's important that you format your content correctly.
How to create headings in Typecase
Required heading fields
Some Typecase components include required heading fields for you to add headings to each section of your page. These headings fields automatically create a Heading 1. Don't add Markdown formatting characters to these fields.
Content types with required heading fields include:
- Case study
Body copy fields
In components with required heading fields, you can create subsections in the main body copy of the section by using Markdown to add headings. Start with Heading 2 and use a new component for the next Heading 1.
Some content types don't have any required heading fields, so you need to use Markdown formatting to create all your headings, including Heading 1s, in the body copy field.
Content types without required heading fields include:
- Corporate information
- Team profile
Using Markdown to create headings
Use Markdown formatting to add headings in a body copy field.
To create a Heading 1, put a hash symbol (#) in front of the text. Follow the heading text with a hard return.
Use two hash symbols to create a Heading 2 and three for a Heading 3.
These display as:
How to write good headings
When you write headings, use plain English to describe what each section is about as concisely as possible.
Don't use headings:
- that are questions - questions can make people doubt the content - give a clear statement instead
- with hyperlinks - this is inaccessible to people using assistive technologies - add links to the main body of text below the heading
- to make a sentence or paragraph stand out - this makes our content inaccessible to people using assistive technologies