Design Collection

The Inaccessibility of Accessible Web Design

This CMS prototype integrates accessibility guidelines within the website development process and empowers mainstream audiences to build accessible websites.

accessibility guidelines accessible web design interface user experience wcag aoda

divider
Accessibility Compliance Checker
Accessibility Compliance Checker

Digital Media

Accessibility Compliance Checker

An accessibility compliance checker is a tool that can scan a website’s content to see if it meets most Web Content Accessibility Guidelines. If a website is compliant, the web content will be accessible to most people who access it. A website can... More

Alternative Text and Decorative Images
Alternative Text and Decorative Images

Digital Media

Alternative Text and Decorative Images

Giving images alternative text is one of the most common accessibility integrations. However, it is still not common in CMS interfaces. This prototype has an option to add alternative text or mark an image as decorative when adding an image to... More

Colour Contrast
Colour Contrast

Digital Media

Colour Contrast

Colour contrast checkers are often third-party software that content creators can use in tandem with web content development. Still, CMS platforms would benefit from integrating them directly within their interfaces. The tool checks if the text... More

Form Titles and Labels
Form Titles and Labels

Digital Media

Form Titles and Labels

There are two primary accessibility integrations for adding forms. The first is ensuring that all form fields have proper titles that clearly explain what information is needed. These titles should sit outside of the input field itself so that once... More

Publishing
Publishing

Digital Media

Publishing

There are two different ways that publishing can work with this prototype. The first is to make accessibility mandatory. In this version, the Publish button will not be able to be used until all accessibility errors are fixed. Once the scanner... More

Semantic Headings
Semantic Headings

Digital Media

Semantic Headings

Semantic headings are one of the accessibility integrations common in CMS tools but are not used correctly. Because CMS platforms generally combine text styling with the heading tags, people associate them more with the visual design of the page... More

Work by

Chloe Typert-Morrison

Inclusive Design, Accessible Web Design

“Giving everyone the power to create accessible content shifts the onus to the content creators from the people affected by the inaccessibility. Accessible websites benefit everyone, and I hope this...” [More]