What is an empty heading?
An empty heading is when there’s heading styling with no content in it. This often happens when headings are used to add spacing to a page or when heading content is removed but Canvas didn’t remove the heading HTML tag from the code.
The screenshot below shows what an empty heading might look like in Canvas.
The HTML would be something like this:
<h2></h2>There are heading tags, but there isn’t any content between them.
How does an empty heading impact accessibility?
When there’s an empty heading, a visual user sees a space. But, an assistive technology user is forced to interact with that heading when they navigate or browse the page’s heading structure.
This video demos how NVDA screen reader announces an empty heading:
Fix empty headings in Canvas
To fix an empty heading on a Canvas page, either add content to the heading or remove the empty heading:
- Go to the Empty heading error in the Accessibility Guide by opening the Headings section.
- If the heading isn’t needed, select Remove to delete the heading HTML tag from the code. If a heading is needed, select the Empty heading result icon to go to where it is on the page and add a heading.
- Save or Update the content.