hands on (& eyes & ears) accessibility workshop
TRANSCRIPT
Hands-On (& Eyes & Ears) Accessibility
November M. SamneeManager, New Product DevelopmentThomson Reuters
July 12, 2012
Why Should We Care?2
CC Image courtesy of eszter on Flickr
Statistics – U.S.
20% of US pop have reading
difficulties
27 Million Disabled
5 MillionDisabled employed
3
Financial Impact
4
US disabled spend $1 trillion each year
$200B of that is discretionary spending
CC Image courtesy of 401K 2012 on Flickr
Risks & Opportunities
• Risks:– Inability to sell to federal/state
agencies, academic markets
– Lawsuits
– Bad PR
• Opportunities– Ethical obligation to be inclusive
– Enhancements for disabled often enhance experience for everyone
5
CC Image courtesy of avyfain on Flickr
Retrofit vs. Accessibility From the Start
• Retrofitting for the web can be more expensive– Accessibility in the beginning increases development
costs by no more than 10%
– Retrofitting accessibility may cost 2 to 3 times more
6CC Image courtesy of verseguru on Flickr
How persons with disabilities access the web
7
CC Image courtesy of Rolling F-Stop on Flickr
Types of DisabilitiesVisual – Vision Loss, Blindness, Color-
Blindness
Hearing – Diminished or partial hearing, Deafness
Mobility – Muscle fatigue/weakness, fine motor control, paralysis
Cognitive – Dyslexia, Autism, ADD/ADHD8
Assistive Technologies Used• No Vision/Blindness:
– Typically use a screen reader
– May use a refreshable Braille display
9
Assistive Technologies Used• Low vision or partial
vision loss: – Screen Magnifiers
(commercial or come with the OS)
– High-contrast mode
– May use a high-contrast keyboard
10
Assistive Technologies Used
• Mobility impairments– May use voice
recognition software
– May use different keyboards or mice
• Hearing impairments or Deafness:– Need captioned
videos and may prefer contact via email or chat
11
Assistive Technologies Used
• Cognitive– May use voice
recognition or screen reading software
– May use custom CSS to control web page presentation
12
13
Hands-On Time!
The Task: Search the Commerce Bank website for “CD rates”.
14
CC
Ima
ge
cou
rtesy o
f L.e
.e o
n F
lickr
Issues We Found
Issues we saw today
• Consider Reading Order
• Use True Text Whenever Possible
• Design Accessible Form Controls
• Design a “Skip to Main Content” Link (maybe)
15
Standards & Guidelines
16
CC Image courtesy of P1r on Flickr
Main Web Accessibility Standards
17
*Web Content Accessibility Guidelines (WCAG)
Internet access is a human right.
How do we implement accessibility?
WCAG* 2.0-Model Accessibility Guideline from the World Wide Web Consortium (W3C). Current version; replaces WCAG 1.0. WCAG* 1.0 – mostly extinct.
Sec 508-USA-specific law. Currently undergoing review to update.-Federal agencies require a VPAT as part of RFP process
Standards - WCAG 2.0, Level AA*
Content must be:1.Perceivable – Content is made available to the senses
– sight, hearing and/or touch.2.Operable – Interface forms, controls and navigation are operable.
3. Understandable – Content and interface are understandable.
4. Robust – Content can be used reliably by a wide variety of user agents, including assistive technologies.
18
* http://www.w3.org/TR/WCAG/
from the WebAim flyer
• Plan Heading Structure Early
• Consider Reading Order
• Provide Good Contrast
• Use True Text Whenever Possible
• Use Adequate Font Size
• Remember Line Length
• Make Sure Links are Recognizable
19
• Design Link Focus Indicators
• Design a "Skip to Main Content" Link
• Ensure Link Text Makes Sense on Its Own
• Use Animation, Video, and Audio Carefully
• Don't Rely on Color Alone
• Design Accessible Form Controls
Resources
20
CC Image courtesy of zzpza on Flickr
Tools
• Free Assistive Technologies – Windows:
• NVDA
• Windows Magnifier & High Contrast mode
– Apple• VoiceOver
• Zoom & High Contrast
– Unplug your mouse!
• Free Development & Testing Tools– WAVE Firefox toolbar
– Color Contrast Analyzer & other
Firefox plug-ins
– Magpie
21
22
23
24
Design & Development Techniques
• Web Accessibility Initiative (WAI)*
• WebAim – resources and e-mail discussion list**
• The Paciello Group’s Resources***
• Simply Accessible****
• Deque*****
25
* http://www.w3.org/WAI/** http://webaim.org*** http://www.paciellogroup.com**** http://simplyaccessible.com***** http://deque.com