Skip to main content Skip to main menu >Toggle high contrast

Complying with AODA WCAG 2.0 Distinguishable Content

Under the Accessibility for Ontarians with Disabilities Act (AODA), all large (50+ employees) private and non-profit organizations and all public-sector organizations are required to make their websites accessible. However, determining if your website is accessible can be a challenge. This article will assist you in complying with the AODA WCAG 2.0 distinguishable content.

New public websites and significantly refreshed websites were required to be compliant with WCAG 2.0 Level A by January 1, 2014. Furthermore, by January 1, 2021, all public websites and web content posted after January 1, 2012, must meet WCAG 2.0 Level AA.

WCAG 2.0 is an internationally accepted standard for web accessibility developed by the World Wide Web Consortium (W3C). Following the WCAG 2.0 guidelines will make content accessible to people with a wide range of disabilities, including:

  • Blindness and low vision
  • Deafness and hearing loss
  • Learning disabilities
  • Cognitive impairments
  • Mobility impairments
  • Speech impairments

Although there are nine success criteria for WCAG 2.0 distinguishable content, we will only focus here on contrast, resizing of text, and images of text. The following guidelines will make it easier for everyone to access your website and content.

WCAG 2.0 Distinguishable Content

The purpose of distinguishable content is to make it easier for all users to see and hear content.

Contrast (Minimum)

Firstly, people with visual impairments must be able to view and read text and visual representations. There needs to be enough contrast between the text and the background. This contrast will help people with low vision read what is on the screen. To ensure that there’s enough contrast, choose either a:

  • Light background and dark text
  • Dark background and light text

To verify colour choices, use one of several colour contrast checker websites that are available free of charge.

While in general a webpage must display good contrast, there are exceptions to the contrast requirements for text or images of text, provided that the text is:

  • At least 18 points or 14 points bold with a contrast of at least 3:1
  • Purely decorative
  • An incidental part of an image (for example, a child reading a book that includes an image of a street sign)
  • Part of a logo or brand name

Resizing of Text

Secondly, users should be able to resize text on a web page up to 200% without the loss of content or functionality. Additionally, users should be able to resize text without using assistive technology. Developers can resize text by:

  • Specifying font sizes in relative units like ems (typography) and percentages, or using named font sizes
  • Using a page layout that easily expands, contracts, and reflows relative to the user’s screen size

The following types of text are exempt from the resize text requirements:

  • Images of text
  • Captions

Images of Text

Thirdly, people who need a certain visual presentation of text should be able to view the text with ease. Ideally, text, not images of text, should be used to express information. Sometimes, users can customize the image of text to match their requirements.

This goal can be accomplished by using Cascading Style Sheets (CSS) to modify and alter how elements like font, colour, or spacing are displayed. For example:

  • Styled headings
  • Quotes
  • Navigation items
  • Symbolic text characters
  • A logo containing text

The following are exempt from the images of texts requirements:

  • An image of text is essential (for example, representation of a historical letter or document)
  • A customizable image of text
  • Brand logos
  • Purely decorative text

Following the above guidelines will make it easier for users to see the content of your website. It is critical to have your website audited on a regular basis to ensure that you stay compliant with the AODA requirements.