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
100
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
400
Web-Based Visualizations with D3.js
sathomas
8
830
Custom Domains with Github Pages
sathomas
2
310
Other Decks in Technology
See All in Technology
プロポーザルに込める段取り八分
shoheimitani
1
230
ZOZOにおけるAI活用の現在 ~開発組織全体での取り組みと試行錯誤~
zozotech
PRO
5
5.3k
Webhook best practices for rock solid and resilient deployments
glaforge
1
290
10Xにおける品質保証活動の全体像と改善 #no_more_wait_for_test
nihonbuson
PRO
2
240
AI駆動PjMの理想像 と現在地 -実践例を添えて-
masahiro_okamura
1
110
Contract One Engineering Unit 紹介資料
sansan33
PRO
0
13k
名刺メーカーDevグループ 紹介資料
sansan33
PRO
0
1k
SREチームをどう作り、どう育てるか ― Findy横断SREのマネジメント
rvirus0817
0
230
~Everything as Codeを諦めない~ 後からCDK
mu7889yoon
3
340
SREが向き合う大規模リアーキテクチャ 〜信頼性とアジリティの両立〜
zepprix
0
440
CDK対応したAWS DevOps Agentを試そう_20260201
masakiokuda
1
260
Introduction to Sansan, inc / Sansan Global Development Center, Inc.
sansan33
PRO
0
3k
Featured
See All Featured
Fireside Chat
paigeccino
41
3.8k
Scaling GitHub
holman
464
140k
Design in an AI World
tapps
0
140
Optimizing for Happiness
mojombo
379
71k
Statistics for Hackers
jakevdp
799
230k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Google's AI Overviews - The New Search
badams
0
900
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
310
Making Projects Easy
brettharned
120
6.6k
Writing Fast Ruby
sferik
630
62k
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
170
Site-Speed That Sticks
csswizardry
13
1.1k
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