Take a quick look at the newspapers in the image below. At a quick glance, even with a small image, you can easily ascertain the title of the newspaper, the titles of articles, and the "lead" story. Newspapers are great examples of the ways formatting text can aid readers.
Heading levels help segment material on the page, and help your students understand the hierarchy of topics and subtopics on your page. Chunking material prevents cognitive overload, providing information in digestible pieces for your students. Headers are an important organizational tool. They will help your students better understand the main points of each section, helpprovidea cognitive schema for the information you're presenting, and allow your students to skim the page.
From an accessibility perspective, headings are valuable as they provide individuals using screen readers with a simple method to navigate within a Content Page. Inarecent study conducted by WebAimLinks to an external site. investigating the browsing habits of screen reader users, over 75% of individuals reported they use headings always or often to navigate web pages. Rather than navigating line-by-line through a document or Web page, the use of headings allows individuals to move through the information based on heading topic.
Notice how the text size changes depending on the heading level?
The different heading style sizes help visual learners understand how the subtopics relate to the main topics, and with one another. From the perspective of a student who relies on a screen reader, the screen reader announces the heading level of each object, for example using the image above: "Heading Level 1, User-Friendly Content Pages Overview" and so on to identify the main topics and subtopics of a page.
Mistakes in the phrasing of your headers can confuse all of your students, so carefully choosing the words in your headers is important.
Common Logic Mistakes
When our focus is on the content, headings can sometimes come as an afterthought. A common mistake is not paying attention to the logical structure of the headings, or creating headings that aren't parallel to one another. For instance, the following list is not parallel:
cows
sheep
lettuce
bunnies
tomatoes
Easy Logic Fixes
Though they are all found on a farm, some of these things are not like the others! Choose headings that are descriptive and make sense to all your students--this takes time and thoughtfulness, but it's worth it! Consider this fix for the list above:
Common Livestock in California
cows
sheep
rabbits
Common Crops in California
lettuce
tomatoes
garlic
avocados
Trouble Spot #2: Paragraph Styles
Another common mistake affects visually-impaired students far more than others. Well-meaning faculty often use the wrong tools within the Rich Content Editor to format their headers.
Common Paragraph Style Errors
Though using font size, bold, and underline to create a header may look nice, these formatting features don't have the HTML tags that screen reader devices need to identify the headers. Moreover, underlined text, as you'll soon discover, has a very specific meaning in web-based contexts--it denotes a hyperlink. Underlining your text may confuse sighted users, who will expect the text to then link them to another page.
Easy Paragraph Style Fixes
To properly tag your headings, use the styles from the drop-down paragraph styles menu. Highlight the heading, then choose the heading level from the drop-down list.
Trouble Spot #3: Nesting or Semantic Structure
Heading styles not only provide students with useful overarching structure--the bones to the content--when done correctly, they also enable students to see subsections, allowing them to create a rich image of the relationship between sections and subsections.
Both sighted and visually impaired students will use headings to see the relationship between the chunks of information. Like an outline, the headings on your page should go in order.
Common Nesting Errors
Even when the paragraph style tool is used, sometimes the heading structure--called nesting or semantic structure--does not follow in order. Heading levels that are out of order may confuse students who are using the heading structure to help them understand the relationship between concepts. For instance, in Canvas, Heading level 3 is smaller than Heading level 2 and uses a bold font. There is both a visual difference (for sighted students) and a coded difference (the tag changes from h3 to h2) for students using a screen reader.
Easy Nesting Fixes
Be sure your headings are in order.
The title of each Canvas Content Page is Heading Level 1, so the styles available for your use begin with level 2. Your headings, then, should start with level 2, with any subsections of level 2 starting with level 3, and so on. The structure of this page looks like this:
h1 Headings (Page title)
h2 Purpose of the format feature
h2 Common mistakes and easy fixes
h3 Trouble spot #1: Logic
h4 Common Logic Mistakes
h4 Easy Logic Fixes
h3 Trouble spot #2: Paragraph Style
h4 Common Style Mistakes
h4 Common Style Fixes
h3 Trouble spot #3: Nesting or Semantic Logic
h4 Common Nesting Mistakes
h4 Common Nesting Fixes
The Canvas Check Accessibility Tool
One of the most common heading errors is skipping heading levels (starting with Heading level 3, for instance, or moving from Heading level 2 to Heading level 4). The Check Accessibility tool will help you find and fix skipped heading levels.
Use the tool after you have formatted your page, but before you have saved. Select the Check Accessibility icon, and a pane will open as part of the editor. If you have skipped heading levels, they checker will flag the heading and suggest a fix. Before authorizing the fix, be sure the correct heading is being adjusted. For instance, if you were trying to nest three headings, like this:
H2 Main topic
H3 Sub topic
H4 Sub-sub topic
but accidentally identified the Sub topic as Heading Level 2, Canvas may accidentally flag the sub-sub topic as the problem.
Most importantly, Canvas cannot check the cognitive structure of your headings--it's up to you to make sure the headings are descriptive and make sense.
Before you select "Next" please read all the "Trouble Spots" above.