Accessible Design
Training & Resources
Course Goals
- To promote awareness and sensitivity towards accessibility issues and the need for inclusive design in all aspects of communication
- To provide an overview of the various types of disabilities and their impact on accessibility.
- To introduce the basic concepts and principles of accessibility for web and print materials.
- To equip participants with knowledge of the latest tools and techniques for creating accessible courses, presentations, and other online materials.
Course Modules
Types of Disabilities
Promote Awareness
Principles of Accessibility
Tools & Techniques
Goal & Outcomes
Promote Awareness
Learning goal for this module:
- To promote awareness and sensitivity towards accessibility issues and the need for inclusive design in all aspects of communication.
Learning outcomes for this module:
- Raise awareness of how people with disabilities use websites and applications.
- Describe examples of how people with disabilities use the Web.
Accessibility Perspectives
Promote Awareness
"Web Accessibility: Essential for some, useful for all" is a compilation of 10 videos. Each section shows a specific aspect of accessibility and how it impacts users with and without disabilities. For links to individual videos and more information on each topic, please see web accessibility perspectives on the WIA website.
Color Blindness
Promote Awareness
We use color to convey content and information, but what if you couldn't see color or distinguish between the different colors on the screen? How would you perceive the information?
Try It
The image below has been altered using the Coblis tool to simulate a type of red-green color vision deficiency called Protanopia.
Reveal the orginal colors
Alternate Text
Promote Awareness
When users cannot perceive visual information, they may rely on a screen reader. Screen readers convey information that cannot always be seen, such as alternative text for images. Screen readers also provide the user with information about how to navigate the information and what type of information is being conveyed such as images and links.
Try It
Since screen readers are tricky to use, we have set up an alternative way for you to experience this tool and the implications for its use. Click the image to open a dialog box containing the alternative text description.
Alt. Text 1
Alt. Text 2
Alt. Text 3
Click the eye to reveal the image. Which image had the most helpful alternative text?
Text to Speech
Promote Awareness
Many users, with and without disabilities, rely on text-to-speech tools. In addition to helping those with visual disabilities and dyslexia, they help struggling readers, multi-language learners, and many others. Text-to-speech tools can also help users when the color contrast is too low or the text is otherwise hard to read.
Try It
Test out accessing content through a screen reader by viewing or listening to the text below, from W3C Stories of Web Users. Click on the text below to hear it read aloud.
Stefan is a student who has dyslexia and attention deficit hyperactivity disorder (ADHD). Stefan finds it hard to maintain focus on his schoolwork, especially when reading a lot of dense text or following written instructions.
He likes digital textbooks and websites that allow him to use text-to-speech software because he can follow both the written and auditory words.
It’s important though that websites and other digital technology use plain language, a consistent layout, and don’t display pop-up ads or moving images, which are very distracting and confusing. Mobile apps and websites are often less cluttered and easier to use.
Captions
Promote Awareness
Captions (called “subtitles” in some areas) provide content to people who are Deaf and hard-of-hearing. Captions are a text version of the speech and non-speech audio information needed to understand the content. They are synchronized with the audio and are usually shown in a media player when users turn them on.
Try It
- Watch the video below with the sound off. See if you can figure out what is happening. Is the visual content enough to convey the message?
- Watch the video again. Leave the sound off, but turn the captions on. Are you able to consume the content information now?
Attribution and Notes
Betsy Minton Tech
Attribution
Almost written content for this course is from the WC3 schools Introduction to Web Accessibilty website.Images are from FreePik. The video is by CPG Grey and can be found at https://youtu.be/JEYh5WACqEk
Notes
This course was originally designed in Canvas with the Cidilabs Design Plus tool. Since I cannot provide you access to that course, I recreated a demo version to share with prospective clients and employers. The version here is meant to replicate the original as closely as possible. Still, there are some key differences, mostly related to the aspect ratio of the pages and differences in the tools available.
Accessibility Course
Betsy Minton Tech
Created on March 20, 2025
Start designing with a free template
Discover more than 1500 professional designs like these:
View
Vision Board
View
Periodic Table
View
SWOT Challenge: Classify Key Factors
View
Explainer Video: Keys to Effective Communication
View
Explainer Video: AI for Companies
View
Corporate CV
View
Flow Presentation
Explore all templates
Transcript
Accessible Design
Training & Resources
Course Goals
Course Modules
Types of Disabilities
Promote Awareness
Principles of Accessibility
Tools & Techniques
Goal & Outcomes
Promote Awareness
Learning goal for this module:
Learning outcomes for this module:
Accessibility Perspectives
Promote Awareness
"Web Accessibility: Essential for some, useful for all" is a compilation of 10 videos. Each section shows a specific aspect of accessibility and how it impacts users with and without disabilities. For links to individual videos and more information on each topic, please see web accessibility perspectives on the WIA website.
Color Blindness
Promote Awareness
We use color to convey content and information, but what if you couldn't see color or distinguish between the different colors on the screen? How would you perceive the information?
Try It
The image below has been altered using the Coblis tool to simulate a type of red-green color vision deficiency called Protanopia.
Reveal the orginal colors
Alternate Text
Promote Awareness
When users cannot perceive visual information, they may rely on a screen reader. Screen readers convey information that cannot always be seen, such as alternative text for images. Screen readers also provide the user with information about how to navigate the information and what type of information is being conveyed such as images and links.
Try It
Since screen readers are tricky to use, we have set up an alternative way for you to experience this tool and the implications for its use. Click the image to open a dialog box containing the alternative text description.
Alt. Text 1
Alt. Text 2
Alt. Text 3
Click the eye to reveal the image. Which image had the most helpful alternative text?
Text to Speech
Promote Awareness
Many users, with and without disabilities, rely on text-to-speech tools. In addition to helping those with visual disabilities and dyslexia, they help struggling readers, multi-language learners, and many others. Text-to-speech tools can also help users when the color contrast is too low or the text is otherwise hard to read.
Try It
Test out accessing content through a screen reader by viewing or listening to the text below, from W3C Stories of Web Users. Click on the text below to hear it read aloud.
Stefan is a student who has dyslexia and attention deficit hyperactivity disorder (ADHD). Stefan finds it hard to maintain focus on his schoolwork, especially when reading a lot of dense text or following written instructions.
He likes digital textbooks and websites that allow him to use text-to-speech software because he can follow both the written and auditory words.
It’s important though that websites and other digital technology use plain language, a consistent layout, and don’t display pop-up ads or moving images, which are very distracting and confusing. Mobile apps and websites are often less cluttered and easier to use.
Captions
Promote Awareness
Captions (called “subtitles” in some areas) provide content to people who are Deaf and hard-of-hearing. Captions are a text version of the speech and non-speech audio information needed to understand the content. They are synchronized with the audio and are usually shown in a media player when users turn them on.
Try It
Attribution and Notes
Betsy Minton Tech
Attribution
Almost written content for this course is from the WC3 schools Introduction to Web Accessibilty website.Images are from FreePik. The video is by CPG Grey and can be found at https://youtu.be/JEYh5WACqEk
Notes
This course was originally designed in Canvas with the Cidilabs Design Plus tool. Since I cannot provide you access to that course, I recreated a demo version to share with prospective clients and employers. The version here is meant to replicate the original as closely as possible. Still, there are some key differences, mostly related to the aspect ratio of the pages and differences in the tools available.