Headings Should Not Be Empty

Instructions how to fix the accessibility final check minor problem: headings should not be empty.

Issue/Question

When I run a Page Check I get the following Known Problem: 

headings should not be empty

Environment

• Web CMS

Cause

Final Checks evaluate all code on a page and detect accessibility issues not meeting WCAG 2.0 (Level AA) standards. 

It detected the page contains one or more empty headings (h1-h6).  Screen readers alert users to the presence of a heading tag. If the heading is empty or the text cannot be accessed, this could confuse users or prevent them from accessing information on the page's structure.

Resolution

Locate headings identified in the Source Code portion of the error and change the block type, remove them, or add text using the following steps:

1. Click  Yellow Light Bulb to check out page.
2. Click  Edit tab.
3. Click Edit button on content area where heading is located.
   Note: Use the Source Code section of the error to look for surrounding content.  If you are unable to locate the empty heading, proceed to the next step for each content area available.
4. In the WYSIWYG toolbar use the  Show Blocks button. This adds a thin border around every block in the section, labeling the corresponding block level in the top left. Headings are marked H1 - H6 and have a dark background with white text.
5. Click within any empty heading block.
6. Make any one of the following changes:
   • If you wish to keep a blank line, use the Blocks dropdown in the WYSIWYG toolbar to change the block level to Paragraph.
   • Or, remove block by pressing the Backspace or Delete key.
   • Or, add heading text to the block; this should be the title of the content following it.
7. Save page.
8. Click Publish button to run accessibility final check again. When the issue is resolved it will no longer display in the accessibility check.

See Heading Best Practices for more information about heading nesting and how to locate headings.