Website Accessibility

Dos and don'ts on designing for accessibility

Accessibility generally means equal or equivalent access by a person with a disability. A website is accessible if it can be used as effectively by people with disabilities as by those without.

The major categories of disability types are:

Visual (blindness, low vision, color-blindness)

Hearing (deafness and hard-of-hearing)

Motor (inability to use a mouse, slow response time, limited fine motor control)

Cognitive (learning disabilities, distractibility, inability to remember or focus on large amounts of information)

	Do use simple colours write in plain English use simple sentences and bullets make buttons descriptive - for example, Attach files build simple and consistent layouts Don't use bright contrasting colours use figures of speech and idioms create a wall of text make buttons vague and unpredictable - for example, Click here build complex and cluttered layouts
	Do describe images and provide transcripts for video follow a linear, logical layout structure content using HTML5 build for keyboard use only write descriptive links and heading - for example, Contact us Don't only show information in an image or video spread content all over a page rely on text size and placement for structure force mouse or screen use write uninformative links and heading - for example, Click here
	Do use good contrasts and a readable font size publish all information on web pages (HTML) use a combination of colour, shapes and text follow a linear, logical layout -and ensure text flows and is visible when text is magnified to 200% put buttons and notifications in context Don't use low colour contrasts and small font size bury information in downloads only use colour to convey meaning spread content all over a page -and force user to scroll horizontally when text is magnified to 200% separate actions from their context
	Do make large clickable actions give form fields space design for keyboard or speech only use design with mobile and touch screen in mind provide shortcuts Don't demand precision bunch interactions together make dynamic content that requires a lot of mouse movement have short time out windows tire users with lots of typing and scrolling
	Do write in plain English use subtitles or provide transcripts for video use a linear, logical layout break up content with sub-headings, images and videos let users ask for their preferred communication support when booking appointments Don't use complicated words or figures of speech put content in audio or video only make complex layouts and menus make users read long blocks of content don't make telephone the only means of contact for users
	Do use images and diagrams to support text align text to the left and keep a consistent layout consider producing materials in other formats (for example, audio and video) keep content short, clear and simple let users change the contrast between background and text Don't use large blocks of heavy text underline words, use italics or write capitals force users to remember things from previous pages - give reminders and prompts rely on accurate spelling - use autocorrect or provide suggestions put too much information in one place

Accessibility Resources

Learn more about how to serve the people in your school community who have different levels of ability when navigating websites:
How to Make your School Website Accessible
Accessibility Tip Sheet

Accessible Website Checklist
OCDSB Tips for Creating Accessible Content
W3C Introduction to Web Accessibility
Frequently Asked Questions (School Messenger)

What are the most common accessibility errors? View the checklist here.

Tutorials & Self-Assessment: Accessibility Fundamentals for the Web
Learn more about web accessibility and check your understanding (4 Modules = 1 hour)

Assistive Technology on OCDSB School Websites:

There are a number of assistive technologies, devices, software, or techniques that assist individuals with disabilities when they visit websites or use related online digital technologies. They include screen readers, Braille displays, screen magnifiers, onscreen or other special keyboards, and word prediction software.

When editing your school's website, keep in mind that some visitors to the site might be using a screen reader. Look for the ReachDeck Toolbar in the top right corner of all OCDSB school websites.

ReachDeck icon ReachDeck is assistive technology software that adds text-to-speech functionality to websites. It is designed to assist those with dyslexia, literacy difficulties, mild visual impairments and where English is a second language when browsing the web.

This video on YouTube introduces the toolbar, what each icon does and how to use it.

Screen readers allow users to navigate through web content in many ways. The user can simply let the screen reader read everything from top to bottom, one line at a time, or the user can use the tab key to navigate from link to link. The user can also navigate from one heading to the next (if the web content has headings), from one frame to the next (if there are frames), or by other methods.

Screen readers can also be used by those who are both deaf and blind, but rather than convert text into speech, screen readers for the deaf-blind convert text into Braille characters on refreshable Braille devices.

Find out more about how people with disabilities use the web.

School Website Support