Organize every page with a heading hierarchy
G141 asks you to give every section of a page a heading, and to nest those headings so the levels match the real outline. Page title at the top. Major sections below it, subsections inside those, and no level skipped on the way down. Status matters here more than usual. W3C lists G141 as advisory at 1.3.1 Info and Relationships, the Level A rule this page is filed under, which means it is recommended practice rather than something the working group accepts as evidence of conformance. Where it is sufficient is 2.4.10 Section Headings, at Level AAA, and that rule has only two techniques in total. The distinction is worth holding. 1.3.1 governs whether the headings you have are marked up truthfully. 2.4.10 governs whether your sections have headings at all.
How we find it in an audit
Automated tools catch the mechanical faults well, a skipped level, a missing top-level heading, several first-level headings on one page. Our reviewers then read the outline as a document in its own right and ask whether it matches how the page actually divides. A hierarchy that is technically valid and describes a different page is still wrong.
How affected users experience it
Heading navigation is the main way screen reader users move through long pages, and levels are how they read the shape. A jump from level one to level four says a section was left out, so they go back looking for it. A page with one heading and four thousand words of terms offers nothing to jump to. There is still a find command, so the reader is not stranded, but it only helps somebody who already knows the words the clause uses.
Passes vs. fails
Passes
The page nests headings to match its outline, with <h1> for the title, <h2> per major section, and <h3> for subsections.Fails
A 4,000-word terms page is one unbroken run of paragraphs under a single <h1>.How this gets tested
The W3C publishes test rules that define what a checker looks for here.
- ARIA attribute is defined in WAI-ARIAA tool can check this
- ARIA state or property has valid valueA tool can check this
- Element with role attribute has required states and propertiesA tool can check this
- Form field has non-empty accessible nameA tool can check this
- Headers attribute specified on a cell refers to cells in the same table elementA tool can check this
- Role attribute has valid valueA tool can check this
- ARIA global properties not used where prohibitedA tool can check this
- ARIA required context roleA tool can check this
- ARIA required owned elementsA tool can check this
- ARIA state or property is permittedA tool can check this
- Table header cell has assigned cellsA tool can check this
The other techniques filed under this rule
52 guides on this site are filed under 1.3.1 Info and Relationships. W3C lists this one as advisory for that rule rather than sufficient, which means it helps real readers without being accepted as evidence you conformed.
- ARIA11sufficientAdd landmarks so users can skip around
- ARIA12sufficientUse role=heading when h1-h6 is impossible
- ARIA13sufficientName repeated landmarks so they are distinguishable
- ARIA16sufficientName controls from visible text with aria-labelledby
- ARIA17sufficientGroup related form fields with ARIA roles
- ARIA20sufficientMark leftover page areas with role=region
This guide is our interpretation of W3C technique G141: Organizing a page using headings. W3C publishes its techniques as guidance rather than as the standard, and says so on every one of them. The success criterion is what conformance is measured against, and a technique is one documented way to meet it.