Web pages are set out like a magazine. They have text and headings interspersed.
The headings have a hierarchy of 6 levels, starting at page title (heading 1), then heading 2, 3, 4 and down to 6.
People and Google use these headings to scan and understand the page and only then do they decide whether to read it all (or even some of it!).
Heading Structure
The page title provides your heading 1 (H1) level – there should only be one on a page. The theme will usually display this at the top of the page. Some themes allow you to hide it, so that you can replace it with a snazzy image/text header. The theme decides what your heading 1 will look like. You may be able to change/override the font, colour and size combination or you may be just stuck with what it gives you.
Heading 2
This provides the main sub-titles for the page. Again the theme decides the style (font colour size), though you can if you really have to override it. We recommend keeping it the same throughout the site – it provides a consistent look and feel and simply looks much better.
Heading 3
If you need further subheadings, then you use Heading 3. It’s generally smaller than Heading 2, so tells the user that it is a subheading.
Heading 4, 5, 6
There are 3 further levels, but if your page requires all those, then it is far too complex for the ordinary mortal. Think again about your page:
- Should it be several pages?
- Will anyone read it?
- Are you giving too much information?
Why use headings
Some people don’t realise headings exist and use Bold and/or Italics to change the style of the text to provide structure to the page. Please don’t do that!
Google uses the headings to decide how to rank your page. If there are none, it will rank badly.
Bold does not change the size of the text whereas headings do – this makes them easier to see than bold.
A bold heading
And a paragraph after it…
Changing Font size and Colour
The text styles are set in the theme – use the customiser to adjust what you can in your theme. You may be able to change fonts and decide the colour and size of headings. If you leave all the changes at that, then if you later decide that you want to make all headings red, you can make one change and the whole of the site will change.
If you change the colour or size on the page, those changes will override the theme. So, if you have carefully changed every heading to pink, they will all remain pink when you change the whole theme to red. So, it’s better not to do this in the first place.