Page contents
Use of headings (H2) and subheadings (H3)
The page title is automatically set by Squiz Matrix as H1.
If your page is long or contains a lot of distinct information, use headings and subheadings to divide it into sections and help customers to find information quickly.
- H2 = main headings (before H3)
- H3 = subheadings after H2's
- H4 are not used that often as they are the same as bold and should only sit under a H3 subheading
- Use headings in order to divide you page: H2 before H3 (H3 can't be used without H2)
- Use the headings button format headings (H2) and subheadings (H3)
- Do not use bold on headings
- Only use capitals for the first letter
- Headings and subheadings must not be used as links
- Use clear and relevant headings to help users find information quickly on your page.
- Use anchor links at the top of the page to link to the sections for quick navigations. (Please see page layout for more information about anchor links)
Examples
The Web standards for PDFs and other file types page is a good example of how headings are used to divide a page into sections.
Reason for this web standard
Subheadings are used to:
- structure a page
- allow customers and those with screen readers, to scan and navigate down a page quickly to find the information they need.
Do not make headings into links
- Links should not be added to H2 headings and H3 subheadings..
- Add a link to a webpage or website on a separate line under the heading.
- The link text should be the name of the webpage or web site and not the URL.
- Format into a bulleted list if more than one link.
Example
Age UK
Age UK provides information and vital direct services to people in later life throughout the UK.
Website: Age UK website
Reason for this web standard
User testing shows people are more likely to notice a link in the body text than a link as a heading or subheading.
Browsers and screen readers can display links and headings differently. When a heading is also a link they make the text difficult to read or identify as a link.
Acronyms and jargon
- Avoid using jargon and acronyms. If you do, explain them in full in the first instance with theacronym in brackets.
- Use 'and' not '&', 'for example' not 'e.g' and 'that is' and not i.e
Reason for the web standard
Avoiding jargon and acronyms helps ensure the message reaches a broader audience without confusion.