Heading Hierarchy: Structure the Page So It Scans Cleanly
Good pages are not walls of text. They are broken into sections with visible structure.
Heading hierarchy is the framework that makes long pages understandable.
What It Is
Heading hierarchy means using H1 for the main page topic, then H2 and H3 for supporting sections and subsections in a logical order.
Why It Matters
- It improves scanability for humans.
- It gives assistive technology a meaningful outline.
- It helps content-heavy pages communicate scope and depth.
Best Practices
- Start with a single H1.
- Use H2s for major sections and H3s for nested detail when needed.
- Keep headings descriptive instead of decorative.
- Use heading levels to reflect structure, not visual styling alone.
Common Mistakes
- Jumping from H1 straight to H4 for styling.
- Using multiple unrelated H1s on one page.
- Using headings that say nothing, such as
MoreorStuff.
Quick Checklist
- Single H1.
- Clear H2 sections.
- Subsections only where they add clarity.
- Heading levels reflect content structure.
Final Takeaway
Hierarchy is how a page thinks out loud. If the outline is messy, the content usually feels messy too.