2
Disability and Inclusive Design - Web
Presented by Travis Lee & Sal Santa Ana
Intro
What Will We Learn?
Intro
What is the UCLA DCP
Learning Objectives
Learning Objectives
By the end of this training you should be able to:
1. Explain why accessibility is important
2. Describe what “accessibility” is
3. Describe what a screen reader is and how it works
4. Define the laws around accessibility
5. Use tab testing your website
6. Add Alt Text to images in html
7. Proper header structure in html
8. Using descriptive links in html
9. Download the Wave extension
Who We Are
Introduce yourself
Elementry School
Why
Accessibility Matters
The "Why" of Accessibility
An Example
Example
A Question
The
Reality
19% Employment
50% College Drop Out
Poverty 29%
Depression
2 to 10 X more
Incarceration
4 X more
Disabilities Today
Disability Numbers
13 million Internet users in America are using assistive devices
There are over 56.7 million Americans living with a disability (1 in 5)
Numbers
1/3 of people with a disability use assistive technology
16% of UCLA students have declared a disability
UCLA
What is Accessibility?
The "What" of
Accessibility
Accessibility Simplified
1.
2.
End-User
&
Developer
Institutional Accessibility Maturity Model
- Accommodations mode - UCLA’s current mode
- Accessible mode - Compliance
- Inclusive mode - Universal Design and Universal Design for Learning (UDL)
- Personalized preferences - Adaptive Tech and Learning
Accessibility
Maturity
Laws
&
Guidance
Laws
&
Guidance
Americans with Disabilities Act of 1990
ADA
Rehabilitation Act of 1973
508 & 504
Web Content Accessibility Guidelines (WCAG)
P
O
U
R
- Perceivable (alt text, alternatives to time sessions, contrast)
- Operable (keyboard only nav)
- Understandable (screen reader, OCR, operate in predictable ways)
- Robust
WCAG 2.1
Examples
Emerging Assistive Technology
Bionics
Bionics
Smart Glasses
Smart Glasses
Talking Hands
Demonstration
Demonstration
& Trying Tools
Screen Readers
Screen Reader
1. Tab testing your website
2. Adding Alt Text to images
3. Proper header structure
4. Use descriptive links in html
5. Using the Wave extension
Designing an Accessible
website
Conclusion
&
Thank You
Conclusion
Learning Objectives
Learning Objectives
You should be able to:
1. Explain why accessibility is important
2. Describe what “accessibility” is
3. Describe what a screen reader is and how it works
4. Define the laws around accessibility
5. Use tab testing your website
2. Add Alt Text to images in html
3. Proper header structure in html
4. Using descriptive links in html
6. Create free captions using Youtube