Photo by Ben Kolde on Unsplash
1. Headings
DO
Use inbuilt headings to create hierarchy
<h2>Bovidae<h2>
<h3>Sheep</h3>
<h4>Ewes</h4>
DON’T
Rely on text size alone
28pt font, bold
18pt font, bold
14pt font
Fixing issues with UDOIT
Problem 1: Heading levels should not be skipped
Meaning
Don’t rely on text size and font alone for headings. Use the built-in heading function and follow the hierarchy laid out, e.g., h1 – canvas page header (done automatically by Canvas), h2 – section header, h3 – subsection header, etc.
How to fix it
This problem cannot be resolved in the UDOIT tool. Edit the page with the issue in Canvas and ensure heading styles aren’t skipped.
Canvas’ rich content editor showing the hierarchical heading styles in a drop-down menu.
Problem 2: Headings should contain text
Meaning
This typically refers to an issue where a heading element (like <h1>, <h2>, etc.) is empty or does not contain any text content. An empty heading does not provide any information or structure, diminishing the user experience for those relying on assistive technologies such as screen readers.
How to fix it
In UDOIT Advantage, click the Review button for more information. Type your new heading into the text field and click Save, or use the checkbox to delete the heading if it is no longer required.
UDOIT prompts you to fix a heading that has no text by entering new heading text or deleting the heading instead.
Getting it right in Canvas
In Canvas, make sure page content is chunked via headings that follow a hierarchy, starting with the page title as h1 (heading 1).
Heading 2 as a section title
[Some content]
Heading 3 as a subsection title
[Some content]
Canvas’ rich content editor showing the hierarchical heading styles in a drop-down menu.
Page added 24/04/2024