Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
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
96
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
FinOps について (ちょっと) 本気出して考えてみた
skmkzyk
0
210
What's new in OpenShift 4.20
redhatlivestreaming
0
110
名刺メーカーDevグループ 紹介資料
sansan33
PRO
0
940
ヘンリー会社紹介資料(エンジニア向け) / company deck for engineer
henryofficial
0
330
それでも私が品質保証プロセスを作り続ける理由 #テストラジオ / Why I still continue to create QA process
pineapplecandy
0
170
Linux カーネルが支えるコンテナの仕組み / LF Japan Community Days 2025 Osaka
tenforward
1
120
AI-Readyを目指した非構造化データのメダリオンアーキテクチャ
r_miura
1
290
会社を支える Pythonという言語戦略 ~なぜPythonを主要言語にしているのか?~
curekoshimizu
3
610
知覚とデザイン
rinchoku
1
330
[2025年10月版] Databricks Data + AI Boot Camp
databricksjapan
1
250
「最速」で Gemini CLI を使いこなそう! 〜Cloud Shell/Cloud Run の活用〜 / The Fastest Way to Master the Gemini CLI — with Cloud Shell and Cloud Run
aoto
PRO
1
170
CNCFの視点で捉えるPlatform Engineering - 最新動向と展望 / Platform Engineering from the CNCF Perspective
hhiroshell
0
140
Featured
See All Featured
How STYLIGHT went responsive
nonsquared
100
5.8k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
127
54k
How to train your dragon (web standard)
notwaldorf
97
6.3k
Being A Developer After 40
akosma
91
590k
Product Roadmaps are Hard
iamctodd
PRO
55
11k
Become a Pro
speakerdeck
PRO
29
5.6k
BBQ
matthewcrist
89
9.8k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.5k
Six Lessons from altMBA
skipperchong
29
4k
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