Avoid using styles for document structure*
Suggestion Report
Avoid using styles for document structure.
Why Is This Important?
As has been stated previously, headings are used to navigate through documents. If headings are created by making the font large and/or bold, then students who rely on text-to-speech or screen reader Links to an external site. programs will not be able to equally experience the document. Additionally, if headings are created by stylizing text, then students who like to generate outlines for studying will have to manually create their outlines.
Cause Of Result
To get this result, you need to have a line or paragraph that is completely in bold font.
Examples
Incorrect Examples
This is a faux heading
This non-heading is text that has been bolded.
Correct Example
This is a heading
This heading was stylized to appear similar to the original.
In the mobile app, the Hide and Show Code Links are obsolete. We couldn't hide them without removing them from the web browser view.
False Results
This UDOIT result can cause false positives and false negatives.
- False Positives - If the bold line (or paragraph, though we discourage having that much text in bold) is purely for emphasis and is not a heading, then this UDOIT result can be ignored.
- False Negatives - If you created headings by just enlarging the title text, UDOIT will not recognize this as a potential title. As such, please be sure to manually check your pages to make sure that all faux headings are fixed.
How To Fix It
In order to fix this issue, it's important to first understand heading levels and how to use them. There are six levels available on the web (more are available for printed documents), and the level you apply should not be based on appearance:
-
Heading 1 (
<h1></h1>
) - This level is reserved for page headings.
- If you copied content from a Word document, you may need to verify that additional Heading 1s have not been added to the page.
-
Heading 2 (
<h2></h2>
) - This level should be the first level you use on a Canvas page and for any additional headings that cover the main topics of this page. -
Heading 3 (
<h3></h3>
) - This level should be used for each of the sub-topic in a main topic. As such, Heading 3s must appear beneath level 2 or other level 3 headings. -
Heading 4 (
<h4></h4>
) - This level should be used for each of the sub-sub-topic in a sub-topic. As such, Heading 4s must appear beneath level 3 or other level 4 headings. -
Heading 5 (
<h5></h5>
) - This level should be used for each of the sub-sub-sub-topic in a sub-sub-topic. As such, Heading 5s must appear beneath level 4 or other level 5 headings. -
Heading 6 (
<h6></h6>
) - This level should be used for each of the sub-sub-sub-sub-topic in a sub-sub-sub-topic. As such, Heading 6s must appear beneath level 5 or other level 6 headings.
Related Result Pages
- Errors
- Suggestions
Related Standards
- WCAG 2.0 A and AA Reference Guide Links to an external site.
- WCAG 1.3.1: Info and Relationships Links to an external site.
- WCAG 1.3.1 H42: Using h1-h6 to identify headings Links to an external site.
- WCAG 1.3.2: Meaningful Sequence Links to an external site.
- WCAG 2.4.6: Headings and Labels Links to an external site.
Last Updated January 2017.
Clemson Online