Heading Sizes
Basic, un-classed heading elements.
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Heading Group
Group related heading content together. A single <h1>
, <h2>
, <h3>
, etc with one or more <p>
elements.
Heading 1
Sub heading or 'lead' paragraph.
Useful notes and reading:
Notes:
-
Stick to the hierarchy
Start with either a heading 1 (alpha), or display heading. Then use heading 2 (beta) and so on. Don't skip around the hierarchy or you may confuse users.
-
Create semantic structure
Visual hierarchy can be really helpful for those whose can see it, but remember that not everyone is able to see it. Make sure everyone gets the benefit of your clearly structured content by using semantic tags i.e.
<h1>
,<h2>
, etc.