2. Web Accessibility in 2020
Some of the things we’ll cover:
● Review of recent news
● Recent accessibility-related litigation
● Evolving accessibility standards
● Evolving browser support
3. Web Accessibility in 2020
And how tools and solutions have evolved
● Site accessibility strategies
● Automated tools
● Manual testing techniques
4. Accessibility Lawsuits Increasing
Number Of Federal Website Accessibility Lawsuits Nearly Triple, Exceeding 2250 In
2018 | ADA Title III https://www.adatitleiii.com/2019/01/number-of-federal-
website-accessibility-lawsuits-nearly-triple-exceeding-2250-in-2018/
2019 Was Another Record-Breaking Year for Federal ADA Title III Lawsuits | ADA
Title III https://www.adatitleiii.com/2020/02/2019-was-another-record-breaking-
year-for-federal-ada-title-iii-lawsuits/
7. Making Cheap Pizza Accessible Again
Domino's Pizza LLC v. Robles - SCOTUSblog https://www.scotusblog.com/case-
files/cases/dominos-pizza-llc-v-robles/
8. Another Interesting Case
INSIGHT: A Lawsuit Against Adult Entertainment Sites Might Clarify ADA
https://news.bloomberglaw.com/us-law-week/insight-a-lawsuit-against-adult-
entertainment-sites-might-clarify-ada
○ Suris v. Mindgeek Holdings Sarl, 1:20-cv-00284 – CourtListener.com
https://www.courtlistener.com/docket/16714136/suris-v-mindgeek-holdings-sarl/
9. Recent Developments in Standards
● Web Content Accessibility Guidelines (WCAG) 2.1
○ W3C Recommendation 05 June 2018
https://www.w3.org/TR/WCAG21/
○ Almost 10 years after WCAG 2.0 became a recommendation (December 11, 2008)
● The Section 508 Update | Section508.gov (2017)
https://www.section508.gov/blog/accessibility-news-the-section-508-Update
11. WCAG 2.1
What’s New in WCAG 2.1 | Web Accessibility Initiative (WAI) | W3C
https://www.w3.org/WAI/standards-guidelines/wcag/new-in-21/
12. WCAG 2.1
● Orientation
○ Content does not restrict its view and operation to a single display orientation, such as portrait
or landscape.
● Pointer Gestures
○ Have alternatives to gestures (e.g., buttons to mimic gesture effects like zooming)
● Pointer Cancellation
○ Being able to abort mistaken clicks or presses.
● Use of Correct Label in Name
○ Control labels and visually presented names need to be consistent.
● Motion Actuation
○ Motion-activated functions need to have alternates
13. WCAG 2.1
● Reflow
○ Content can be presented without loss of information or functionality, and without requiring
scrolling, in the following dimensions:
○ Vertical scrolling content at a width equivalent to 320 pixels
○ Horizontal scrolling content at a height equivalent to 256 pixels
● Non-Text Contrast
○ Non-test interface elements (e.g., button borders) need to have appropriate (3:1) contrast.
● Text Spacing
○ Line height (line spacing) to at least 1.5 times the font size;
○ Spacing following paragraphs to at least 2 times the font size;
○ Letter spacing (tracking) to at least 0.12 times the font size;
○ Word spacing to at least 0.16 times the font size.
14. WCAG 2.1
● Content on Hover or Focus
○ Dismissable: A mechanism is available to dismiss the additional content without moving pointer
hover or keyboard focus, unless the additional content communicates an input error or does not
obscure or replace other content;
○ Hoverable: If pointer hover can trigger the additional content, then the pointer can be moved
over the additional content without the additional content disappearing;
○ Persistent: The additional content remains visible until the hover or focus trigger is removed,
the user dismisses it, or its information is no longer valid.
● Identify Input Purpose
○ Will allow for some complex forms to be fully or partially completed in a programmatic manner.
● Status Messages
○ Status messages for actions (e.g, a confirmation for an online reservation) are presented to
assistive technologies, not just visually.
15. WCAG 2.2
Web Content Accessibility Guidelines (WCAG) 2.2
https://www.w3.org/TR/WCAG22/
First Public Working Draft 27 February 2020
New Features in WCAG 2.2 https://www.w3.org/TR/WCAG22/#new-features-in-
wcag-2-2
Main new addition so far:
Making page region of focus visible
16. Revised 508 Standards
Major changes in the Revised 508 Standards include:
Focus on Functionality - Organizes by functionality instead of product type, to keep pace with advances in technology.
Industry Alignment - Incorporates Web Content Accessibility Guidelines (WCAG) 2.0, developed by the World Wide Web Consortium (W3C), an
international community that creates web standards. Clarifies applicability to websites, electronic documents and software.
Content Accessibility - Requires all public-facing official agency business content, as well as specific categories of non-public-facing content that is
official agency business, to be accessible.
Synchronized Tools and Tech - Clarifies that software and operating systems must interoperate with assistive technology.
Expanded Marketplace - Incorporates by reference selected international standards like WCAG 2.0, and harmonizes with European Commission ICT
Standards (EN 301 549), to create a larger marketplace of accessibility solutions.
17. Assistive Technology
Latest WebAIM Screen Reader Survey
WebAIM: Screen Reader User Survey #8 Results
https://webaim.org/projects/screenreadersurvey8/
Key takeaway: Respondents with disabilities are more likely to use a mobile screen
reader than respondents without disabilities.
21. Evolving browser technology
ARIA (Accessible Rich Internet Applications) vs HTML
HTML and continuing advancement in browser support for accessibility-related
HTML is making it easier to develop highly accessible pages with plain HTML
Invokes the first rule of ARIA https://www.w3.org/TR/using-aria/#rule1
“If you can use a native HTML element [HTML51] or attribute with the semantics and behavior you require already
built in, instead of re-purposing an element and adding an ARIA role, state or property to make it accessible, then do
so.”
ARIA is still highly useful for many applications, especially more complex web
applications, but…..
22. Evolving Browser Technology
We run the risk of making pages “overly” accessible with redundant code that, at
best, adds bloat and unnecessary complexity.
23. “Compound” Accessibility
People might have multiple complications accessing web content
For example:
● Low vision and reduced motor capability
● Color blindness that might decrease contrast ratios between certain color
combinations
24. So how do we proceed?
● Testing
○ Both manual and automated have their strengths and weaknesses.
● Managing the content creation process
○ Baking in accessibility into content creation tools.
○ Providing resources to help content creators make their content accessible.
○ Developing accessibility auditing strategies.
25. So how do we proceed?
Different workflows
● Centralized vs decentralized content development.
● Amount of power content producers have over markup and styling.
● Types of tools used for content creation (do they produce accessible content by
default?)
The tools and strategies that are best for you will be partially determined by your
specific content creation environment.
26. Automated Tools
Single-page accessibility scanners:
WAVE Web Accessibility Tool
https://wave.webaim.org/
axe: Accessibility Testing for Development Teams
https://www.deque.com/axe/
Accessibility Reference | Tools for Web Developers | Google Developers
https://developers.google.com/web/tools/chrome-devtools/accessibility/reference
Koa11y Download
https://open-indy.github.io/Koa11y/
29. Other Tools and Links
Color Contrast Checkers
WebAIM: Contrast Checker
https://webaim.org/resources/contrastchecker/
Accessible Colors | WCAG 2.0 AA and AAA color contrast checker
https://accessible-colors.com/
Contrast Ratio: Easily calculate color contrast ratios. Passing WCAG was never this
easy! https://contrast-ratio.com/
30. Other Tools and Links
Color Contrast Checkers
Color Contrast Analyzer - Chrome Web Store
https://chrome.google.com/webstore/detail/color-contrast-
analyzer/dagdlcijhfbmgkjokkjicnnfimlebcll
A11y accessibility check for text colour on background image
https://www.brandwood.com/a11y/
Color Contrast Tools | Web Axe (big list of tools)
https://www.webaxe.org/color-contrast-tools/
31. Other Tools and Links
Color Blindness Simulators
Coblis — Color Blindness Simulator https://www.color-blindness.com/coblis-color-
blindness-simulator/
Toptal Color Blind Filter
https://www.toptal.com/designers/colorfilter/
Colorblindly - Chrome Web Store
https://chrome.google.com/webstore/detail/colorblindly/floniaahmccleoclneebhh
mnjgdfijgg?hl=en
32. Other Tools and Links
Binary file (specifically PDF and MS Office) accessibility
Create and verify PDF accessibility, Acrobat Pro https://helpx.adobe.com/acrobat/using/create-verify-pdf-
accessibility.html
PDF Accessibility Overview https://www.adobe.com/accessibility/pdf/pdf-accessibility-overview.html
Make your Word documents accessible to people with disabilities - Office Support
https://support.office.com/en-us/article/make-your-word-documents-accessible-to-people-with-
disabilities-d9bf3683-87ac-47ea-b91a-78dcacb3c66d
Create Accessible Documents | Assistive Technology Initiative | George Mason University
https://ati.gmu.edu/resources/accessibility-resources/create-accessible-documents/
33. Other Tools and Links
Video Accessibility
Many tools (Camtasia, etc) have built-in accessibility features… use them.
Automatic transcription, captioning & instant translation | Speechlogger
https://speechlogger.appspot.com/
Youtube’s automatically generated transcripts can be copied
34. Other Tools and Links
Language
ReadabilityFormulas.com https://readabilityformulas.com/freetests/six-
readability-formulas.php
Readable | Free Readability Test Tool
https://www.webfx.com/tools/read-able/
CMS Tools
CKEditor Accessibility Checker https://ckeditor.com/cke4/addon/a11ychecker
35. Manual Testing
Human Intervention Is Required for the following:
● Is the alt text accurate given the context?
● Are descriptions easy to understand?
● Do the headings represent the correct hierarchy?
● Is the HTML semantic?
● Does the application UI behave as expected?
36. Manual Testing
However:
● With screen reader testing and manually verifying compliance with guidelines
and best practices.
○ Requires a good bit of knowledge
■ both in use of accessibility evaluation software and current standards, but also
development/UX techniques for remediation
○ But learning the basics of manual testing is well worth it!
38. Manual Testing
NVDA demonstrations
Screen Reader Basics: NVDA - A11ycasts
https://youtu.be/Jao3s_CwdRU
Accessibility Testing with the NVDA Screenreader - Deque Systems
https://youtu.be/Vx1vSd5uYS8
Learn NVDA: Hotkeys and Commands - The American Foundation for the Blind
https://youtu.be/PrrljNEpMVg
47. More reasons to give a *#%! about manual
testing
Accessible sites have always performed better in search engines.
● Due to content being better exposed to search engine crawlers
● And there is some evidence that some search engines give accessible content a rankings boost.
Manual accessibility testing forces one to pay close attention to many interactive
site elements.
● This close attention to site interactions can only increase the quality of UX.
48. Final Thoughts
Helping make ensure that site content remains accessible is no a trivial task.
Standards evolve, browser and assistive technology evolves, implementation of
standards and remediation requires a decent bit of skill and knowledge.
That being said, we shouldn’t let any of this discourage us in our attempts to make
our sites as accessible as possible.
Editor's Notes
And I’m going to try my best to convince all of you that accessibility evaluation and remediation isn’t as complex as it might seem
ADA applies to Domino’s website and app. is a website or an app a "public accommodation" under the law the same way a brick-and-mortar storefront is,
Are sites that are primarily content aggregators liable?
W3C documentation and guidelines are actually pretty good reads
WCAG 2.0 informs Section 508
These are mobile-oriented
Nice to have some specific, concrete guidelines
Examples of recent browser improvements: landmark regions, required form element attribute, etc
And we run the risk of creating excessively verbose and/or conflicting auditory experiences. Much like overuse of <strong> in the past led to poor experiences.
Blind users and screen reader technology often gets an over-sized portion of attention. Mostly because it’s a problem with clear, easily-defined remediation paths. But there are many, many other user conditions that we need to pay attention to. And standards have started to give other disabilities more even treatment. We are seeing this in wcag with more emphasis on low-vision, cognitive and other disabilities
Workflow will inform accessibility solutions chosen
Automated tools good for periodic scans and verifying new development
Ways to test sites that also provide a means for testers to empathize with users . Also covers low vision and motor difficulty users
How messed up do things become. Does text disappear or become difficult to read?