SlideShare a Scribd company logo
1 of 38
Barry Dahl
Teaching & Learning Advocate, D2L
Ten Bright Ideas to Make your Online
Courses More Accessible to Students with
Disabilities
Who am I?
• Presenter: Barry Dahl
• Teaching & Learning Advocate,
D2L
• Not an Accessibility Expert, but a
dogged learner about all things
related to web #a11y
• Barry.dahl@D2L.com
• @D2LBarry
• @barrydahl
Ten Bright Ideas for #A11y
1. Improving Alt Text
2. Alt Text No-No’s
3. Complex images
4. Proper list formatting
5. Color blindness
simulator
6. Proper link formation
7. Emojis and Emoticons
8. HTML Accessible
Templates
9. Brightspace A11y
Checker
10. Become a Self-Tester
1. Examine and Improve Alt Text for Simple Images
• Class: Intro to Business
• Alt text: “The Great Depression.”
• Revised: "A long waiting line
outside a building offering free
coffee and donuts to
unemployed people on a cold
day during the Great
Depression."
Example of Simple Image with Surrounding Text
2. Alt Text No-No’s
• Don’t repeat things that are already conveyed in plain text on the
page
• Don’t put info in alt text that isn’t conveyed any other way
• Don’t forget good grammar and punctuation
• Don’t load it up with keywords
• Don’t use phrases such as “photo of” or “Image of”
• Don’t write alt text for decorative images (alt="“)
• Don’t put in a URL or the image filename
• Don’t expect machine-generated Alt Text to be useful
• Don’t include details unless they’re relevant
• Don’t repeat the same alt text for multiple images
Examples of Alt Text No-No’s
It’s International Unicorn Day! Fun!
(Maybe so, butthis isdecorative)
Alttext:Eventhoughsunflowersareself-pollenati
researchshowshoneybeeactivitycanimprove
cropyields.(Poor:notobviousinformation)
3. Complex Images May Require Complex Alt Text
Have you ever used a word cloud in an online course, or
an infographic, or a flowchart?
What would you do with this one?
How do you describe this image of a table, so the low/no vision student
is not at a disadvantage?
4. Create Proper Lists in Content Pages
What’s wrong with list A?
1. The sky today is grey
2. Koolaid tastes great
3. My hair is curly
4. You should know this
What’s wrong with list B?
• Plug-in computer
• Push power button
• Open web browser
• Navigate to website
5. Check colors in photos & graphics
• If you are using photos where
colors are important – check
them out first using a color
blindness simulator.
• Coblis
• Search for “Coblis Color Blindness
Simulator”
• Free and easy
Green-weak Deuteranomaly: 5% of males
Green-blind Deuteranopia: 1% of males
6. Create text links instead of unreadable URLs
• https://docs.google.com/spreadsheets/d/15h9tFfqmdsrYUSqEYata1Uir
7EvjlRIQBoOS5StxXd0/edit#gid=0
• Guest Authors Spreadsheet
What does screen reading
software say when it comes to
this?
http://brightspace.com/tlc
What does screen reading
software say when it comes to
this?
Teaching & Learning Community
7. How about Emojis?
• This emoji was inserted using the Brightspace Editor: 😆
• Does it have alt text?
• No, not that you'll see in the code.
• But what does JAWS have to say?
• JAWS will announce the name of the emoji, so the alt text is embedded.
• This one says "smiling face with open mouth and tightly closed eyes.“
• Other screen readers may read a description rather than the name.
How about Emoticons?
• Emoticons are a concoction of symbols and punctuation marks that will be
read out loud just like that: a series of symbols and punctuation marks.
• Screen reader users might mistakenly take this as grammatical errors or
typos in your message.
:-) 🙂 O:-) 👼
X3 🐱 ¯_(ツ)_/¯ 🤷
NVDA Screen Reader Emoji Example
8. HTML Accessible Templates – by D2L
• Create accessible, professional-
looking HTML content files with
D2L’s free HTML template
packages
• A11y features are built into the
underlying code
• You concentrate on adding text,
images, and other course
resources
• Maintains the Responsive
Design needed for different size
screens
Add Templates to Your Course
• You can download a Zip file of free
templates at the Brightspace
Community
• Steps to follow:
1. download Zip file to your computer
2. upload into the Manage Files section of
your course
3. unzip into a file folder
4. enable for use throughout the course
in Content Settings
9. Brightspace A11y Checker
Examples of content accessibility
checking:
• Heading order
• Alternative text for images
• Color contrast ratios
• Proper list structure
• Proper link formation
• Proper markup of tables
A11y Checker is NOT Perfect
• Decorative alt text (null alt text)
is assumed to wrong – and is
identified as no alt text.
• Checker cannot actually check
for captions in an embedded
video.
10. Learn to Test for A11y Issues
• Keyboard-only Navigation
Interaction Keystrokes Notes
Navigate to interactive
elements
• Tab - navigate forward
• Shift + Tab - navigate
backward
• Keyboard focus indicators
must be present.
• Navigation order should be
logical and intuitive.
Link • Enter - activate the link
Button
• Enter or Spacebar - activate
the button
• Ensure elements with
ARIA role="button" can be
activated with both key
commands.
Checkbox
• Spacebar - check/uncheck a
checkbox
• Users can typically select
zero, one, or multiple options
from group of checkboxes.
Additional Testing Possibilities
Use a Screen Reader to learn about that experience.
1. JAWS (Windows-only)
• By Freedom Scientific. 40-minute free trail, $95 per year for 3 PCs
2. NVDA (Windows-only)
• Free and Open Source, developed by the blind for the blind
3. VoiceOver (Mac-only)
• Free, built into macOS
4. Windows Narrator (Built into Windows)
• Free, turn on/off with Windows logo + Ctrl + Enter
5. Funkify Chrome Extension
• Freemium model, free version includes color blind simulator, Dyslexia, and
more
Barry.Dahl@D2L.com
@D2LBarry
Q & A
Appendix Follows
Slides not used for this presentation
Ten Bright Ideas for #A11y
1. Decorative Images
2. Improving Alt Text
3. Alt Text for complex
images
4. Finding videos w/good
captions
5. Proper list formatting
6. Color blindness
simulator
7. Proper link formation
8. Emojis and Emoticons
9. HTML Accessible
Templates
10. Check out 3rd-Party
tools
8. For Office Documents, use Built-in A11Y Checker
• Go to the File tab (Windows
only)
• Select Info from the sidebar
menu.
• Click on the Check for Issues
button.
• Select Check Accessibility
from the drop-down list.
• The accessibility checker only
checks .docx and .pptx files
9. Document Accessibility Toolbar (Word)
• Vision Australia
• Document Accessibility
Toolbar (DAT)
• Totally free
• Installs a new
menu/toolbar
on the MS Word
Ribbon
• Windows-only (sorry
Mac)
• Works with Office 2010
All A11y tools on one ribbon menu
Makes Adding Alt-Text for Images Easier
1. Use Null Alt Text for Decorative Images
• Alt=""
• Example code:
<img src= “…pixabay-unicorn.png" alt="" … />
• Assistive Technology will ignore an image with
null alt text.
• Note: Having a null alt text attribute is not the
same as having no alt text attribute.
Inserting a decorative image - checkbox
Inserting a decorative image – code with null alt text
Inserting a decorative image in an Announcement
4. Searching for captioned videos on YouTube
• Don't be fooled by YouTube's machine captions. YouTube uses voice recognition
software to automagically create a video transcript and captions for almost every
video uploaded to YouTube.
• To find human transcribed captioned videos on YouTube:
1. Enter your search term in the YouTube search field.
2. Add a: , CC (that's a comma, CC)
3. Hit Enter or click the magnifying glass icon.
4. YouTube Search Results
10. Consider the #a11y Features of External Tools
• Using external (usually web-
based) tools is popular in
education.
• Is the tool built to allow
users with disabilities to
create content?
• Is the output created by
the tool web accessible?
• Do you have alternatives
or work-arounds in place
for students who cannot
participate?
Two sites for #a11y information on external tools
centerononlinelearning.org.res.ku.edu/
vpat
www.web2access.org.uk/

More Related Content

What's hot

What's hot (16)

Intro to Manual Testing
Intro to Manual TestingIntro to Manual Testing
Intro to Manual Testing
 
Black Box Testing
Black Box TestingBlack Box Testing
Black Box Testing
 
Be a Hero on Day 1 with ASP.Net Boilerplate
Be a Hero on Day 1 with ASP.Net BoilerplateBe a Hero on Day 1 with ASP.Net Boilerplate
Be a Hero on Day 1 with ASP.Net Boilerplate
 
Software Testing or Quality Assurance
Software Testing or Quality AssuranceSoftware Testing or Quality Assurance
Software Testing or Quality Assurance
 
Unit test
Unit testUnit test
Unit test
 
Java swing
Java swingJava swing
Java swing
 
Manual testing ppt
Manual testing pptManual testing ppt
Manual testing ppt
 
Fundamentals of testing
Fundamentals of testingFundamentals of testing
Fundamentals of testing
 
Test Plan Simplicity
Test Plan SimplicityTest Plan Simplicity
Test Plan Simplicity
 
Object Oriented Testing
Object Oriented TestingObject Oriented Testing
Object Oriented Testing
 
Testing a service
Testing a serviceTesting a service
Testing a service
 
Dependency injection in iOS
Dependency injection in iOSDependency injection in iOS
Dependency injection in iOS
 
Understanding Unit Testing
Understanding Unit TestingUnderstanding Unit Testing
Understanding Unit Testing
 
White box & Black box testing
White box & Black box testingWhite box & Black box testing
White box & Black box testing
 
Introduction to BDD
Introduction to BDD Introduction to BDD
Introduction to BDD
 
The Role of Self-Efficacy in Students’ Writing Ability (A Case Study at Secon...
The Role of Self-Efficacy in Students’ Writing Ability (A Case Study at Secon...The Role of Self-Efficacy in Students’ Writing Ability (A Case Study at Secon...
The Role of Self-Efficacy in Students’ Writing Ability (A Case Study at Secon...
 

Similar to Ten Bright Ideas for Improving Accessibility in Online Courses - Barry Dahl - Oct 2022

Ten Bright Ideas for Improving Accessibility in Brightspace
Ten Bright Ideas for Improving Accessibility in BrightspaceTen Bright Ideas for Improving Accessibility in Brightspace
Ten Bright Ideas for Improving Accessibility in BrightspaceD2L Barry
 
Ten Bright Ideas to make your Brightspace Courses More Accessible to Students...
Ten Bright Ideas to make your Brightspace Courses More Accessible to Students...Ten Bright Ideas to make your Brightspace Courses More Accessible to Students...
Ten Bright Ideas to make your Brightspace Courses More Accessible to Students...D2L Barry
 
Making Online Courses more Accessible
Making Online Courses more AccessibleMaking Online Courses more Accessible
Making Online Courses more AccessibleD2L Barry
 
Ten Bright Ideas for Accessibility - Barry Dahl - May 2018 - with notes
Ten Bright Ideas for Accessibility - Barry Dahl - May 2018 - with notesTen Bright Ideas for Accessibility - Barry Dahl - May 2018 - with notes
Ten Bright Ideas for Accessibility - Barry Dahl - May 2018 - with notesD2L Barry
 
Ten Bright Ideas to Make your Brightspace Courses More Accessible to Students...
Ten Bright Ideas to Make your Brightspace Courses More Accessible to Students...Ten Bright Ideas to Make your Brightspace Courses More Accessible to Students...
Ten Bright Ideas to Make your Brightspace Courses More Accessible to Students...Barry Dahl
 
Ten Bright Ideas for Accessibility - Brightspace Connections
Ten Bright Ideas for Accessibility - Brightspace ConnectionsTen Bright Ideas for Accessibility - Brightspace Connections
Ten Bright Ideas for Accessibility - Brightspace ConnectionsD2L Barry
 
10 Bright Ideas to make your Brightspace Courses More Accessible to Students ...
10 Bright Ideas to make your Brightspace Courses More Accessible to Students ...10 Bright Ideas to make your Brightspace Courses More Accessible to Students ...
10 Bright Ideas to make your Brightspace Courses More Accessible to Students ...D2L Barry
 
Ten Bright Ideas for Improving Accessibility of Brightspace Courses
Ten Bright Ideas for Improving Accessibility of Brightspace CoursesTen Bright Ideas for Improving Accessibility of Brightspace Courses
Ten Bright Ideas for Improving Accessibility of Brightspace CoursesD2L Barry
 
Ten Bright Ideas for Accessibility in Brightspace
Ten Bright Ideas for Accessibility in BrightspaceTen Bright Ideas for Accessibility in Brightspace
Ten Bright Ideas for Accessibility in BrightspaceD2L Barry
 
Using Web-based Tools in Brightspace, with an Eye on Accessibility accessibly
Using Web-based Tools in Brightspace, with an Eye on Accessibility accessiblyUsing Web-based Tools in Brightspace, with an Eye on Accessibility accessibly
Using Web-based Tools in Brightspace, with an Eye on Accessibility accessiblyD2L Barry
 
Using Web 2.0 Tools inside Brightspace with an Eye on Accessibility
Using Web 2.0 Tools inside Brightspace with an Eye on AccessibilityUsing Web 2.0 Tools inside Brightspace with an Eye on Accessibility
Using Web 2.0 Tools inside Brightspace with an Eye on AccessibilityD2L
 
Giving a Great Talk - Tips
Giving a Great Talk - TipsGiving a Great Talk - Tips
Giving a Great Talk - TipsJennifer Gardy
 
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...Anthony D. Paul
 
Welcometo imscomputers7
Welcometo imscomputers7Welcometo imscomputers7
Welcometo imscomputers7Anne Asplund
 
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...Anthony D. Paul
 
H5P content types 22.2.18
H5P content types 22.2.18H5P content types 22.2.18
H5P content types 22.2.18Matleena Laakso
 
Prototyping Accessibility: Booster 2019
Prototyping Accessibility: Booster 2019Prototyping Accessibility: Booster 2019
Prototyping Accessibility: Booster 2019Adrian Roselli
 
Prototyping Accessibility - WordCamp Europe 2018
Prototyping Accessibility - WordCamp Europe 2018Prototyping Accessibility - WordCamp Europe 2018
Prototyping Accessibility - WordCamp Europe 2018Adrian Roselli
 

Similar to Ten Bright Ideas for Improving Accessibility in Online Courses - Barry Dahl - Oct 2022 (20)

Ten Bright Ideas for Improving Accessibility in Brightspace
Ten Bright Ideas for Improving Accessibility in BrightspaceTen Bright Ideas for Improving Accessibility in Brightspace
Ten Bright Ideas for Improving Accessibility in Brightspace
 
Ten Bright Ideas to make your Brightspace Courses More Accessible to Students...
Ten Bright Ideas to make your Brightspace Courses More Accessible to Students...Ten Bright Ideas to make your Brightspace Courses More Accessible to Students...
Ten Bright Ideas to make your Brightspace Courses More Accessible to Students...
 
Making Online Courses more Accessible
Making Online Courses more AccessibleMaking Online Courses more Accessible
Making Online Courses more Accessible
 
Ten Bright Ideas for Accessibility - Barry Dahl - May 2018 - with notes
Ten Bright Ideas for Accessibility - Barry Dahl - May 2018 - with notesTen Bright Ideas for Accessibility - Barry Dahl - May 2018 - with notes
Ten Bright Ideas for Accessibility - Barry Dahl - May 2018 - with notes
 
Ten Bright Ideas to Make your Brightspace Courses More Accessible to Students...
Ten Bright Ideas to Make your Brightspace Courses More Accessible to Students...Ten Bright Ideas to Make your Brightspace Courses More Accessible to Students...
Ten Bright Ideas to Make your Brightspace Courses More Accessible to Students...
 
Ten Bright Ideas for Accessibility - Brightspace Connections
Ten Bright Ideas for Accessibility - Brightspace ConnectionsTen Bright Ideas for Accessibility - Brightspace Connections
Ten Bright Ideas for Accessibility - Brightspace Connections
 
10 Bright Ideas to make your Brightspace Courses More Accessible to Students ...
10 Bright Ideas to make your Brightspace Courses More Accessible to Students ...10 Bright Ideas to make your Brightspace Courses More Accessible to Students ...
10 Bright Ideas to make your Brightspace Courses More Accessible to Students ...
 
Ten Bright Ideas for Improving Accessibility of Brightspace Courses
Ten Bright Ideas for Improving Accessibility of Brightspace CoursesTen Bright Ideas for Improving Accessibility of Brightspace Courses
Ten Bright Ideas for Improving Accessibility of Brightspace Courses
 
Ten Bright Ideas for Accessibility in Brightspace
Ten Bright Ideas for Accessibility in BrightspaceTen Bright Ideas for Accessibility in Brightspace
Ten Bright Ideas for Accessibility in Brightspace
 
Using Web-based Tools in Brightspace, with an Eye on Accessibility accessibly
Using Web-based Tools in Brightspace, with an Eye on Accessibility accessiblyUsing Web-based Tools in Brightspace, with an Eye on Accessibility accessibly
Using Web-based Tools in Brightspace, with an Eye on Accessibility accessibly
 
Using Web 2.0 Tools inside Brightspace with an Eye on Accessibility
Using Web 2.0 Tools inside Brightspace with an Eye on AccessibilityUsing Web 2.0 Tools inside Brightspace with an Eye on Accessibility
Using Web 2.0 Tools inside Brightspace with an Eye on Accessibility
 
Giving a Great Talk - Tips
Giving a Great Talk - TipsGiving a Great Talk - Tips
Giving a Great Talk - Tips
 
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...
 
Welcometo imscomputers7
Welcometo imscomputers7Welcometo imscomputers7
Welcometo imscomputers7
 
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...
Responsive Prototyping with WordPress and Atomic UI Libraries - anthonydpaul ...
 
H5P content types 22.2.18
H5P content types 22.2.18H5P content types 22.2.18
H5P content types 22.2.18
 
Prototyping Accessibility: Booster 2019
Prototyping Accessibility: Booster 2019Prototyping Accessibility: Booster 2019
Prototyping Accessibility: Booster 2019
 
Camtasia Can Do That
Camtasia Can Do ThatCamtasia Can Do That
Camtasia Can Do That
 
Prototyping Accessibility - WordCamp Europe 2018
Prototyping Accessibility - WordCamp Europe 2018Prototyping Accessibility - WordCamp Europe 2018
Prototyping Accessibility - WordCamp Europe 2018
 
Wimba2.0
Wimba2.0Wimba2.0
Wimba2.0
 

More from D2L Barry

Ask Not What AI Can Do For You - Nov 2023 - Slideshare.pptx
Ask Not What AI Can Do For You - Nov 2023 - Slideshare.pptxAsk Not What AI Can Do For You - Nov 2023 - Slideshare.pptx
Ask Not What AI Can Do For You - Nov 2023 - Slideshare.pptxD2L Barry
 
Designing Competency Structures and Learning Objectives
Designing Competency Structures and Learning ObjectivesDesigning Competency Structures and Learning Objectives
Designing Competency Structures and Learning ObjectivesD2L Barry
 
AI and ChatGPT in Online Education
AI and ChatGPT in Online Education AI and ChatGPT in Online Education
AI and ChatGPT in Online Education D2L Barry
 
Designing Online Courses for Flexibility
Designing Online Courses for FlexibilityDesigning Online Courses for Flexibility
Designing Online Courses for FlexibilityD2L Barry
 
Custom Pathways Resources - Kristin Randles.pdf
Custom Pathways Resources - Kristin Randles.pdfCustom Pathways Resources - Kristin Randles.pdf
Custom Pathways Resources - Kristin Randles.pdfD2L Barry
 
Don't Tell Me - Denise Huff.pptx
Don't Tell Me - Denise Huff.pptxDon't Tell Me - Denise Huff.pptx
Don't Tell Me - Denise Huff.pptxD2L Barry
 
Increase Learner Engagement and Cultivate Persistence in Brightspace - Dan Semi
Increase Learner Engagement and Cultivate Persistence in Brightspace - Dan SemiIncrease Learner Engagement and Cultivate Persistence in Brightspace - Dan Semi
Increase Learner Engagement and Cultivate Persistence in Brightspace - Dan SemiD2L Barry
 
Brightspace Creator +, Content Creation Platform for Engaging Interactives an...
Brightspace Creator +, Content Creation Platform for Engaging Interactives an...Brightspace Creator +, Content Creation Platform for Engaging Interactives an...
Brightspace Creator +, Content Creation Platform for Engaging Interactives an...D2L Barry
 
ABCs of Brightspace Awards - Dan Semi
ABCs of Brightspace Awards - Dan SemiABCs of Brightspace Awards - Dan Semi
ABCs of Brightspace Awards - Dan SemiD2L Barry
 
Brightspace Quick Eval Best Practices - Michelle Piper
Brightspace Quick Eval Best Practices - Michelle PiperBrightspace Quick Eval Best Practices - Michelle Piper
Brightspace Quick Eval Best Practices - Michelle PiperD2L Barry
 
10 Brightspace Tools You Didn’t Know About - Michelle Piper
10 Brightspace Tools You Didn’t Know About - Michelle Piper10 Brightspace Tools You Didn’t Know About - Michelle Piper
10 Brightspace Tools You Didn’t Know About - Michelle PiperD2L Barry
 
E-Learning Mythbusters Revisited - ITC 2022.pptx
E-Learning Mythbusters Revisited - ITC 2022.pptxE-Learning Mythbusters Revisited - ITC 2022.pptx
E-Learning Mythbusters Revisited - ITC 2022.pptxD2L Barry
 
Five Important Things You Won't Find in a Course Quality Rubric - Barry Dahl
Five Important Things You Won't Find in a Course Quality Rubric - Barry DahlFive Important Things You Won't Find in a Course Quality Rubric - Barry Dahl
Five Important Things You Won't Find in a Course Quality Rubric - Barry DahlD2L Barry
 
Office Documents: Making Word™ and PowerPoint™ Docs Accessible
Office Documents: Making Word™ and PowerPoint™ Docs AccessibleOffice Documents: Making Word™ and PowerPoint™ Docs Accessible
Office Documents: Making Word™ and PowerPoint™ Docs AccessibleD2L Barry
 
Video Captions and Transcripts Made Easy , or at least easier
Video Captions and Transcripts Made Easy , or at least easierVideo Captions and Transcripts Made Easy , or at least easier
Video Captions and Transcripts Made Easy , or at least easierD2L Barry
 
Video Captions and Transcripts Made Easy, or at least easier
Video Captions and Transcripts Made Easy, or at least easierVideo Captions and Transcripts Made Easy, or at least easier
Video Captions and Transcripts Made Easy, or at least easierD2L Barry
 
Five Easy Wins for Making your PowerPoint Slideshows Accessible
Five Easy Wins for Making your PowerPoint Slideshows AccessibleFive Easy Wins for Making your PowerPoint Slideshows Accessible
Five Easy Wins for Making your PowerPoint Slideshows AccessibleD2L Barry
 
D2L as a Training Platform for Faculty: Lessons Learned
D2L as a Training Platform for Faculty: Lessons LearnedD2L as a Training Platform for Faculty: Lessons Learned
D2L as a Training Platform for Faculty: Lessons LearnedD2L Barry
 
Handout: YuJa, post to a discussion from a mobile device
Handout: YuJa, post to a discussion from a mobile deviceHandout: YuJa, post to a discussion from a mobile device
Handout: YuJa, post to a discussion from a mobile deviceD2L Barry
 
Handout: Channel Directions for YuJa
Handout: Channel Directions for YuJaHandout: Channel Directions for YuJa
Handout: Channel Directions for YuJaD2L Barry
 

More from D2L Barry (20)

Ask Not What AI Can Do For You - Nov 2023 - Slideshare.pptx
Ask Not What AI Can Do For You - Nov 2023 - Slideshare.pptxAsk Not What AI Can Do For You - Nov 2023 - Slideshare.pptx
Ask Not What AI Can Do For You - Nov 2023 - Slideshare.pptx
 
Designing Competency Structures and Learning Objectives
Designing Competency Structures and Learning ObjectivesDesigning Competency Structures and Learning Objectives
Designing Competency Structures and Learning Objectives
 
AI and ChatGPT in Online Education
AI and ChatGPT in Online Education AI and ChatGPT in Online Education
AI and ChatGPT in Online Education
 
Designing Online Courses for Flexibility
Designing Online Courses for FlexibilityDesigning Online Courses for Flexibility
Designing Online Courses for Flexibility
 
Custom Pathways Resources - Kristin Randles.pdf
Custom Pathways Resources - Kristin Randles.pdfCustom Pathways Resources - Kristin Randles.pdf
Custom Pathways Resources - Kristin Randles.pdf
 
Don't Tell Me - Denise Huff.pptx
Don't Tell Me - Denise Huff.pptxDon't Tell Me - Denise Huff.pptx
Don't Tell Me - Denise Huff.pptx
 
Increase Learner Engagement and Cultivate Persistence in Brightspace - Dan Semi
Increase Learner Engagement and Cultivate Persistence in Brightspace - Dan SemiIncrease Learner Engagement and Cultivate Persistence in Brightspace - Dan Semi
Increase Learner Engagement and Cultivate Persistence in Brightspace - Dan Semi
 
Brightspace Creator +, Content Creation Platform for Engaging Interactives an...
Brightspace Creator +, Content Creation Platform for Engaging Interactives an...Brightspace Creator +, Content Creation Platform for Engaging Interactives an...
Brightspace Creator +, Content Creation Platform for Engaging Interactives an...
 
ABCs of Brightspace Awards - Dan Semi
ABCs of Brightspace Awards - Dan SemiABCs of Brightspace Awards - Dan Semi
ABCs of Brightspace Awards - Dan Semi
 
Brightspace Quick Eval Best Practices - Michelle Piper
Brightspace Quick Eval Best Practices - Michelle PiperBrightspace Quick Eval Best Practices - Michelle Piper
Brightspace Quick Eval Best Practices - Michelle Piper
 
10 Brightspace Tools You Didn’t Know About - Michelle Piper
10 Brightspace Tools You Didn’t Know About - Michelle Piper10 Brightspace Tools You Didn’t Know About - Michelle Piper
10 Brightspace Tools You Didn’t Know About - Michelle Piper
 
E-Learning Mythbusters Revisited - ITC 2022.pptx
E-Learning Mythbusters Revisited - ITC 2022.pptxE-Learning Mythbusters Revisited - ITC 2022.pptx
E-Learning Mythbusters Revisited - ITC 2022.pptx
 
Five Important Things You Won't Find in a Course Quality Rubric - Barry Dahl
Five Important Things You Won't Find in a Course Quality Rubric - Barry DahlFive Important Things You Won't Find in a Course Quality Rubric - Barry Dahl
Five Important Things You Won't Find in a Course Quality Rubric - Barry Dahl
 
Office Documents: Making Word™ and PowerPoint™ Docs Accessible
Office Documents: Making Word™ and PowerPoint™ Docs AccessibleOffice Documents: Making Word™ and PowerPoint™ Docs Accessible
Office Documents: Making Word™ and PowerPoint™ Docs Accessible
 
Video Captions and Transcripts Made Easy , or at least easier
Video Captions and Transcripts Made Easy , or at least easierVideo Captions and Transcripts Made Easy , or at least easier
Video Captions and Transcripts Made Easy , or at least easier
 
Video Captions and Transcripts Made Easy, or at least easier
Video Captions and Transcripts Made Easy, or at least easierVideo Captions and Transcripts Made Easy, or at least easier
Video Captions and Transcripts Made Easy, or at least easier
 
Five Easy Wins for Making your PowerPoint Slideshows Accessible
Five Easy Wins for Making your PowerPoint Slideshows AccessibleFive Easy Wins for Making your PowerPoint Slideshows Accessible
Five Easy Wins for Making your PowerPoint Slideshows Accessible
 
D2L as a Training Platform for Faculty: Lessons Learned
D2L as a Training Platform for Faculty: Lessons LearnedD2L as a Training Platform for Faculty: Lessons Learned
D2L as a Training Platform for Faculty: Lessons Learned
 
Handout: YuJa, post to a discussion from a mobile device
Handout: YuJa, post to a discussion from a mobile deviceHandout: YuJa, post to a discussion from a mobile device
Handout: YuJa, post to a discussion from a mobile device
 
Handout: Channel Directions for YuJa
Handout: Channel Directions for YuJaHandout: Channel Directions for YuJa
Handout: Channel Directions for YuJa
 

Recently uploaded

PSYPACT- Practicing Over State Lines May 2024.pptx
PSYPACT- Practicing Over State Lines May 2024.pptxPSYPACT- Practicing Over State Lines May 2024.pptx
PSYPACT- Practicing Over State Lines May 2024.pptxMarlene Maheu
 
The Story of Village Palampur Class 9 Free Study Material PDF
The Story of Village Palampur Class 9 Free Study Material PDFThe Story of Village Palampur Class 9 Free Study Material PDF
The Story of Village Palampur Class 9 Free Study Material PDFVivekanand Anglo Vedic Academy
 
male presentation...pdf.................
male presentation...pdf.................male presentation...pdf.................
male presentation...pdf.................MirzaAbrarBaig5
 
MOOD STABLIZERS DRUGS.pptx
MOOD     STABLIZERS           DRUGS.pptxMOOD     STABLIZERS           DRUGS.pptx
MOOD STABLIZERS DRUGS.pptxPoojaSen20
 
Spring gala 2024 photo slideshow - Celebrating School-Community Partnerships
Spring gala 2024 photo slideshow - Celebrating School-Community PartnershipsSpring gala 2024 photo slideshow - Celebrating School-Community Partnerships
Spring gala 2024 photo slideshow - Celebrating School-Community Partnershipsexpandedwebsite
 
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...Nguyen Thanh Tu Collection
 
When Quality Assurance Meets Innovation in Higher Education - Report launch w...
When Quality Assurance Meets Innovation in Higher Education - Report launch w...When Quality Assurance Meets Innovation in Higher Education - Report launch w...
When Quality Assurance Meets Innovation in Higher Education - Report launch w...Gary Wood
 
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽中 央社
 
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfFICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfPondicherry University
 
Analyzing and resolving a communication crisis in Dhaka textiles LTD.pptx
Analyzing and resolving a communication crisis in Dhaka textiles LTD.pptxAnalyzing and resolving a communication crisis in Dhaka textiles LTD.pptx
Analyzing and resolving a communication crisis in Dhaka textiles LTD.pptxLimon Prince
 
SURVEY I created for uni project research
SURVEY I created for uni project researchSURVEY I created for uni project research
SURVEY I created for uni project researchCaitlinCummins3
 
An overview of the various scriptures in Hinduism
An overview of the various scriptures in HinduismAn overview of the various scriptures in Hinduism
An overview of the various scriptures in HinduismDabee Kamal
 
Book Review of Run For Your Life Powerpoint
Book Review of Run For Your Life PowerpointBook Review of Run For Your Life Powerpoint
Book Review of Run For Your Life Powerpoint23600690
 
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjjStl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjjMohammed Sikander
 
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...Nguyen Thanh Tu Collection
 
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文中 央社
 
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...EADTU
 
Spellings Wk 4 and Wk 5 for Grade 4 at CAPS
Spellings Wk 4 and Wk 5 for Grade 4 at CAPSSpellings Wk 4 and Wk 5 for Grade 4 at CAPS
Spellings Wk 4 and Wk 5 for Grade 4 at CAPSAnaAcapella
 
How to Manage Website in Odoo 17 Studio App.pptx
How to Manage Website in Odoo 17 Studio App.pptxHow to Manage Website in Odoo 17 Studio App.pptx
How to Manage Website in Odoo 17 Studio App.pptxCeline George
 

Recently uploaded (20)

PSYPACT- Practicing Over State Lines May 2024.pptx
PSYPACT- Practicing Over State Lines May 2024.pptxPSYPACT- Practicing Over State Lines May 2024.pptx
PSYPACT- Practicing Over State Lines May 2024.pptx
 
The Story of Village Palampur Class 9 Free Study Material PDF
The Story of Village Palampur Class 9 Free Study Material PDFThe Story of Village Palampur Class 9 Free Study Material PDF
The Story of Village Palampur Class 9 Free Study Material PDF
 
male presentation...pdf.................
male presentation...pdf.................male presentation...pdf.................
male presentation...pdf.................
 
MOOD STABLIZERS DRUGS.pptx
MOOD     STABLIZERS           DRUGS.pptxMOOD     STABLIZERS           DRUGS.pptx
MOOD STABLIZERS DRUGS.pptx
 
Spring gala 2024 photo slideshow - Celebrating School-Community Partnerships
Spring gala 2024 photo slideshow - Celebrating School-Community PartnershipsSpring gala 2024 photo slideshow - Celebrating School-Community Partnerships
Spring gala 2024 photo slideshow - Celebrating School-Community Partnerships
 
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT TOÁN 2024 - TỪ CÁC TRƯỜNG, TRƯỜNG...
 
When Quality Assurance Meets Innovation in Higher Education - Report launch w...
When Quality Assurance Meets Innovation in Higher Education - Report launch w...When Quality Assurance Meets Innovation in Higher Education - Report launch w...
When Quality Assurance Meets Innovation in Higher Education - Report launch w...
 
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽
會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽會考英聽
 
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfFICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
 
Analyzing and resolving a communication crisis in Dhaka textiles LTD.pptx
Analyzing and resolving a communication crisis in Dhaka textiles LTD.pptxAnalyzing and resolving a communication crisis in Dhaka textiles LTD.pptx
Analyzing and resolving a communication crisis in Dhaka textiles LTD.pptx
 
SURVEY I created for uni project research
SURVEY I created for uni project researchSURVEY I created for uni project research
SURVEY I created for uni project research
 
An overview of the various scriptures in Hinduism
An overview of the various scriptures in HinduismAn overview of the various scriptures in Hinduism
An overview of the various scriptures in Hinduism
 
Book Review of Run For Your Life Powerpoint
Book Review of Run For Your Life PowerpointBook Review of Run For Your Life Powerpoint
Book Review of Run For Your Life Powerpoint
 
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjjStl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjj
 
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
 
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
 
Supporting Newcomer Multilingual Learners
Supporting Newcomer  Multilingual LearnersSupporting Newcomer  Multilingual Learners
Supporting Newcomer Multilingual Learners
 
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
Transparency, Recognition and the role of eSealing - Ildiko Mazar and Koen No...
 
Spellings Wk 4 and Wk 5 for Grade 4 at CAPS
Spellings Wk 4 and Wk 5 for Grade 4 at CAPSSpellings Wk 4 and Wk 5 for Grade 4 at CAPS
Spellings Wk 4 and Wk 5 for Grade 4 at CAPS
 
How to Manage Website in Odoo 17 Studio App.pptx
How to Manage Website in Odoo 17 Studio App.pptxHow to Manage Website in Odoo 17 Studio App.pptx
How to Manage Website in Odoo 17 Studio App.pptx
 

Ten Bright Ideas for Improving Accessibility in Online Courses - Barry Dahl - Oct 2022

  • 1. Barry Dahl Teaching & Learning Advocate, D2L Ten Bright Ideas to Make your Online Courses More Accessible to Students with Disabilities
  • 2. Who am I? • Presenter: Barry Dahl • Teaching & Learning Advocate, D2L • Not an Accessibility Expert, but a dogged learner about all things related to web #a11y • Barry.dahl@D2L.com • @D2LBarry • @barrydahl
  • 3. Ten Bright Ideas for #A11y 1. Improving Alt Text 2. Alt Text No-No’s 3. Complex images 4. Proper list formatting 5. Color blindness simulator 6. Proper link formation 7. Emojis and Emoticons 8. HTML Accessible Templates 9. Brightspace A11y Checker 10. Become a Self-Tester
  • 4. 1. Examine and Improve Alt Text for Simple Images • Class: Intro to Business • Alt text: “The Great Depression.” • Revised: "A long waiting line outside a building offering free coffee and donuts to unemployed people on a cold day during the Great Depression."
  • 5. Example of Simple Image with Surrounding Text
  • 6. 2. Alt Text No-No’s • Don’t repeat things that are already conveyed in plain text on the page • Don’t put info in alt text that isn’t conveyed any other way • Don’t forget good grammar and punctuation • Don’t load it up with keywords • Don’t use phrases such as “photo of” or “Image of” • Don’t write alt text for decorative images (alt="“) • Don’t put in a URL or the image filename • Don’t expect machine-generated Alt Text to be useful • Don’t include details unless they’re relevant • Don’t repeat the same alt text for multiple images
  • 7. Examples of Alt Text No-No’s It’s International Unicorn Day! Fun! (Maybe so, butthis isdecorative) Alttext:Eventhoughsunflowersareself-pollenati researchshowshoneybeeactivitycanimprove cropyields.(Poor:notobviousinformation)
  • 8. 3. Complex Images May Require Complex Alt Text Have you ever used a word cloud in an online course, or an infographic, or a flowchart?
  • 9. What would you do with this one? How do you describe this image of a table, so the low/no vision student is not at a disadvantage?
  • 10. 4. Create Proper Lists in Content Pages What’s wrong with list A? 1. The sky today is grey 2. Koolaid tastes great 3. My hair is curly 4. You should know this What’s wrong with list B? • Plug-in computer • Push power button • Open web browser • Navigate to website
  • 11. 5. Check colors in photos & graphics • If you are using photos where colors are important – check them out first using a color blindness simulator. • Coblis • Search for “Coblis Color Blindness Simulator” • Free and easy
  • 14. 6. Create text links instead of unreadable URLs • https://docs.google.com/spreadsheets/d/15h9tFfqmdsrYUSqEYata1Uir 7EvjlRIQBoOS5StxXd0/edit#gid=0 • Guest Authors Spreadsheet What does screen reading software say when it comes to this? http://brightspace.com/tlc What does screen reading software say when it comes to this? Teaching & Learning Community
  • 15. 7. How about Emojis? • This emoji was inserted using the Brightspace Editor: 😆 • Does it have alt text? • No, not that you'll see in the code. • But what does JAWS have to say? • JAWS will announce the name of the emoji, so the alt text is embedded. • This one says "smiling face with open mouth and tightly closed eyes.“ • Other screen readers may read a description rather than the name.
  • 16. How about Emoticons? • Emoticons are a concoction of symbols and punctuation marks that will be read out loud just like that: a series of symbols and punctuation marks. • Screen reader users might mistakenly take this as grammatical errors or typos in your message. :-) 🙂 O:-) 👼 X3 🐱 ¯_(ツ)_/¯ 🤷
  • 17. NVDA Screen Reader Emoji Example
  • 18. 8. HTML Accessible Templates – by D2L • Create accessible, professional- looking HTML content files with D2L’s free HTML template packages • A11y features are built into the underlying code • You concentrate on adding text, images, and other course resources • Maintains the Responsive Design needed for different size screens
  • 19. Add Templates to Your Course • You can download a Zip file of free templates at the Brightspace Community • Steps to follow: 1. download Zip file to your computer 2. upload into the Manage Files section of your course 3. unzip into a file folder 4. enable for use throughout the course in Content Settings
  • 20. 9. Brightspace A11y Checker Examples of content accessibility checking: • Heading order • Alternative text for images • Color contrast ratios • Proper list structure • Proper link formation • Proper markup of tables
  • 21. A11y Checker is NOT Perfect • Decorative alt text (null alt text) is assumed to wrong – and is identified as no alt text. • Checker cannot actually check for captions in an embedded video.
  • 22. 10. Learn to Test for A11y Issues • Keyboard-only Navigation Interaction Keystrokes Notes Navigate to interactive elements • Tab - navigate forward • Shift + Tab - navigate backward • Keyboard focus indicators must be present. • Navigation order should be logical and intuitive. Link • Enter - activate the link Button • Enter or Spacebar - activate the button • Ensure elements with ARIA role="button" can be activated with both key commands. Checkbox • Spacebar - check/uncheck a checkbox • Users can typically select zero, one, or multiple options from group of checkboxes.
  • 23. Additional Testing Possibilities Use a Screen Reader to learn about that experience. 1. JAWS (Windows-only) • By Freedom Scientific. 40-minute free trail, $95 per year for 3 PCs 2. NVDA (Windows-only) • Free and Open Source, developed by the blind for the blind 3. VoiceOver (Mac-only) • Free, built into macOS 4. Windows Narrator (Built into Windows) • Free, turn on/off with Windows logo + Ctrl + Enter 5. Funkify Chrome Extension • Freemium model, free version includes color blind simulator, Dyslexia, and more
  • 25. Appendix Follows Slides not used for this presentation
  • 26. Ten Bright Ideas for #A11y 1. Decorative Images 2. Improving Alt Text 3. Alt Text for complex images 4. Finding videos w/good captions 5. Proper list formatting 6. Color blindness simulator 7. Proper link formation 8. Emojis and Emoticons 9. HTML Accessible Templates 10. Check out 3rd-Party tools
  • 27. 8. For Office Documents, use Built-in A11Y Checker • Go to the File tab (Windows only) • Select Info from the sidebar menu. • Click on the Check for Issues button. • Select Check Accessibility from the drop-down list. • The accessibility checker only checks .docx and .pptx files
  • 28. 9. Document Accessibility Toolbar (Word) • Vision Australia • Document Accessibility Toolbar (DAT) • Totally free • Installs a new menu/toolbar on the MS Word Ribbon • Windows-only (sorry Mac) • Works with Office 2010
  • 29. All A11y tools on one ribbon menu
  • 30. Makes Adding Alt-Text for Images Easier
  • 31. 1. Use Null Alt Text for Decorative Images • Alt="" • Example code: <img src= “…pixabay-unicorn.png" alt="" … /> • Assistive Technology will ignore an image with null alt text. • Note: Having a null alt text attribute is not the same as having no alt text attribute.
  • 32. Inserting a decorative image - checkbox
  • 33. Inserting a decorative image – code with null alt text
  • 34. Inserting a decorative image in an Announcement
  • 35. 4. Searching for captioned videos on YouTube • Don't be fooled by YouTube's machine captions. YouTube uses voice recognition software to automagically create a video transcript and captions for almost every video uploaded to YouTube. • To find human transcribed captioned videos on YouTube: 1. Enter your search term in the YouTube search field. 2. Add a: , CC (that's a comma, CC) 3. Hit Enter or click the magnifying glass icon.
  • 36. 4. YouTube Search Results
  • 37. 10. Consider the #a11y Features of External Tools • Using external (usually web- based) tools is popular in education. • Is the tool built to allow users with disabilities to create content? • Is the output created by the tool web accessible? • Do you have alternatives or work-arounds in place for students who cannot participate?
  • 38. Two sites for #a11y information on external tools centerononlinelearning.org.res.ku.edu/ vpat www.web2access.org.uk/

Editor's Notes

  1. This slide has intentional builds. This is an actual class example from WAMOE. First click: the class is Intro to Business Second click: the alt text is “The Great Depression” You haven’t seen the image yet. As an unsighted student, what does that alt text bring to mind? What’s your best guess as to the content of the image? Let’s look at the image Third click reveals the image. Let’s assume that this image is informative. If so, do you think the alt text adequately describes it? Hint: the instructor who examined her own work concluded that the alt text was insufficient. Here is her edited alt text. Fourth click: Read the alt text. So, is this an improvement? That question is situational. We actually don’t know what message she was trying to impart to the students, so we’ll take her word for it that this is an improvement. However, there is more to discuss here. Most HTML Content pages in online courses are somewhat like this PPT slide. There are images and there is text and possibly other page elements as well. Think of it this way: Alt text is in the code, so it is available to the screen reading student but it is hidden to the sighted student. I like to say that the alt text is behind the image. Alternatives to alt text? Captions: (machine readable and visible to sighted students) Surrounding text: all important information contained in the image is included in the text on the page. If you do this, what does that make the image? DECORATIVE! Don’t repeat the info in the alt text. Long description: useful approach (beyond our scope today) when the necessary description is too long for the alt text code (approx. 125 characters)
  2. This is a screenshot of a Course Content page inside Brightspace; showing the same Great Depression image embedded with surrounding text that explains what is in the photo. This approach would provide all students with access to the description of the image that the instructor finds important.
  3. Word clouds are popular – for some yet undiagnosed reason. Let’s assume that the actual words in the image are important. These are words that are frequently used in the English language, but they derive from Spanish. Therefore, students need to know the actual words that fit that definition. This image is NOT machine readable. There are too many characters to put all the words in the alt text box. What should you do? One reaction would be to NOT use the image at all. That’s not a recommendation that I can get behind. There is no reason to avoid images as long as you can provide an adequate alternative. Have you ever made one of these word clouds at Wordle or one of the several other word cloud creation sites? To do so, what do you need? You need the list of words. In other words, you are taking a simple text file and turning it into an image with no text. But since you already have the list of words, it should be easy for you to include those words in the learning. Use the image on your Content page. Add any other surrounding text that you need. At the bottom of the page, paste the list of words used in the word cloud. All students benefit from this, regardless of whether they can view the image or not (for example, copy and paste into a study doc, etc.)
  4. Take a look at this chart. There’s a lot going on here. The vertical columns indicate the level of the National Debt (in the U.S.) The black line indicates the statutory debt limit. The color of the columns indicate which political party was in the White House. The President’s names are listed along the bottom, as are the years. That’s a lot of information. How do you describe this image to the unsighted student? Can you do that in the 125 characters of alt text? Probably not. What do you here? You need to provide all of the underlying date (at ;least the data that is relevant to the learning or task). Properly formed data tables are the answer. The U.S. Government tends to do a good job of providing such data.
  5. Take a look at the list on the left, and then the list on the right. Tell me what’s wrong with these lists. The choice between bullets and numbers when making a list is NOT just a cosmetic choice. This choice sends a signal to people using assistive technology. Screen reading software will tell the student when it encounters an unordered list or an ordered list. An unordered list should be used when the order of the listed things makes no difference. An ordered list should be used when the order of list items makes a difference.
  6. Deuteranomaly, a color vision defect in which an altered spectral sensitivity of green retinal receptors, is by far the most common type of color vision deficiency, mildly affecting red–green hue discrimination in 5% of European males. It is hereditary. The green-sensitive cones are still there, but they are malfunctioning. About 1/3 of 1% in females
  7. Deuteranopia is caused by the complete absence of green retinal photoreceptors. It is found in about 1% of the male population and about 1/10 of 1% in females (or less). A deuteranope can only distinguish 2 to 3 different hues, whereas somebody with normal vision sees 7 different hues.
  8. The built-in Accessibility Checkers in Microsoft Word and PowerPoint work very well; and it is possible to create highly accessible documents with each of these tools, IF you know what you’re doing. The Accessibility Checker will not only identify some of the potential problems, it will also provide information on how you can fix those problems.
  9. Word docs can be made highly accessible. However, they will only be accessible if you make them accessible. The DAT makes it quicker and easier to create an accessible Word document by: Providing a centralised location for accessibility functions Automating various parts of accessibility implementation Serving as a checklist for accessibility Serving as a validator for accessibility.
  10. Inspect grouping (for example) Run an accessibility check, as well as find and fix instances of insufficient text colour contrast. Use the inbuilt screen reader, WORDS, to simulate the experience of users who are blind. Create a 'clean-code' HTML version of your document by saving the document or by selecting a portion of the document.
  11. Let’s pop over to Word and take a look
  12. Key points: What makes an image decorative? What makes an image informative? Decorative images need null alt text in the HTML source. Informative images need descriptive alt text to inform the unsighted user of what’s important about the image. When assistive technology (screen reader) comes to a decorative image, it skips right over it. The user won’t even know there is an image there – because they don’t NEED to know. No alt text is the case where the alt tag is missing in the HTML source. The screen reader will tell the student that there is an image, but there is no other information about the image. This is the worst case scenario and is to be avoided.
  13. When inserting an image in the HTML editor, you are given two choices – ONLY PICK ONE! If the image is informative, then enter a description in the Alternative Text dialog box. If the image is decorative, check the box. If you check the box, D2L puts the proper NULL alt text into the code.
  14. This is an example. The top code includes an image with alt text. The bottom code includes an image with Null Alt Text.
  15. This is the same example, with two images.
  16. This is a simple way to find videos on You Tube that have good captions. A few years ago, YouTube started applying automatic captions to all uploaded videos that include words in the audio. These automatic captions are sometimes very useful, and other times they can be quite terrible. Some people take the time to edit the automatic captions or to upload a file of captions that they created. There is a filter in YouTube that will look only for videos where the captions have been “touched,” which means that the captions have been edited. Still a good idea to check the captions for quality, but at least you have a better chance of finding a video that has good captions. Recommendation: always check the captions before using a video in your class.
  17. The first image indicates 73,600 search results for the search term “debits and credits” in YouTube. The second image shows the same search filtered by the closed caption requirement. Now there are 1,950 search results to choose from.
  18. Do you love Prezi? Do you know that it has major accessibility problems? Do you use Twitter in class? Do you know how to work-around the accessibility issues that your students might encounter with it? Hint: Twitter is far more accessible than Prezi is. If you use external tools in your teaching, or if you require students to use some of these tools – please check to see how accessible these tools are to students with vision, auditory, and/or mobility disabilities.
  19. These two websites give good reviews of the accessibility of many commonly-used web-based tools. You’ll be able to do some research on some of your favorite tools – including whether there accessibility issues when using the tools to create content – and also whether the created content has accessibility issues.