Embed Size (px)
DESCRIPTION
How do you know if your web site is accessible? Can automated testing tools help? How do you create and manage a culture of accessibility on a large university campus with a shrinking budget? Glenda will share gems from her 10+ years of experience testing sites for accessibility. Equip yourself with free and powerful testing tools. Learn how to turn it up a notch when you need to monitor accessibility across a vast enterprise. See some of the very latest testing tools that will help you evaluate color contrast, dynamic content and WAI-ARIA compliance. Glenda Sims is currently a senior accessibility consultant at Deque. She spent over a decade as the accessibility expert and web standards evangelist at the University of Texas at Austin.KeypointsNew free and powerful accessibility testing tools.The power of enterprise level accessibility tools in action.Importance of integrating accessibility testing into the software development life cycle.
Citation preview
Practical Accessibility Testing
Your Chance to
Open the Web
Glenda the Goodwitch
webstandards.orgknowbility.orgdeque.com
Open WebFor
Everyone
to connect communicate
share & build knowledge opportunity to reach our full potential
The Open Web is for
Everyone and on Everything
Not just for star bellied sneetches
with iphones
Open Web = Accessible Web
When all users regardless of disability
can obtain the same information and perform the same functions
Do you recognize this man?
• He is a world class runner.
Do you recognize him now?
• His name is Oscar Pistorius• He is also known as the “Blade Runner” and
the “fastest man on no legs”
Oscar Pistorius
• Blade Runner• Fastest man on no
legs• Ruled Ineligible for
Bejing Olympics
His prosthetics make himmore than able-bodied
AccSEXYbility
Practical Accessibility Testing
How Open Are You?
Ensuring Accessibility
• Testing Tools• User Testing• Open Web Design Process
Open Web Ecosystem
Build with valid code http://validator.w3.org/unicorn/
Accessibility Testing Tools
• Accessibility/Web Standards Validators
• Listening with screenreaders• Testing with keyboard / no speakers
• Authoring Tool accessibility features
• Enterprise Accessibility Reports
Accessibility Validators - Page by Page
– CSS/HTML Validators– The Wave– Web Developer for Firefox– Accessibility Toolbar for IE– Luminosity Contrast Ratio
Analyser– FireEyes
Accessibility Tools can only automatically test approximately 27% of the issues.
Accessibility Testing Requires the Human Brain
Testing a Site
www.utsports.com orwww.texassports.com
– HTML/CSS Validator • http://validator.w3.org/unicorn/
– Wave• http://wave.webaim.org/
– Web Developer (Firefox Extension)• https://addons.mozilla.org/en-US/firefox/addon/60
– Luminosity Contrast Ratio Analyser• https://addons.mozilla.org/en-US/firefox/
addon/juicy-studio-accessibility-too/?src=search
– Headings Map• http://addons.mozilla.org/en-us/firefox/addon/
headingsmap/
UT Longhorns Home Page
Unicorn – HTML Validator
• Go to http://validator.w3.org/unicorn/ • Type in URL• Press “Check” button
HTML Validator – 454 Errors!
WAVE
• Go to http://wave.webaim.org/• Type in URL to test• Press “WAVE this page” button
WAVE - 77 Accessibility Errors!
Web Developer Toolbar• Install Web Developer Toolbar in Firefox• Open Firefox and Select “Replace Images with ALT Attributes”
Check UT Longhorn Home Page with Images Replaced by ALT
Color Contrast
• Install Juicy Studios Accessibility Toolbar in FireFox https://addons.mozilla.org/en-US/firefox/addon/juicy-studio-accessibility-too/?src=search
• Select “Lumunosity Contrast Ratio” from Toolbar
Color Contrast Issues
Headings Map
• Install Heading Map plugin in Firefox http://addons.mozilla.org/en-us/firefox/addon/headingsmap
• Select “Headings Map” from the Tools menu
Heading Issues
Testing a Site
www.utsports.com orwww.texassports.com
www.deque.com/products/deque-labs/worldspace-fireeyes
Demo of FireEyes Accessibility Testing Tool
Using FireEyes to Test for Color Contrast
FireEyes Color Contrast Results
Listen
Real test: Can users with disabilities actually use your site?
Test representative pages with a screenreader
• JAWS screenreader www.freedomscientific.com
• Fangs screenreader emulator standards-schmandards.com/projects/fangs
Keyboard AloneTest representative pages with a keyboard alone.
• Mouse requires mobility & vision
• Keyboard Access allows assistive technology access
No SpeakersTest multimedia pages with no speakers
Enterprise Tools• Define URL & Spider Profile• Select Testing Criteria• Reports of Progress Over Time
Enterprise Accessibility Testing Tool
• Worldspace by Deque
Importance of User Testing
User Testing
Just Ask: Integrating Accessibility
Throughout DesignBy Shawn Lawton Henry
www.uiaccess.com/justask/
Accessibility is a subset of Usability Testing.
A Practical Testing Plan1. Code Validation2. Browser Testing
– turn off images– don’t use the mouse– turn off speakers
3. Online Accessibility Testing (representative pages)– use more than one tool, example: Wave &
FireEyes4. Screenreader Testing
– JAWS5. Enterprise Accessibility Report
– like Worldspace6. Hands-on Accessibility Testing
40
Web development process
41
Accessible web development
1. Plan Assess site,
people, process Benchmark
industry Review design and
coding standards Develop roadmap
2. Equip Adopt development and
test tools Integrate with IDE, WCM
and Testi ng tools
6. Sustain Conti nuous monitoring Vendor verifi cati on New employee training
3. Empower Role-specifi c training
4. Test Distributed unit tests Centralized, automated
tests Expert usability evaluati on
with assisti ve technology5. Remediate Prioriti ze Fix Retest
Create an Accessibility Plan1. Gather Baseline Information
2. Gain Top Level Support
3. Organize Web Accessibility Group
4. Define a Standard
5. Create an Implementation Plan
6. Provide Training and Technical Support
7. Monitor Conformance
8. Remain Flexible Through Changes
WebAim8 Step Implementation Modelwww.webaim.org/articles/implementation
42
Implementation Strategy - Prioritize
• Top 10% of pages based on use• Critical Pages (required for your business
purpose)• Audience
Public
Members
Employees
Geeks
43
Implementation StrategiesAccessible (immediately, no excuses)• All new or revised pages• Top 10% pages (based on analytics)• Critical pages• Accessibility pages
Accessible by (date)• Legacy Web Pages *
* encourages archive of old / outdated pages!
44
Good Design is Accesible design
It is up to YOU!
For most people technology makes things easier. For people with disabilities,
technology makes things possible.
President’s Council on Disabilities
