Headings determine the structure and hierarchy of your content so they are very important for both the accessibility and the general readability of your content. They even affect how search engines like Google find and rank your pages.
Poor headings make it hard for people to:
- Scan the content to see which sections are relevant to them
- Determine the hierarchy and grouping of the content
This is particularly important for visually impaired people using screen reading software as these will often group headings together according to the structure and allow people to skip to certain sections of the page. If that structure is not correct then screen reader users may not understand the structure of your content or be able to navigate it properly.
According to a WebAIM survey of 1,792 people in October 2017, 67.5% of screen reader users navigate pages using headings.
Use of heading styles
Whether you are using t4, blogs, Wikis or even Word to create your content, all these platforms have different heading styles. The main rule for how you use these is exactly the same:
Heading styles are for grouping and adding a hierarchy to your content, not for styling.
This means that you must use the lowest numbered heading style first, followed by the next lowest number for any sub headings and so on. This will create a hierarchal structure to the page like this:
- Heading 1
- Heading 2
- Heading 3
- Heading 3
- Heading 2
- Heading 3
- Heading 3
- Heading 4
- Heading 5
- Heading 4
- Heading 2
For editing the College website, the Heading 1 is reserved for the title of the page, so t4 editors can only use headings 2 to 6 in the main page content.
Heading 2
Some text
Heading 3
Some text
Heading 4
Some text
Heading 5
Some text
Heading 6
Some text
Top tips for writing effective titles and headings
Headings do’s
- Do use Heading 1 (h1) as your main heading on your page, followed by h2, h3 and so on to maintain content hierarchy
- Do use keywords in headings and try and make this the first or second word if possible e.g. 'Master's courses information' rather than 'Information about Master's courses'
- Do use the active verb if the page is for doing the thing. E.g 'Submit your proposal', 'Apply for a course' or 'Book a room'
- Do include content to support each header
- Do use the present participle (ending 'ing) if the page is about doing that thing, but users would do that thing elsewhere. E.g. 'Applying for a course', 'Booking a room' etc.
- Do try and keep headings and titles as succinct as possible - they need to be scannable
- Do use sentence case - only capitalise the first word unless it is a proper noun (name of something)
Headings don’ts
- Don’t use headings simply to apply effects to your text
- Don’t apply the Heading 1 style to more than one heading on a page
- Don’t use the same heading on every page.
- Don't use title case e.g. This Is An Example Of Title Case
For more advice, read this blog post Headings on your website pages: Do's and Don'ts, or this article with Tips for Using H1 to H6 Right Way.
Accessibility
Using headings properly is also essential to make your content readable for people using screen readers. You can read more about Using clear and effective headings in our accessibility guidance.
Further reading
- Headings Are Pick-Up Lines: 5 Tips for Writing Headlines That Convert (Nielsen Norman Group)
- in the Brand and style guide