Understanding how to make your website content accessible

In accordance with the Accessibility for Ontarians with Disabilities Act (AODA), your content will have to abide by certain guidelines to ensure that it is accessible. To this end, it is advised that you consult the following publications by the University of Ottawa's Accessibility Hub and Human Rights Office:

  1. Understand the law - Information and communications standard
  2. Information and communications

The general guidelines regarding web accessibility are also summarized below for your reference.

Text

  • Use the proper vocabulary and plain language: To make your document easier to understand, use University-approved terms that are listed in the Language Services Writing Guide.
  • Word emphasis: Use bold characters to emphasize a word or phrase. Do not use title headings (i.e. tags such as h1, h2 or h3) for this purpose.

Links

  • You should never have two links pointing to different locations that share the same text. Be mindful that this includes links found in the global header, global mega menu, and global footer.
  • Avoid opening links in a new window.
  • Avoid adding any information in the “Title” text field of a link, as this text is not read by most screen readers.
  • Avoid using vague directives for the text of a link, such as “Click here”, “Learn more” or “Contact us”. The link text should be unique and provide context for the user.
  • When linking to a document, indicate the type and size of the file within the link (e.g. “read the Multi-Year Accessibility Plan (PDF, 1.1 MB)”).

Tables

  • Keep your table structure simple by avoiding things like merged cells and columns. Complex tables are difficult to parse for screen readers.
  • Tables should not be used for design purposes and should instead contain only tabular data. For example, using a table to align pictures and text is very bad practice.
  • Make sure to define the row or column that will be used as a table header. In HTML, this means identifying all table headers using the <th> element. Do not use bold or page headings (e.g. h3, h4, h5 tags) for this purpose.
  • If no heading immediately precedes the table, add a table caption to describe the purpose of the table.

For more information on creating accessible tables on the University's Drupal platform, consult the article Creating accessible tables with the text editor.

Images

  • There should never be any text within images. This is a very poor Web practice.
  • Alternative text
    • All images require an alt tag.
      • Simple informative images: If the image conveys information that helps understand the message, you must provide alternative text that conveys that information.
      • Decorative images: Due to current limitations, you must provide an alternative text even if the image is decorative. However, in the future, if the image is purely decorative and does not provide any additional content, the alternative text area will have to be left empty.
      • Complex images: For complex images (such as a graphic, a table, a pie chart, a diagram, etc.), you must provide alternative text that best summarizes the content. If the details of the complex image are important or relevant, provide a long description that links to a page containing all the fine details of the image.
  • Do not use such phrases as “Image of…”, “Icon of…”, “Photo of...” or “Graphic of…” to describe the image.
  • Long description
    • The long description attribute must contain a URL towards a page that contains the full description. It must not contain the long description text itself.
  • Title text: Avoid adding any information in the “Title” text field of an image, as this text is not read by most screen readers.

Video and audio files

  • All pre-recorded media must have a descriptive text transcript and closed captioning. An audio description that describes what is visible on the screen can also help users with visual deficiencies.
  • The link to the transcription (or the transcription itself) must be on the same page as the video or audio. This rule also applies to embedded video and audio files.
  • The user must be able to stop, pause and rewind all audio and video files.
  • How to create an accessible video.

Documents and files

  • All documents must be made accessible, unless the document is also available as a web page that meets accessibility compliance.
  • File name: Make sure your document has a file name that is unique, is representative of the content or the purpose of the webpage, is in the same language as the page and is separated by hyphens.

For more information on meeting accessibility requirements for different types of documents, refer to the section Creating accessible documents of the Accessibility Hub and integrate accessibility in your messages.

Social media platforms

  • Social media platforms are used to supplement your webpage.
  • Information shared on social media platforms that is linked to your webpage must be as accessible as possible.
  • If you embed a multimedia player in a page, then that player, its controls and output must be accessible to the same level of compliance you claim for your overall page.
  • Improve accessibility of your information posted on social media.

Accessibility report on your website

To receive a weekly accessibility report on your website, please contact uoweb@uOttawa.ca about using Siteimprove for your website. To learn more about accessibility, refer to the Accessibility Hub.

» Submit feedback
    Status: 
  • Accepted
    Topics: 
  • Accessibility
  • Social Media
    Types: 
  • User Guide
Back to top