Module 1 | Canvas | Styles and Headings

How you organize and present information plays a big role in determining the usability and inclusivity of your electronic content. Visual formatting (layout, spacing, color, and font selection) all affect the degree to which information can be easily read and understood.

Because not every reader will see your document the way you designed it due to varying screen sizes, printing, and photocopying, and others won’t see it at all - they will hear it using text-to-speech software - visual formatting should be combined with structural formatting. 

 

Why Styles? 

The best practice is to create consistent, well-formatted content using Styles. 

  • The inclusion of Headings (e.g., Heading 2, Heading 3, etc.) adds structure to your content and increases the readability of course materials for people using screen readers

  • Styles (such as bulleted or numbered list formatted using the Rich Content Editor) help maintain consistency in the most efficient manner possible

  • Using Styles helps organize the information into small chunks. Ideally, each heading includes only a few paragraphs

When you use formatted Styles, the HTML code behind the scenes communicates with screen reading software to navigate the page. Making the font bigger or bolding the text does not provide the same information to the HTML code that using the formatted Styles in the Canvas Rich Content Editor does. Even for those who do not use screen reader software, using formatted Styles will improve the organization and readability of the content within your page. 

 

Heading Styles 

In the following example, a proper Heading structure of H1 > H2 > H3 > H4 is displayed. Headings should follow a logical and sequential order, and should not skip Heading levels (e.g. H1>H3).

Correct Example: H1 > H2 > H3 > H2 > H2 > H3
Incorrect Example: H1 > H3

 

Heading structure (H1 Heading, H2 Heading, H3 Heading, H4 Heading)

 

Tips for Success

  • Ensure that your content follows a linear, logical layout
  • Structure your content using formatted Styles versus relying on text size and placement for structure
  • Use formatted list (such as the bulleted and numbered lists in the RCE) rather than creating lists manually
  • Break up content with sub-headings, images, and video
  • Align text to the left and keep a consistent layout
  • Sans serif fonts (e.g., Arial or Helvetica) are easiest to read for most people, but especially those with low vision

Video Tutorial: Heading Styles in the Rich Content Editor (1:54)

Please watch this short video, which demonstrates how to use Heading Styles in the Canvas Rich Content Editor. 

 

 

Video Transcript

 

Resources