This page outlines some accessibility guidelines that content editors need to be aware of and address in order to meet AODA website requirements (For developers, there are additional guidelines to be aware of and address – please refer to W3C’s How to Meet WCAG (Quick Reference) for details).
Text Content
Mark up the structure of your web content
Some people may not be able to see the visual formatting commonly used to structure web content (such as large, bold font for headings), so content structure should be marked up with appropriate HTML elements such as heading, paragraph, list, and table tags.
For headings, indicate the hierarchy for the sections of content on a page using h1-h6 tags (h1 is usually used for the page title).
Use tables for tabular information such as schedules. Table headers need to be marked as table headers in the code. For page layouts, use CSS instead of tables.
Provide descriptive page titles, headings, link text and labels
Page titles identify the page and should be short, unique, and relevant to the content. The should also make sense out of context.
Headings on a page should identify the sections of content on a page and provide an overview of the content and how it’s organized.
For link text, describe the link so users understand the purpose of the link. If the link goes to a web page or web application, it is sufficient to use the same page or application title that is on the page or application being linked to as the link text. If the link goes to a document, also include the document format at the end of the link text (e.g. Document Name (pdf))
For functional or interactive components such as text fields in forms or image slider controls, provide labels to convey the purpose of the component (e.g. First Name). If a functional or interactive component appears repeatedly on multiple pages of a site, be sure to label it consistently.
Mark up language changes in your web content
If a page has passages or phrases in the content that change in language (e.g. a French quote on an English page), that change needs to be marked up in the code for that content. Exceptions include proper names, technical terms, and single words considered part of the language of the surrounding text (e.g. the word “rendezvous” on a page in English).
Images and other non-text content
Provide a text alternative for images and non-text content
People using assistive technologies may not be able to use content that is not in text form, so when they come across the non-text content, they should be able to find alternative text that replaces the non-text content and that they can use.
For images, specify “alt text”, which provides the same information as the original image. If there are words in the image, the alt text should include those words. If an image is purely decorative, used for visual formatting, or invisible, it should be marked with an empty alt text. If the image is an visual experience that can’t be fully captured using words (e.g. a visual artwork), at least identify it with a descriptive label and provide additional description if possible.
In the case where alt text for an image would be too long (e.g. the image is a chart that would require a longer description to provide all the information on the chart), use the alt text to briefly describe the image and then provide a long description that presents the same information as the image.
Instead of images of text, use CSS styles to visually format text
Use CSS styles to visually format text as opposed to using images of text (exceptions include logotypes, or text that is part of an image that has other significant visual content, such as a graph, screenshot, or diagram).
Web page editing tools provide ways to change text formatting such as font size, foreground and background colour, font, line spacing, and alignment.
Audio and Video
For audio and video, provide a text document that presents the same information
For audio, provide a text document that presents the same information, including all important dialogue (and who is speaking) and descriptions of background sounds.
For video, provide a text document that presents the same information, including all visual important information and descriptions of background settings, expressions and actions (and who is associated with each action). If the video has audio, also include all the important dialogue and non-speech sounds.
For video that has audio, also provide text captions
For video that has audio, text captions that describe the dialogue and important sounds are also required.
Documents
Make documents on your site accessible
Documents that you post on your site need to be made accessible. In addition, links to documents should have link text indicating the file format of the documents.
Colour
If colour is used to convey something, provide another way for those who can’t see colour to see the information
For example, a conference schedule may have several tracks that are indicated using coloured backgrounds. In addition to using colour, the track for each session is also indicated in text after each session title.
Another example is a bar chart where in addition to using colour, each bar also uses a different pattern.
Make sure there is enough colour contrast between text and background colours
Some users may not be able to read text if there is not enough contrast between text and background colours. If there are areas on a page that have coloured text and/or background (including images of text), use a colour contrast tool to check that the colours meet the minimum contrast ratio requirement.
Navigation
Provide more than one way for users to get to a web page
Ensure that there is more than one way for users to get to each page on your site. Examples of different ways users can get to a page on a site include having a link from the site’s search results page, the site navigation bar, or another page on the site.