Header nesting - header following h1-h5 is incorrect

Issue/Question

Under the Accessibility Final Checks I receive the Known Problem: Header nesting - header following h1-h5 is incorrect.

Environment

• Omni CMS

Cause

Omni CMS Final Checks look over all the code on a page and detect accessibility issues that do not meet WCAG 2.0 (Level AA) standards. It has detected that the page contains a heading that does not follow the correct heading order. Headings communicate the organization of the content on the page. Web browsers, plug-ins, and assistive technologies can use them to provide in-page navigation. Skipping headings can be confusing and cause issue navigating with assistive technology. 

Note: Known problems have been verified as broken or creating an error and must be fixed to meet accessibility standards.

Resolution

Update the heading that follows the one in the source code to use the correct heading level. Make sure that a Heading 2 is not followed directly by a Heading 4, for example. Headings with an equal or higher level start a new section, headings with a lower rank start new subsections that are part of the higher ranked section. It is okay to skip headings when closing subsections, for instance, a Heading 2 beginning a new section, can follow an Heading 4 as it closes the previous section. 

More information an examples on heading order are available from W3.org and Omni CMS Best Practices.

1. Check out the page if it is not already.
2. Click the  Edit tab.
3. Click the Edit Button on the content area where the heading is located.
   Note: Headings may be located in any editable content area or the _notification.pcf & _footer.pcf includes.
   
   If you are unable to locate a heading, check the following areas in order, skipping any areas that are not enabled. Reference the Content Area Order section of Headings Best Practices for details about the order of sections and recommended heading levels for each area.

   1. _notification.pcf (Do not use headings in this area)
   2. Left Column Quick Links (Do not use headings in this area)
   3. Left Column Content Area (Do not use headings in this area)
   4. Main Content (h2 - h6)
   5. Right Column Quick Links (h2 - h6)
   6. Right Column Content Area (h2 - h6)
   7. Footer (h2 only)
4. In the WYSIWYG toolbar use the  Show Blocks button. This will add 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.
   • Note: Headings may be blank lines, using show blocks will highlight them. Change any blank lines being used for spacing to use the paragraph block level.
5. Find the heading that follows the one identified in the Page Check Source Code and change it to use the correct heading order or remove it by changing to a paragraph using the blocks drop down. Example: If the heading identified in the Page Check Source Code was a Heading 2, the next heading should either be another Heading 2 for an equal section, or Heading 3 for a sub section.
   • Note: If the heading is located in a _notification or left column, do not use a heading block. Some headings may not need reordered, but removed. To replace any existing heading blocks with text in left columns or notifications, see this article.
6. Save the page.
7. Click the Publish button to run the accessibility final check again. Repeat the steps as necessary to order headings correctly. When the issue has been resolved it will no longer display in the accessibility check.