Must haves
- Each page should have a unique H1 heading
- Tip: there can only be one H1 on the page
- The headings should go in order from 1 to 6
- Tip: there can be multiple headings at levels 2-6 per page, but they should be used in a logical progression and generally avoid skipping levels (much like how you might created nested bulleted lists)
- Heading sizes should be the largest with the H1, and progressively decrease in size through to the H6. The H6 should be no smaller than the size of your body style.
Learn more about creating headings for accessibility
Headings and Structure overview
Visual example
Do and Don’t
Do | Don't |
---|---|
<h1 class="title1">Alumni Engagement</h1> <h2 class="title2">Events</h2> … <h3>Upcoming Events</h3> … <h3>Past Events</h3> … <h2>Make Connections</h2> … <h3>Become a mentor</h3> … <h3>Find a mentor</h3> |
Here the main heading is not identified as the h1, there are multiple other headings incorrectly identified as h1 when they should be h2, and heading levels are skipped inappropriately. |