Headings allow readers to browse content by topical groups, and provides context for users working through lengthy content. Users are much more likely to discover topics of interest if they are marked with a heading. This structure is especially important for screen reader users. The majority of screen reader users say skimming for headings is the first thing they do when they open a Web page. If "normal" text is only formatted to look like a heading, e.g., by making it bold, it will not appear in this list, making it much less likely screen reader users will notice the content exists. The numbers ("Heading 2") are meaningful: they indicate how "indented" each heading should be when the devices organizes them into a navigable list. Here is the actual outline for this page, with the numbers made visible as indents: H1 (article title): Headings Create the Page Outline H2: Common mistakes ... ... H5: Broken hierarchy H2: Good page structure H3: Real headings H3: Maintaining hierarchy H4: A nested section H4: Another nested section H5: A nested section of the above nested section H2: Testing for Accessibility H3: Test H3: Exceptions H3: Applicable WCAG Success Criteria H3: Resources Common Mistakes (H2) Fake Headings (bold text) A line of bold text might look like a heading, but it will not appear in the content outline, so screen reader users cannot tell that it is important or jump to its content. Its visual weight is also "wrong" for the site design; users would expect a much heavier heading for this break in the content. Broken Hierarchy (H5) When you are selecting heading levels, maintain an outline-like hierarchy. This lets your site's visual styles work as designed without large jumps in visual "weight," and does not put screen reader users in the confusing place of wondering if they somehow missed an important, intermediate section: H1: "Headings" H2: "Common Mistakes" ??? nothing at this level ??? nothing at this level H5: "Broken Hierarchy" Good Page Structure (H2) Real Headings (H3) The text above was marked as an H3; it automatically appears with the appropriate visual styles, and appears on the document outline so screen readers can jump straight to its content. Maintaining Hierarchy (H3) The headings below convey a nesting structure, both visually and programmatically. Worth noting: this explanation was placed above the sample headers for a reason: if it was below them, it would appear in the document outline as an explanation for "A nested section of the above nested section," rather than "Scenario Two: Maintaining Hierarchy." A nested section (H4) Another nested section (H4) A nested section of the above nested section (H5) Testing for Accessibility Test Use this headings bookmarklet or automated testing tool like WAVE to discover headings on a page. Do all visually formatted headings have a semantic h-tag? Do headings nest in outline level hierarchy properly? Exceptions None Applicable WCAG Success Criteria SC 1.3.1 Info and Relationships SC 2.4.6 Headings and Labels Resources WebAim's piece on creating semantic structure in Web content