The Inclusive Workplace

Accessible design for Canadian job seekers

The Inclusive Workplace is the first Canadian website designed to help the 500,000 unemployed or underemployed people in Canada with autism or an intellectual disability find good jobs.
Read how we designed an accessible website that is targeted, useful, and relevant for all users during COVID-19 and beyond.

Challenge

Connecting adults with workplace related e-learning and resources

Our challenge was to develop a comfortable online experience for adult users on the autism spectrum or with an intellectual disability looking to find work or engage in the workplace during COVID-19.

Approach

Understanding our audience

Through one-on-one interviews with our ASD and ID target audiences, we uncovered their challenges in gaining meaningful employment. People with Autism Spectrum Disorder or an Intellectual disability are some of the most under-employed people in Canada; We made sure to recognize that people with Autism Spectrum Disorder or an intellectual disability also had other challenges, such as poverty, access to technology, access to support.

Information Architecture

We focused on simplicity and plain language to make users feel in control when navigating the site.

Design

Consistency, clarity and structure were essential to successful design for our target audience.

Content Strategy

We simplified complex topics while retaining key information and maintaining a respectful mature tone.

Tailoring the experience to user needs

Personalizing display

The Inclusive Workplace needed to create an optimal viewing environment for users with heightened visual sensitivity as well as those with visual impairment. “Calm” and “Contrast” modes were developed to accommodate the diverse needs of these users. The ‘Calm’ mode implements a desaturated palette and uses alternate versions of images which have been edited to remove strong colour contrast or background visual noise. Icons may be removed or simplified in this mode.

Sample “Calm”/”Contrast” modes

View examples of “Calm” and “Contrast” modes.

Prioritizing content

Making key content easy to find

Placing video or course content at the top of the page gives users easy and quick access to the most important content on each page. Displaying video or course length sets users expectations for time needed to complete.

Pacing engagement

To help users focus and make their way through the site at their own pace, we used graphical elements consistently and constrained content width for shorter lines of text. We provided “calm spaces”, clear dividers, and focus areas throughout. To increase predictability and ease of use, we defined 4 page templates that could accommodate all site content.

Defining actions or behaviours

Promoting understanding through visual aids

We kept graphical elements to a minimum, focusing on those that would enhance comprehension. These included checklists or content that required a series of steps for completion.

Steps
1. Preparing users for multi-step tasks
Example

Large, strong numbers are used in lists involving steps or stages so that the user knows in advance how many steps are required to complete the task.
Users who have difficulty with multi-step procedures then have a chance to contact their job coach or support person before embarking on the task and becoming overwhelmed.

Next Slide
Slide Background
2. Using icons to queue behaviours
Example

A small set of simple and commonly used icons are used sparingly, only when they support comprehension or encourage a behaviour such as checking items on a list.

Back to Slide 1

Conclusion

Accessibility which doesn’t compromise style

The resulting site design gracefully provides accommodations for common challenges faced by people living with ASD and ID, including hypersensitivity to vivid colours, difficulty understanding complex information, and difficulty staying focused. A simple clean structure, clear and consistent layouts, and calm spaces provide a comfortable and inclusive space where users feel at home.