$30 off During Our Annual Pro Sale. View Details »
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Leave No One Behind
Search
Stephen Thomas
October 22, 2016
Technology
0
120
Leave No One Behind
Building Accessible Web Applications
Stephen Thomas
October 22, 2016
Tweet
Share
More Decks by Stephen Thomas
See All by Stephen Thomas
Sepsis
sathomas
0
97
Introducing D3.js
sathomas
0
2.5k
Building JavaScript Visualizations Part 1
sathomas
1
2.7k
Building JavaScript Visualizations Part 2
sathomas
0
2.6k
Unit Testing JavaScript Applications
sathomas
5
2.9k
Securing JavaScript Web Applications
sathomas
4
390
Web-Based Visualizations with D3.js
sathomas
8
820
Custom Domains with Github Pages
sathomas
2
310
Other Decks in Technology
See All in Technology
Modern Data Stack大好きマンが語るSnowflakeの魅力
sagara
0
270
シンプルを極める。アンチパターンなDB設計の本質
facilo_inc
1
1k
履歴テーブル、今回はこう作りました 〜 Delegated Types編 〜 / How We Built Our History Table This Time — With Delegated Types
moznion
15
9.3k
セキュリティAIエージェントの現在と未来 / PSS #2 Takumi Session
flatt_security
3
1.4k
Oracle Cloud Infrastructure:2025年11月度サービス・アップデート
oracle4engineer
PRO
1
110
Noを伝える技術2025: 爆速合意形成のためのNICOフレームワーク速習 #pmconf2025
aki_iinuma
2
920
Master Dataグループ紹介資料
sansan33
PRO
1
4k
あなたの知らないDateのひみつ / The Secret of "Date" You Haven't known #tqrk16
expajp
0
110
Flutter Thread Merge - Flutter Tokyo #11
itsmedreamwalker
1
140
Digitization部 紹介資料
sansan33
PRO
1
6.1k
freeeにおけるファンクションを超えた一気通貫でのAI活用
jaxx2104
3
580
手動から自動へ、そしてその先へ
moritamasami
0
120
Featured
See All Featured
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.1k
Build The Right Thing And Hit Your Dates
maggiecrowley
38
3k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
22k
Faster Mobile Websites
deanohume
310
31k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
It's Worth the Effort
3n
187
29k
Building Adaptive Systems
keathley
44
2.9k
A Tale of Four Properties
chriscoyier
162
23k
Music & Morning Musume
bryan
46
7k
Reflections from 52 weeks, 52 projects
jeffersonlam
355
21k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Transcript
Leave No One Behind Building Accessible Web Applications
Why? • More Users • The Law • It’s the
Right Thing to Do
Who? • Users with cognitive impairments • Users with hearing
impairments • Users with visual impairments • Seizures • Color Blindness • Presbyopia • Users with motor impairments
Let’s Look at Some Code
Leave No One Behind • Users with Cognitive Impairments •
Check Reading Level for Content • Don’t Build Complicated Interfaces
Leave No One Behind • Users with Hearing Impairments •
Add visual cues to critical audio notifications • Add close caption tracks to <video> elements
Leave No One Behind • Users with Visual Impairments •
Give Users a way to Disable Animations • Don’t Rely Solely on Color • Watch Contrast Ratio • Responsive Design • Use HTML5 Elements for Page Layout • Correct Use of Buttons and Links
Leave No One Behind • Users with Motor Impairments •
Support Focus Styling • Manage Focus • Dynamically set TabIndex attributes, or • Capture keydown events
Some Key Resources • Checklist • http://webaim.org/standards/wcag/checklist • Tools •
http://khan.github.io/tota11y/ • http://howlowck.github.io/Akbar/ • Learn More • https://www.udacity.com/course/web-accessibility--ud891