Document Outline: The Sacred Heading Hierarchy

Sighted users scan a webpage by visually skimming large, bold typography.

Screen reader users scan a webpage by navigating heading outlines (e.g., pressing the H key in NVDA or JAWS, or using the rotor in VoiceOver to pull up a table of contents).

The Strict Heading Rules:

1. Exactly one <h1> per page: Represents the overall topic of the document (e.g., 'Order History' or 'Account Settings').
2. Strict logical nesting without skipping:
   • <h1> -> <h2> -> <h3> -> <h4>.
   • Fatal Defect: Jumping from <h2> directly to <h4> because you wanted smaller font styling. (Use CSS classes to adjust font size, never heading levels!).
3. Never use headings for styling alone: A pull-quote or promotional banner should not be marked as an <h3> just because its font size matches your aesthetic preference.