Web Page Headings (H1)
Section headings with large or bold text can help visual users quickly scan and understand web pages for efficient navigation.
When heading elements are correctly applied (e.g., <h1>...<h6>), they provide the same type of efficient navigation to individuals with visual disabilities. Proper heading elements allow assistive technologies to quickly identify the headings on the page.
Without correct headings, users of assistive technologies are not able to skip through irrelevant content and navigate the page effectively. Some users will have to wade line-by-line through a web page with missing or improper section headings.
Correct ordering of headlines and subheads will be denoted in parentheses throughout this page in proper usage and order. For example, the headline above is noted as the H1, or main headline. There should be only one H1 headline at the top of each page. Subheadings begin with H2 for section headlines and H3, H4, and so forth for subsequent headings. You will notice that the size and style will vary depending on the subhead.
Heading level order and arrangement (H2)
HTML headings are classified starting with level 1 and ending at level 6. Headings on well-designed web pages will form an outline of the page’s content.
Level 1 is the "highest" level of the outline. A <h1> element should be used to indicate the main content of the page.
Higher numbers indicate subsections. Taken together, the headings should form a well-structured hierarchy.
Resources (H2)
Benefits (H3)
These measures allow the users of assistive technologies to:
- Detect the sections (or subjects) covered on the page.
- Understand different sections of related content.
- Navigate quickly to any specific section.
- Allow search engines to detect the page’s main topics.
Best Practices (H3)
- Check for at least one level-1 heading on every page.
- Apply appropriate HTML markup to any text that looks like a heading.
- Begin every page section or topic with an HTML heading.
- Verify that all text marked up as HTML headings serve a proper function and are not simply used for appearance.
- Arrange the heading hierarchy in meaningful order:
- Headings should not skip levels.
- Each heading level should correctly indicate its relationship to other sections.