Appropriate Nesting
Answer
Section headings communicate the structure of a document. Projects should not skip heading levels (for example, your document shouldn't jump from h1 to h4).
It may be helpful to think of headings as containers. When you declare a heading, all text after that heading and before the next heading of the same level belongs to the heading and should be related. Therefore, all content on a page should be related to the declared H1.
Examples:
Do
- use WAVE or another accessibility extension to surface your page structure and check for errant headings.
<h1>Food</h1>
<h2>Soup</h2>
<h3>Split Pea</h3>
Split pea soup is a real litmus test for your friends. People either love it, or they hate it!
<h3>Clam Chowder</h3>
Be sure none of your dinner party attendees are allergic to shellfish before serving clam chowder!
<h2>Casseroles</h2>
Webster defines a casserole as: food cooked and served in a casserole.
<h3>Casseroles of the West</h3>
<h3>Casseroles of the Southeast</h3>
Don't
- assign headers to change the look of text.
- assign headers randomly.