SlideShare a Scribd company logo
1 of 25
Accessibility testing
for everyone
Techniques for all business sizes
Claudio Luis Vera
Accessibility Expert at Royal Caribbean Cruises, Ltd.
Hats that I’ve worn
I work as a accessibility
professional after a
25-year career in UX
design and
development.
Front-
end
developer
Creative
Director
UX
Designer
Aging
human
Management
Certified A11y
professional
Caregiver
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
Which of these
personas is the one to
design for?
The independent one.
WCAG 2.1:
The de facto standard for
web accessibility, made up of a set
of hundreds of guidelines.
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
WCAG levels
A
Obsolescent standard
that doesn’t meet legal
requirements
AA
Nearly-universal standard
AAA
Advanced requirement
where near-perfect
accessibility is imperative
What’s a screen
reader?
Screen readers are software programs
that allow blind or visually impaired
users to read the text that is displayed
on the computer screen with a speech
synthesizer or braille display.
-American Federation for the Blind
NVDA
JAWS
Mac
Voiceover
8C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
main
Skipto
main
Skipto
main
main
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
Top accessibility mistakes
● Missing alt tags or alt text
● Missing form field labels
● Insufficient color contrast
● Broken tab index
● Hidden focus
● Using styles instead of headings
● Using buttons where links should go
● Missing “Skip navigation” link
● Social toolbars that don’t skip links
Design
Reviews
1
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
Contrast ratios
3 : 1
Requirement for
WCAG AA 2.x for
large-scale text
(over 18 pt)
4.5 : 1
Requirement for
WCAG AA 2.x for
text (14 -18 pt)
7 : 1
Requirement for
WCAG AAA for any
size text
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
Sample of a color palette built around color contrast.
An accessible color palette
2
Test-as-you-go
• WAVE and other
browser plugins
• aXe code
inspector
• Google Developer
Tools
Demo time!
DIY Testing
techniques
3
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
DIY Testing techniques
● Unplug your mouse and cover your
trackpad
● Tab through your menus, forms
● Can you access every menu and
control?
● Can you operate every menu and
control?
● Can you see where the focus is at all
times?
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
DIY Testing techniques
● Magnify the page to 200%
(this is required for WCAG AA)
● Magnify the page to 500%
Can you read all the text:
● Are there overlaps?
● Hidden text areas?
● Collisions?
Do you have to scroll horizontally?
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
Other DIY Techniques
Using WAVE:
● Turn off images
● Turn off CSS
Turn on high-contrast mode
Also, be sure to:
● Click on field labels
● Check for captions and transcripts
Automated
testing
(SaaS)
4
Tenon.io – starting at $82 / month for 3,000 API calls
Siteimprove – starting at 250 pages for $3,000/year
Siteimprove – starting at 250 pages for $3,000/year
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
Testing vendors
Small- and medium-sized businesses
Tenon.io
Siteimprove
AudioEye
Enterprise
Level Access
Deque Systems
Siteimprove
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
How to get more involved
Get trained
Courses are available through Deque U.
Get certified
Core (CPACC), technical (WAS) and
combined (CPWA) certification
DHS Trusted Tester Program
Join
Web Accessibility Group at UGA
IAAP
Accessibility groups in various open
source projects (Wordpress, Drupal)
web-a11y Slack channel
Great Lakes ADA / a11y-chi
C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
Resources
WAVE accessibility tester (Chrome/Firefox)
axe accessibility tester (Chrome dev tools)
Contrast checker from the Mac App Store
Google Developer tools
IAAP (International Association of
Accessibility Professionals)
Deque University (accessibility courses)
UGA Web Accessibility Group (WAG)
Accessibility testing on a $7 budget,
post on Medium

More Related Content

Similar to Accessibility testing for everyone

Accessibility in Low-Code: Applications with no Limits
Accessibility in Low-Code: Applications with no LimitsAccessibility in Low-Code: Applications with no Limits
Accessibility in Low-Code: Applications with no LimitsOutSystems
 
Accessibility: Proven, easy integration into design and development workflows
Accessibility: Proven, easy integration into design and development workflowsAccessibility: Proven, easy integration into design and development workflows
Accessibility: Proven, easy integration into design and development workflowsRobert Jolly
 
User Testing for Accessibility
User Testing for AccessibilityUser Testing for Accessibility
User Testing for AccessibilityUsability Matters
 
How to create accessible websites - WordCamp New York
How to create accessible websites - WordCamp New YorkHow to create accessible websites - WordCamp New York
How to create accessible websites - WordCamp New YorkRachel Cherry
 
One Web To Rule Them All
One Web To Rule Them AllOne Web To Rule Them All
One Web To Rule Them AllDen Odell
 
A Primer on Web Accessibility for Teams
A Primer on Web Accessibility for TeamsA Primer on Web Accessibility for Teams
A Primer on Web Accessibility for TeamsMikey Ilagan
 
Practical DevOps & Continuous Delivery – A Webinar to learn in depth on DevO...
Practical DevOps & Continuous Delivery –  A Webinar to learn in depth on DevO...Practical DevOps & Continuous Delivery –  A Webinar to learn in depth on DevO...
Practical DevOps & Continuous Delivery – A Webinar to learn in depth on DevO...Hugo Messer
 
Advanced Codeless Testing for Web Apps
Advanced Codeless Testing for Web AppsAdvanced Codeless Testing for Web Apps
Advanced Codeless Testing for Web AppsPerfecto by Perforce
 
Quality and the "Secret Mission:" From End-Stage Tester to Skilled Analyst
Quality and the "Secret Mission:" From End-Stage Tester to Skilled AnalystQuality and the "Secret Mission:" From End-Stage Tester to Skilled Analyst
Quality and the "Secret Mission:" From End-Stage Tester to Skilled AnalystDevorah Firestone
 
Accessibility for Content Developer, Designer, Code Developer and Tester
Accessibility for Content Developer, Designer, Code Developer and TesterAccessibility for Content Developer, Designer, Code Developer and Tester
Accessibility for Content Developer, Designer, Code Developer and TesterJatin Kochhar
 
Kaiser Permanente CSUN 2018
Kaiser Permanente CSUN 2018Kaiser Permanente CSUN 2018
Kaiser Permanente CSUN 2018Mark Stimson
 
The Impact of Accessibility
The Impact of AccessibilityThe Impact of Accessibility
The Impact of AccessibilityJosh Amer
 
Accessibility testing-Gyani and Siddhanth
Accessibility testing-Gyani and SiddhanthAccessibility testing-Gyani and Siddhanth
Accessibility testing-Gyani and Siddhanthbhumika2108
 
Nascenia: Road to Software Industry
Nascenia: Road to Software IndustryNascenia: Road to Software Industry
Nascenia: Road to Software IndustryNascenia IT
 
ATAGTR2017 SPEAKING EYE for differently abled people to see the web content
ATAGTR2017 SPEAKING EYE for differently abled people to see the web contentATAGTR2017 SPEAKING EYE for differently abled people to see the web content
ATAGTR2017 SPEAKING EYE for differently abled people to see the web contentAgile Testing Alliance
 
Do the right thing: accessibility and inclusive design (with Drupal)
Do the right thing: accessibility and inclusive design (with Drupal)Do the right thing: accessibility and inclusive design (with Drupal)
Do the right thing: accessibility and inclusive design (with Drupal)cspin
 

Similar to Accessibility testing for everyone (20)

Accessibility in Low-Code: Applications with no Limits
Accessibility in Low-Code: Applications with no LimitsAccessibility in Low-Code: Applications with no Limits
Accessibility in Low-Code: Applications with no Limits
 
Accessibility: Proven, easy integration into design and development workflows
Accessibility: Proven, easy integration into design and development workflowsAccessibility: Proven, easy integration into design and development workflows
Accessibility: Proven, easy integration into design and development workflows
 
app-and-web-brochure
app-and-web-brochureapp-and-web-brochure
app-and-web-brochure
 
User Testing for Accessibility
User Testing for AccessibilityUser Testing for Accessibility
User Testing for Accessibility
 
How to create accessible websites - WordCamp New York
How to create accessible websites - WordCamp New YorkHow to create accessible websites - WordCamp New York
How to create accessible websites - WordCamp New York
 
One Web To Rule Them All
One Web To Rule Them AllOne Web To Rule Them All
One Web To Rule Them All
 
How can I test my website for accessibility?
How can I test my website for accessibility?How can I test my website for accessibility?
How can I test my website for accessibility?
 
A Primer on Web Accessibility for Teams
A Primer on Web Accessibility for TeamsA Primer on Web Accessibility for Teams
A Primer on Web Accessibility for Teams
 
Practical DevOps & Continuous Delivery – A Webinar to learn in depth on DevO...
Practical DevOps & Continuous Delivery –  A Webinar to learn in depth on DevO...Practical DevOps & Continuous Delivery –  A Webinar to learn in depth on DevO...
Practical DevOps & Continuous Delivery – A Webinar to learn in depth on DevO...
 
Advanced Codeless Testing for Web Apps
Advanced Codeless Testing for Web AppsAdvanced Codeless Testing for Web Apps
Advanced Codeless Testing for Web Apps
 
Debakshi_Chakraborty _CV
Debakshi_Chakraborty _CVDebakshi_Chakraborty _CV
Debakshi_Chakraborty _CV
 
Quality and the "Secret Mission:" From End-Stage Tester to Skilled Analyst
Quality and the "Secret Mission:" From End-Stage Tester to Skilled AnalystQuality and the "Secret Mission:" From End-Stage Tester to Skilled Analyst
Quality and the "Secret Mission:" From End-Stage Tester to Skilled Analyst
 
Michael Kowalski
Michael KowalskiMichael Kowalski
Michael Kowalski
 
Accessibility for Content Developer, Designer, Code Developer and Tester
Accessibility for Content Developer, Designer, Code Developer and TesterAccessibility for Content Developer, Designer, Code Developer and Tester
Accessibility for Content Developer, Designer, Code Developer and Tester
 
Kaiser Permanente CSUN 2018
Kaiser Permanente CSUN 2018Kaiser Permanente CSUN 2018
Kaiser Permanente CSUN 2018
 
The Impact of Accessibility
The Impact of AccessibilityThe Impact of Accessibility
The Impact of Accessibility
 
Accessibility testing-Gyani and Siddhanth
Accessibility testing-Gyani and SiddhanthAccessibility testing-Gyani and Siddhanth
Accessibility testing-Gyani and Siddhanth
 
Nascenia: Road to Software Industry
Nascenia: Road to Software IndustryNascenia: Road to Software Industry
Nascenia: Road to Software Industry
 
ATAGTR2017 SPEAKING EYE for differently abled people to see the web content
ATAGTR2017 SPEAKING EYE for differently abled people to see the web contentATAGTR2017 SPEAKING EYE for differently abled people to see the web content
ATAGTR2017 SPEAKING EYE for differently abled people to see the web content
 
Do the right thing: accessibility and inclusive design (with Drupal)
Do the right thing: accessibility and inclusive design (with Drupal)Do the right thing: accessibility and inclusive design (with Drupal)
Do the right thing: accessibility and inclusive design (with Drupal)
 

More from Claudio Luis Vera, MBA, CPWA (14)

Ten Commandments CSUN 20220316-v3-export.pptx
Ten Commandments CSUN 20220316-v3-export.pptxTen Commandments CSUN 20220316-v3-export.pptx
Ten Commandments CSUN 20220316-v3-export.pptx
 
CSUN - Ten Commandments DRAFT
CSUN - Ten Commandments DRAFTCSUN - Ten Commandments DRAFT
CSUN - Ten Commandments DRAFT
 
The role of design in discrimination
The role of design in discriminationThe role of design in discrimination
The role of design in discrimination
 
Giving a voice to those without speech
Giving a voice to those without speechGiving a voice to those without speech
Giving a voice to those without speech
 
Everyone here spoke sign language
Everyone here spoke sign languageEveryone here spoke sign language
Everyone here spoke sign language
 
Accessibility: the letter of the law
Accessibility: the letter of the lawAccessibility: the letter of the law
Accessibility: the letter of the law
 
IXDA - Build apps like you mean it
IXDA - Build apps like you mean itIXDA - Build apps like you mean it
IXDA - Build apps like you mean it
 
Disabilities and digital equality
Disabilities and digital equalityDisabilities and digital equality
Disabilities and digital equality
 
Build apps like you mean it
Build apps like you mean itBuild apps like you mean it
Build apps like you mean it
 
Business case for accessibility
Business case for accessibilityBusiness case for accessibility
Business case for accessibility
 
Building the business case for accessibility
Building the business case for accessibilityBuilding the business case for accessibility
Building the business case for accessibility
 
Global Accessibility Awareness Day
Global Accessibility Awareness DayGlobal Accessibility Awareness Day
Global Accessibility Awareness Day
 
Building websites for all
Building websites for allBuilding websites for all
Building websites for all
 
Building websites for all
Building websites for allBuilding websites for all
Building websites for all
 

Recently uploaded

(8264348440) 🔝 Call Girls In Safdarjung Enclave 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Safdarjung Enclave 🔝 Delhi NCR(8264348440) 🔝 Call Girls In Safdarjung Enclave 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Safdarjung Enclave 🔝 Delhi NCRsoniya singh
 
Call Girls in majnu ka tilla Delhi 💯 Call Us 🔝8264348440🔝
Call Girls in majnu ka tilla Delhi 💯 Call Us 🔝8264348440🔝Call Girls in majnu ka tilla Delhi 💯 Call Us 🔝8264348440🔝
Call Girls in majnu ka tilla Delhi 💯 Call Us 🔝8264348440🔝puti54677
 
EMPLOYEES JOB SATISFACTION ( With special reference to selected Sundaram Ind...
EMPLOYEES JOB SATISFACTION  ( With special reference to selected Sundaram Ind...EMPLOYEES JOB SATISFACTION  ( With special reference to selected Sundaram Ind...
EMPLOYEES JOB SATISFACTION ( With special reference to selected Sundaram Ind...ksanjai333
 
TDC Health Limited Nigeria Business Plan Opportunity Presentation 2024
TDC Health Limited Nigeria Business Plan Opportunity Presentation 2024TDC Health Limited Nigeria Business Plan Opportunity Presentation 2024
TDC Health Limited Nigeria Business Plan Opportunity Presentation 2024Fikrie Omar
 
Call girls in Andheri with phone number 9892124323
Call girls in Andheri with phone number 9892124323Call girls in Andheri with phone number 9892124323
Call girls in Andheri with phone number 9892124323Pooja Nehwal
 
(8264348440) 🔝 Call Girls In Green Park 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Green Park 🔝 Delhi NCR(8264348440) 🔝 Call Girls In Green Park 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Green Park 🔝 Delhi NCRsoniya singh
 
Lucknow 💋 Escort Service in Lucknow ₹7.5k Pick Up & Drop With Cash Payment 89...
Lucknow 💋 Escort Service in Lucknow ₹7.5k Pick Up & Drop With Cash Payment 89...Lucknow 💋 Escort Service in Lucknow ₹7.5k Pick Up & Drop With Cash Payment 89...
Lucknow 💋 Escort Service in Lucknow ₹7.5k Pick Up & Drop With Cash Payment 89...anilsa9823
 
Top Call Girls In Arjunganj ( Lucknow ) ✨ 8923113531 ✨ Cash Payment
Top Call Girls In Arjunganj ( Lucknow  ) ✨ 8923113531 ✨  Cash PaymentTop Call Girls In Arjunganj ( Lucknow  ) ✨ 8923113531 ✨  Cash Payment
Top Call Girls In Arjunganj ( Lucknow ) ✨ 8923113531 ✨ Cash Paymentanilsa9823
 
High Profile Call Girls in Lucknow | Whatsapp No 🧑🏼‍❤️‍💋‍🧑🏽 8923113531 𓀇 VIP ...
High Profile Call Girls in Lucknow | Whatsapp No 🧑🏼‍❤️‍💋‍🧑🏽 8923113531 𓀇 VIP ...High Profile Call Girls in Lucknow | Whatsapp No 🧑🏼‍❤️‍💋‍🧑🏽 8923113531 𓀇 VIP ...
High Profile Call Girls in Lucknow | Whatsapp No 🧑🏼‍❤️‍💋‍🧑🏽 8923113531 𓀇 VIP ...gurkirankumar98700
 
(8264348440) 🔝 Call Girls In Khanpur 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Khanpur 🔝 Delhi NCR(8264348440) 🔝 Call Girls In Khanpur 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Khanpur 🔝 Delhi NCRsoniya singh
 
VIP 7001035870 Find & Meet Hyderabad Call Girls Gachibowli high-profile Call ...
VIP 7001035870 Find & Meet Hyderabad Call Girls Gachibowli high-profile Call ...VIP 7001035870 Find & Meet Hyderabad Call Girls Gachibowli high-profile Call ...
VIP 7001035870 Find & Meet Hyderabad Call Girls Gachibowli high-profile Call ...aditipandeya
 
VIP Chandigarh Call Girls 7001035870 Enjoy Call Girls With Our Escorts
VIP Chandigarh Call Girls 7001035870 Enjoy Call Girls With Our EscortsVIP Chandigarh Call Girls 7001035870 Enjoy Call Girls With Our Escorts
VIP Chandigarh Call Girls 7001035870 Enjoy Call Girls With Our Escortssonatiwari757
 
VIP 7001035870 Find & Meet Hyderabad Call Girls Jubilee Hills high-profile Ca...
VIP 7001035870 Find & Meet Hyderabad Call Girls Jubilee Hills high-profile Ca...VIP 7001035870 Find & Meet Hyderabad Call Girls Jubilee Hills high-profile Ca...
VIP 7001035870 Find & Meet Hyderabad Call Girls Jubilee Hills high-profile Ca...aditipandeya
 
Top Call Girls In Indira Nagar Lucknow ( Lucknow ) 🔝 8923113531 🔝 Cash Payment
Top Call Girls In Indira Nagar Lucknow ( Lucknow  ) 🔝 8923113531 🔝  Cash PaymentTop Call Girls In Indira Nagar Lucknow ( Lucknow  ) 🔝 8923113531 🔝  Cash Payment
Top Call Girls In Indira Nagar Lucknow ( Lucknow ) 🔝 8923113531 🔝 Cash Paymentanilsa9823
 
Cheap Rate ➥8448380779 ▻Call Girls In Sector 54 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 54 GurgaonCheap Rate ➥8448380779 ▻Call Girls In Sector 54 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 54 GurgaonDelhi Call girls
 
Cheap Rate ➥8448380779 ▻Call Girls In Sector 55 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 55 GurgaonCheap Rate ➥8448380779 ▻Call Girls In Sector 55 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 55 GurgaonDelhi Call girls
 
Model Call Girl in Bawana Delhi reach out to us at 🔝8264348440🔝
Model Call Girl in Bawana Delhi reach out to us at 🔝8264348440🔝Model Call Girl in Bawana Delhi reach out to us at 🔝8264348440🔝
Model Call Girl in Bawana Delhi reach out to us at 🔝8264348440🔝soniya singh
 
Cheap Rate ➥8448380779 ▻Call Girls In Sector 56 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 56 GurgaonCheap Rate ➥8448380779 ▻Call Girls In Sector 56 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 56 GurgaonDelhi Call girls
 
Mumbai Call Girls Colaba Pooja WhatsApp 7738631006 💞 Full Night Enjoy
Mumbai Call Girls Colaba Pooja WhatsApp  7738631006  💞 Full Night EnjoyMumbai Call Girls Colaba Pooja WhatsApp  7738631006  💞 Full Night Enjoy
Mumbai Call Girls Colaba Pooja WhatsApp 7738631006 💞 Full Night EnjoyPooja Nehwal
 

Recently uploaded (20)

(8264348440) 🔝 Call Girls In Safdarjung Enclave 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Safdarjung Enclave 🔝 Delhi NCR(8264348440) 🔝 Call Girls In Safdarjung Enclave 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Safdarjung Enclave 🔝 Delhi NCR
 
Call Girls in majnu ka tilla Delhi 💯 Call Us 🔝8264348440🔝
Call Girls in majnu ka tilla Delhi 💯 Call Us 🔝8264348440🔝Call Girls in majnu ka tilla Delhi 💯 Call Us 🔝8264348440🔝
Call Girls in majnu ka tilla Delhi 💯 Call Us 🔝8264348440🔝
 
EMPLOYEES JOB SATISFACTION ( With special reference to selected Sundaram Ind...
EMPLOYEES JOB SATISFACTION  ( With special reference to selected Sundaram Ind...EMPLOYEES JOB SATISFACTION  ( With special reference to selected Sundaram Ind...
EMPLOYEES JOB SATISFACTION ( With special reference to selected Sundaram Ind...
 
TDC Health Limited Nigeria Business Plan Opportunity Presentation 2024
TDC Health Limited Nigeria Business Plan Opportunity Presentation 2024TDC Health Limited Nigeria Business Plan Opportunity Presentation 2024
TDC Health Limited Nigeria Business Plan Opportunity Presentation 2024
 
Call girls in Andheri with phone number 9892124323
Call girls in Andheri with phone number 9892124323Call girls in Andheri with phone number 9892124323
Call girls in Andheri with phone number 9892124323
 
(8264348440) 🔝 Call Girls In Green Park 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Green Park 🔝 Delhi NCR(8264348440) 🔝 Call Girls In Green Park 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Green Park 🔝 Delhi NCR
 
Lucknow 💋 Escort Service in Lucknow ₹7.5k Pick Up & Drop With Cash Payment 89...
Lucknow 💋 Escort Service in Lucknow ₹7.5k Pick Up & Drop With Cash Payment 89...Lucknow 💋 Escort Service in Lucknow ₹7.5k Pick Up & Drop With Cash Payment 89...
Lucknow 💋 Escort Service in Lucknow ₹7.5k Pick Up & Drop With Cash Payment 89...
 
Top Call Girls In Arjunganj ( Lucknow ) ✨ 8923113531 ✨ Cash Payment
Top Call Girls In Arjunganj ( Lucknow  ) ✨ 8923113531 ✨  Cash PaymentTop Call Girls In Arjunganj ( Lucknow  ) ✨ 8923113531 ✨  Cash Payment
Top Call Girls In Arjunganj ( Lucknow ) ✨ 8923113531 ✨ Cash Payment
 
Pakistani Jumeirah Call Girls # +971559085003 # Pakistani Call Girls In Jumei...
Pakistani Jumeirah Call Girls # +971559085003 # Pakistani Call Girls In Jumei...Pakistani Jumeirah Call Girls # +971559085003 # Pakistani Call Girls In Jumei...
Pakistani Jumeirah Call Girls # +971559085003 # Pakistani Call Girls In Jumei...
 
High Profile Call Girls in Lucknow | Whatsapp No 🧑🏼‍❤️‍💋‍🧑🏽 8923113531 𓀇 VIP ...
High Profile Call Girls in Lucknow | Whatsapp No 🧑🏼‍❤️‍💋‍🧑🏽 8923113531 𓀇 VIP ...High Profile Call Girls in Lucknow | Whatsapp No 🧑🏼‍❤️‍💋‍🧑🏽 8923113531 𓀇 VIP ...
High Profile Call Girls in Lucknow | Whatsapp No 🧑🏼‍❤️‍💋‍🧑🏽 8923113531 𓀇 VIP ...
 
(8264348440) 🔝 Call Girls In Khanpur 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Khanpur 🔝 Delhi NCR(8264348440) 🔝 Call Girls In Khanpur 🔝 Delhi NCR
(8264348440) 🔝 Call Girls In Khanpur 🔝 Delhi NCR
 
VIP 7001035870 Find & Meet Hyderabad Call Girls Gachibowli high-profile Call ...
VIP 7001035870 Find & Meet Hyderabad Call Girls Gachibowli high-profile Call ...VIP 7001035870 Find & Meet Hyderabad Call Girls Gachibowli high-profile Call ...
VIP 7001035870 Find & Meet Hyderabad Call Girls Gachibowli high-profile Call ...
 
VIP Chandigarh Call Girls 7001035870 Enjoy Call Girls With Our Escorts
VIP Chandigarh Call Girls 7001035870 Enjoy Call Girls With Our EscortsVIP Chandigarh Call Girls 7001035870 Enjoy Call Girls With Our Escorts
VIP Chandigarh Call Girls 7001035870 Enjoy Call Girls With Our Escorts
 
VIP 7001035870 Find & Meet Hyderabad Call Girls Jubilee Hills high-profile Ca...
VIP 7001035870 Find & Meet Hyderabad Call Girls Jubilee Hills high-profile Ca...VIP 7001035870 Find & Meet Hyderabad Call Girls Jubilee Hills high-profile Ca...
VIP 7001035870 Find & Meet Hyderabad Call Girls Jubilee Hills high-profile Ca...
 
Top Call Girls In Indira Nagar Lucknow ( Lucknow ) 🔝 8923113531 🔝 Cash Payment
Top Call Girls In Indira Nagar Lucknow ( Lucknow  ) 🔝 8923113531 🔝  Cash PaymentTop Call Girls In Indira Nagar Lucknow ( Lucknow  ) 🔝 8923113531 🔝  Cash Payment
Top Call Girls In Indira Nagar Lucknow ( Lucknow ) 🔝 8923113531 🔝 Cash Payment
 
Cheap Rate ➥8448380779 ▻Call Girls In Sector 54 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 54 GurgaonCheap Rate ➥8448380779 ▻Call Girls In Sector 54 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 54 Gurgaon
 
Cheap Rate ➥8448380779 ▻Call Girls In Sector 55 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 55 GurgaonCheap Rate ➥8448380779 ▻Call Girls In Sector 55 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 55 Gurgaon
 
Model Call Girl in Bawana Delhi reach out to us at 🔝8264348440🔝
Model Call Girl in Bawana Delhi reach out to us at 🔝8264348440🔝Model Call Girl in Bawana Delhi reach out to us at 🔝8264348440🔝
Model Call Girl in Bawana Delhi reach out to us at 🔝8264348440🔝
 
Cheap Rate ➥8448380779 ▻Call Girls In Sector 56 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 56 GurgaonCheap Rate ➥8448380779 ▻Call Girls In Sector 56 Gurgaon
Cheap Rate ➥8448380779 ▻Call Girls In Sector 56 Gurgaon
 
Mumbai Call Girls Colaba Pooja WhatsApp 7738631006 💞 Full Night Enjoy
Mumbai Call Girls Colaba Pooja WhatsApp  7738631006  💞 Full Night EnjoyMumbai Call Girls Colaba Pooja WhatsApp  7738631006  💞 Full Night Enjoy
Mumbai Call Girls Colaba Pooja WhatsApp 7738631006 💞 Full Night Enjoy
 

Accessibility testing for everyone

  • 1. Accessibility testing for everyone Techniques for all business sizes Claudio Luis Vera Accessibility Expert at Royal Caribbean Cruises, Ltd.
  • 2. Hats that I’ve worn I work as a accessibility professional after a 25-year career in UX design and development. Front- end developer Creative Director UX Designer Aging human Management Certified A11y professional Caregiver C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N
  • 3. Which of these personas is the one to design for?
  • 5. WCAG 2.1: The de facto standard for web accessibility, made up of a set of hundreds of guidelines.
  • 6. C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N WCAG levels A Obsolescent standard that doesn’t meet legal requirements AA Nearly-universal standard AAA Advanced requirement where near-perfect accessibility is imperative
  • 7. What’s a screen reader? Screen readers are software programs that allow blind or visually impaired users to read the text that is displayed on the computer screen with a speech synthesizer or braille display. -American Federation for the Blind NVDA JAWS Mac Voiceover
  • 8. 8C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N main Skipto main Skipto main main
  • 9. C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N Top accessibility mistakes ● Missing alt tags or alt text ● Missing form field labels ● Insufficient color contrast ● Broken tab index ● Hidden focus ● Using styles instead of headings ● Using buttons where links should go ● Missing “Skip navigation” link ● Social toolbars that don’t skip links
  • 11. C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N Contrast ratios 3 : 1 Requirement for WCAG AA 2.x for large-scale text (over 18 pt) 4.5 : 1 Requirement for WCAG AA 2.x for text (14 -18 pt) 7 : 1 Requirement for WCAG AAA for any size text
  • 12. C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N Sample of a color palette built around color contrast. An accessible color palette
  • 13. 2 Test-as-you-go • WAVE and other browser plugins • aXe code inspector • Google Developer Tools
  • 16. C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N DIY Testing techniques ● Unplug your mouse and cover your trackpad ● Tab through your menus, forms ● Can you access every menu and control? ● Can you operate every menu and control? ● Can you see where the focus is at all times?
  • 17. C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N DIY Testing techniques ● Magnify the page to 200% (this is required for WCAG AA) ● Magnify the page to 500% Can you read all the text: ● Are there overlaps? ● Hidden text areas? ● Collisions? Do you have to scroll horizontally?
  • 18. C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N Other DIY Techniques Using WAVE: ● Turn off images ● Turn off CSS Turn on high-contrast mode Also, be sure to: ● Click on field labels ● Check for captions and transcripts
  • 20. Tenon.io – starting at $82 / month for 3,000 API calls
  • 21. Siteimprove – starting at 250 pages for $3,000/year
  • 22. Siteimprove – starting at 250 pages for $3,000/year
  • 23. C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N Testing vendors Small- and medium-sized businesses Tenon.io Siteimprove AudioEye Enterprise Level Access Deque Systems Siteimprove
  • 24. C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N How to get more involved Get trained Courses are available through Deque U. Get certified Core (CPACC), technical (WAS) and combined (CPWA) certification DHS Trusted Tester Program Join Web Accessibility Group at UGA IAAP Accessibility groups in various open source projects (Wordpress, Drupal) web-a11y Slack channel Great Lakes ADA / a11y-chi
  • 25. C L A U D I O L U I S V E R A , R O Y A L C A R I B B E A N Resources WAVE accessibility tester (Chrome/Firefox) axe accessibility tester (Chrome dev tools) Contrast checker from the Mac App Store Google Developer tools IAAP (International Association of Accessibility Professionals) Deque University (accessibility courses) UGA Web Accessibility Group (WAG) Accessibility testing on a $7 budget, post on Medium

Editor's Notes

  1. This is the entire purpose of designing and building for accessibility: allowing differently-abled people to get around and manage on their own.
  2. For tonight, we’ll be focusing on this one set of guidelines, which affect all websites in the USA.
  3. These are the three levels of WCAG guidelines: AA is the one we should concern ourselves with.
  4. Definition from http://www.afb.org/prodBrowseCatResults.aspx?CatID=49
  5. Here is the same page in Chrome, and also with a rendering of how it would be read in a screen reader. Then pull up the page https://www.sonesta.com/us/louisiana/new-orleans/royal-sonesta-new-orleans and have it read with Voiceover.
  6. Here are the top issues that I run into in my work day.
  7. Image shows Contrast app in action.
  8. WCAG success criterion 1.4.3
  9. Here’s a sample palette based around color contrast. It’s a revision of a palette from a branding company that’s treated like the Ten Commandments. A palette like this also explains where you can overlay text on a color
  10. Aka DIY testing. We’ve created detailed documentation on these techniques and I’m happy to share it with you after this meeting.
  11. Go to https://www.linkedin.com/in/jennylf and demo both WAVE and aXe plugins
  12. For those of you who are developers, you’ll find that anything that’s tied to a mouseover or hover event won’t work this way. But you should already know that, if you’re building for mobile devices.
  13. Yes, there are users out there with very limited vision who scan pages closely at 500% maginifcation.
  14. Detailed pricing info at https://tenon.io/pricing.php
  15. CPACC - Certified Professional in Accessibility Core Competencies WAS - Web Accessibility Specialist CPWA - Certified Professional in Web Accessibility