Skip to main content

Designing UDL-AlignED Content

This page goes over some general guidelines for designing UDL-AlignED content.

Using Plain Language

Make content clear and accessible by using plain language. Consider your audience, and think about the message you want to convey. Avoid the use of jargon and acronyms.

Formatting Guidelines

  • Font Family

    Choose a sans-serif font like Arial, Calibri, Helvetica, Futura or Verdana. Upper case, lower case and numeric characters of a sans-serif font are easier to recognize and read than serif fonts.

    Avoid using too many different fonts in one document or presentation, as this can create a confusing visual layout.

  • Font Size
    The university standard font size is 12 pt for main body text in a document and 16 pt (minimum) for presentations.
  • Bold, Italics, and Underline

    Bold fonts should only be used to emphasize singular words. Entire sentences and paragraphs should not be bolded. Italics and underlining should be avoided when possible. 

    Italic fonts are more difficult to read than regular fonts and should be avoided when possible. Underlining text interferes with lower case letters and should not be used to emphasize text.

  • Upper and Lower Case
    Using all caps does not give enough context or information to the user, or to those using a screen reader. It is best to use a combination of upper and lower case letters.
  • Text Alignment
    Left alignment is best for readability, as it maintains consistent character and word spacing. Justified alignment creates uneven spacing between words, which can be difficult to read for some users. Floating and centered text is also difficult to read due to the inconsistent left spacing, which could be mistaken for meaningful indentations.
  • Links

    Provide meaningful text for links. It is useful to briefly describe the destination. Do not provide a full URL or use non-descriptive link phrases like“click here”, “read more”, or “learn more”.

    Accessible Hypertext Link: Review the Guide to Accessible Documents on the Ontario Tech Accessibility Hub for additional information. 

    Inaccessible Hypertext Link: For additional information about creating accessible documents, click here.

Image, Video, and Multimedia

  • Captions

    Visual elements should have a meaningful caption. Captions are displayed on the screen and help users relate them to the surrounding text.

    Video and multimedia elements should have captions that are synchronized to appear around the same time that they would be heard in the audio. It is also helpful to provide a transcript as an alternative format.

  • Alt Text

    Alternative (alt) text is meant to convey the “why” of the image as it relates to the content of a document or webpage. It is read aloud to users by screen reader software, and it is indexed by search engines. It also displays on the page if the image fails to load, as in this example of a missing image.

    Alternative (alt) text should be included for all graphic elements, unless they are purely decorative.

    1. Describe the main focus of the image
    2. Keep it short and descriptive, like a (short!) tweet
    3. Don’t include “image of” or “photo of”
    4. Leave alt text blank if the image is purely decorative
    5. It's not necessary to add text in the Title field
  • Placement
    Visual elements should be placed in line with text instead of being separated from it. Placing a graphic close to the associated content helps reinforce the relationship between the written and visual description.

Accessible Slides

  • Slide Titles
    Provide a unique and meaningful title to each slide. Some users rely on slide titles to navigate through the presentation.
  • Key Message
    Stick to one key message per slide. Add as many slides as needed.
  • Visual Contrast

    Ensure that there is sufficient contrast between the background and the text. A good use of colour has high contrast that can be seen in grayscale when printed. Avoid red and green.

    Tip: Use the WebAIM Contrast Checkeror a similar tool, to verify whether there is sufficient contrast between your background and foreground colours. 
  • Convey Information Through Various Means
    Do not use color, font style, animation or any other visual cue as the only way to convey meaning.

Considerations for Digital Documents

  • Navigation
    When designing a digital document, use the ‘Styles’ tool to create structure and help users navigate. Include properly formatted headings that briefly describe the content of each section.
  • Spacing

    Do not use space, enter, or tab keys to add white space to the document. 

    • To customize the amount of space before or after a paragraph, use the Spacing tool instead of manually adding spaces.
    • To start a new page, use the Page Break tool instead of pressing enter repeatedly. 
    • To create columns, use the Columns tool instead of adding blank spaces and tabs.

Accessibility Checker

Use the Accessibility Checker when creating documents and presentations. Note that the Accessibility Checker is not able to identify all accessibility issues, like inaccurate alt text for an image, or text that is too small.