3. Statistics – U.S.
20% of US
27 Million pop have
Disabled reading
difficulties
5 Million
Disabled
employed
3
4. Financial Impact
US disabled spend
$1 trillion each year
$200B of that is
discretionary spending
CC Image courtesy of 401K 2012 on Flickr
4
5. 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
CC Image courtesy of avyfain on Flickr
5
6. 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
CC Image courtesy of verseguru on Flickr
6
7. CC Image courtesy of Rolling F-Stop on Flickr
How persons with disabilities access
the web 7
8. Types of Disabilities
Visual – Vision Loss, Blindness, Color-
Blindness
Hearing – Diminished or partial hearing,
Deafness
Mobility – Muscle fatigue/weakness, fine
motor control, paralysis
Cognitive – Dyslexia, Autism, ADD/ADHD
8
9. Assistive Technologies Used
• No Vision/Blindness:
– Typically use a screen reader
– May use a refreshable Braille display
9
10. 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
11. 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
12. Assistive Technologies Used
• Cognitive
– May use voice
recognition or
screen reading
software
– May use custom
CSS to control web
page presentation
12
15. 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
17. Main Web Accessibility Standards
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
17
*Web Content Accessibility Guidelines (WCAG)
18. Standards - WCAG 2.0, Level AA*
Content must be:
• Perceivable – Content is
made available to the senses
– sight, hearing and/or touch.
• 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/
19. from the WebAim flyer
• Plan Heading Structure • Design Link Focus
Early Indicators
• Consider Reading Order • Design a "Skip to Main
Content" Link
• Provide Good Contrast
• Ensure Link Text Makes
• Use True Text Whenever
Sense on Its Own
Possible
• Use Animation, Video, and
• Use Adequate Font Size
Audio Carefully
• Remember Line Length
• Don't Rely on Color Alone
• Make Sure Links are
• Design Accessible Form
Recognizable
Controls
19
25. Design & Development Techniques
• Web Accessibility Initiative
(WAI)*
• WebAim – resources and e-
mail discussion list**
• The Paciello Group’s
Resources***
• Simply Accessible****
• Deque*****
* http://www.w3.org/WAI/
** http://webaim.org
*** http://www.paciellogroup.com
**** http://simplyaccessible.com 25
***** http://deque.com
26. Go forth and prosper!
Feel free to reach out for further discussion:
november.samnee@gmail.com
@novie
26
Notas do Editor
Even if you think you have a product that disabled people won’t buy – (example of hunting equipment used by Texas DARS employee) – it is much easier for them to shop for gifts online than it is in stores
Lost business — (federal agencies and those receiving federal funding) are required to purchase the most accessible product that meets their needs Lawsuits - Target class action settles for $6 million, not to mention costs of retrofitting their site Structured settlements from Lainey Feingold in a number of industries (also working for tactile POS in many retail environments so blind people do not have to disclose their PIN, including getting them for Target & Best Buy) - MLB -- Charles Schwab -- American Cancer Society -- Staples -- CVS -- Rite Aid -- Credit reports by the credit agencies -- RadioShack -- LaSalle Bank -- First Union --many more Federal Agency investigations - In US, Department of Justice, civil rights division says the internet is included in the ADA, and are investigating complaints of inaccessible companies. NY has sued Orbitz, other travel websites. Cities and corporations included, e.g., Wells Fargo Curb cut, power door example
Design with Accessibility in Mind Accessibility experts estimate that the cost of developing sites that meet WCAG 2.0 AA increases development costs by the following: 1% to 3% on simple sites built with html and css (and little to no javascript) 3% to 6% on intermediate sites built with html, css and an intermediate level of javascript 6% to 10% on heavy javascript sites or flash sites Compare these costs to the retrofitting costs which consistently come in as 2 to 3 times more. http://www.glendathegood.com/blog/?cat=4 Retrofitting is not only expensive, but very painful!
Disabilities that could affect computer use: - Mobility impairments – these can be temporary, like repetitive stress Muscle fatigue and weakness Poor fine motor control (Multiple Sclerosis, Arthritis, muscle fatigue, muscle weakness, tremor, broken bones) Paralysis or partial paralysis Amputation or missing limbs - Cognitive Disabilities – many of these people wouldn’t consider themselves disabled, like Justin, but does affect his work Dyslexia ADD/ADHD
For No Vision/Blindness , customers typically use a screen reader In most common use: JAWS (Job Access With Speech) WindowEyes VoiceOver (for Apple products) NVDA (Non-Visual Desktop Access) Some customers may use a refreshable Braille display along with (or independent of) a screen reader so that they can quietly read. These users may get the most focus for accessibility efforts (for many reasons) but they are not the only ones to accommodate.
For low vision or partial vision loss , customers may use screen magnifiers (video example). Most computers come with free screen magnification and allow for zooming in the internet browser, but many of our customers also use: ZoomText WinZoom MAGic Use these with or without narration
Those with mobility impairments may use voice recognition software (video example), alone or along with different keyboards or mice, to interact with the web. The most prevalent voice recognition software used is Dragon Naturally Speaking .
The Rules: Each individual must be the tester for at least one station (can repeat stations if we have time) You must use the simulated limitations (although, if you are not a touch-typist, you can look at the keyboard) The tester will think aloud or summarize his/her experience for their small group Dragon station: http://www.youtube.com/watch?v=plPsmjA4Y7s&feature=plcp Ask the Dictator: Episode 59
WCAG 1.0 (May 1999 – Dec 11, 2008) WCAG 2.0 (Completely replaced WCAG 1.0; adopted Dec 11, 2008.) “ Section §508” in the US – will map to WCAG 2.0 soon Especially for sites not subject to a VPAT, industry widely recommends WCAG2.0. Target follows this.
Why WCAG 2.0? Section §508” in the US – will map to WCAG 2.0 AA soon Especially for sites not subject to a VPAT, industry widely recommends WCAG2.0. Settlements follow this. Rewrite of WCAG tried to make it more friendly and approachable language and documentation, but can still feel vague and in actionable Real value of these guidelines (I’m going to breeze through them) is that they map to resources I’ll be discussing a bit later. Image courtesy of sitepoint http://www.sitepoint.com/australian-government-wcag-2-accessibility/
Now that we’ve discussed what we need to do, we’re now going to discuss what tools can help you get this done
Assistive Technologies: NVDA – this is an open-source screen reader for Windows (used by customers who are blind or have low vision). It is very standards compliant, and if something works well in NVDA, we would typically consider it accessible for screen reader users. Download NVDA at http://www.nvda-project.org/wiki/Download . - light, doesn’t bog down system, British accent, developers don’t need JAWS Windows High Contrast mode – these modes can be activated in Windows 7 (they are available for other versions of Windows) by navigating to Control Panel > Ease of Access Center . Every page should be checked with this mode on to be sure that all content is available. Images that are links should appear, but any images that are purely decoration will not. Apple’s accessibility features for all their products are linked to from http://www.apple.com/accessibility/ Development & Testing Tools: WAVE Firefox Toolbar – this tool is used to check the code on webpages for compliance with WCAG 2.0 level AA and is created/maintained by WebAIM, a respected accessibility group. You can also use the evaluation tool by submitting a page to the WAVE servers, but the toolbar is necessary for pre-production code. Download WAVE at http://wave.webaim.org/toolbar . Color Contrast Analyzer – this tool is used to check foreground and background color combinations for contrast and is created/maintined by The Paciello Group, another respected accessibility consultancy. High contrast is necessary for customers with low vision and color-blindness. Download Contrast Analyser at http://www.paciellogroup.com/resources/contrast-analyser.html . MAGpie – this software is a caption and audio-description authoring tool to make videos accessible and is created/maintained by the National Center for Accessible Media. Other free and paid captioning tools are available, but this one seems the easiest to use. Download MAGpie at http://ncam.wgbh.org/invent_build/web_multimedia/tools-guidelines/download-magpie .
WCAG 2.0 Success Criteria – code samples, options & techniques, mapped to the guidelines WAI’s “How to Meet WCAG 2.0” – select the coding techniques you’re using, Level A & AA and get a customized list of techniques to use