Ensure headings are marked up as heading

(In development)

Ensure that the information and relationships on the screen are available to assistive technologies. Headings should not only look like headings, but should also be marked up as heading in the code.

Impact

Screen reader users can jump from heading to heading. When text is not marked up as heading, it takes extra time to use an app. Users might not also recognize that the content has been divided in sections.

Solutions

Elements

Testing

Automated testing

This issue can be detected automatically with the Abra Test Engine.

Manual testing

Navigate to the heading using a screen reader.

  • Check if the heading is announced as heading.
  • Check if you can jump to the heading with the VoiceOver Rotor or TalkBack Context Menu.

Relevant sources

Always check the official guidelines.