Text in Canvas

Heading Structure

A hierarchy of material in a Content Page or the instructions of an Assignment, Quiz, or Discussion should be indicated through heading styles (Heading 1, Heading 2, etc.). Similar content should be grouped together. Headings should be used to indicate a change of topic. Section headings allow screen readers to easily navigate through content.  

The Title of the Content Page, Assignment, Quiz or Discussion will be assigned Heading 1.  Section headers should be formatted with Heading 2 and the hierarchy of format styles should follow.   

Heading 2

Heading 3

Heading 1

Paragraph

 How To Format Heading Structure

  1. Highlight the line of text
  2. Select the appropriate format

Format Text Drop-down menu

Check the Format

In the edit mode, you can check the format of any existing content.

  1. Highlighting the text
  2. The format drop-down will change to the type of applied format.

List

A list should be properly formatted as an unordered (bulleted) or numbered list.

Ordered and Bullet List format button

  1. Select the content you want to make into a list.
  2. From the toolbar, click the Bulleted list icon if the order doesn’t matter. Select Numbered List (next to the bulleted list icon) if the order does matter.

 

Use of Color

Contrast

Text should be clearly distinguishable from the background providing sufficient contrast.  

The following are examples of Rich Content Editor Colors Contrast Ratios within Canvas using a white background:

 Fail: (under 4.5)

  • Yellow Text: 1.07:1
  • Pale Green: Text  1.12:1
  • Orange Text: 2.14:1
  • Pink Text: 3.14:1
  • Red Text: 4:1

 Good: (4.5 to 7)

  • Blue Text: 4.68:1
  • Dark Green: 5.14:1
  • Purple Text: 6.95:1

 Best: (Over 7)

  • Burnt Orange: 7.43:1
  • Very Dark Gray: 12.63:1
  • Black text: 21:1

Source:  General Accessibility Design Guidelines Links to an external site.

Communicating Meaning

Color alone should not be used to communicate meaning.  The meaning should be conveyed in another way that does not require perceiving different colors, such as using Bold or Italic formatting from the Rich Text Editor.

Examples.

Incorrect:  If you have not participated in the first week of the course you will be dropped from the course and added to a future class. 

Correct:  If you have not participated in the first week of the course you will be dropped from the course and added to a future class. 

The correct version has the important text formatted as bold.  

Tip:  

Correcting formatting may be easiest if the old applied format is removed. This will reset the text to the default color and font size, but will not remove the heading structure (paragraph, list, H2, etc..).  To remove formatting:

  1. Select the content you want to make into a list.
  2. Click the Clear Formatting button from the Rich Text Editor

Clear Formatting Menu Button