A very common accessibility problem is the lack of properly formatted Heading tags in a webpage (H1, H2, H3, H4, H5 or H6). Sometimes headings are not present or they may be incorrectly nested (ie… H2 before H1, H3 before H2 etc…). Headings communicate the organization of the content on the page and can be used to provide in-page navigation for screen reader users.
A few tips regarding Headings:
- there should only be one H1 element and it should enclose the page title
- each section of content should begin with an H2 element followed by sub-sections marked with subheadings (H3, H4, H5 or H6)
- headings should not be used for decorative purposes such as to display text in bold
- creating visible headings using bold text is not the same thing as setting page headings
Reference: WCAG 2.1 (Level A) – 1.3.1
