Making the Web Work for People with Disabilities

What is accessibility?

Accommodating People with Disabilities

  • People with low vision, blindness, or color blindness
  • People with limited use of their hands
  • People who are deaf or hard of hearing
  • People with learning disabilities

Compatibility with Assistive Technologies

  • Screen Magnifiers (ZoomText, MAGic)
  • Screen Readers (JAWS, NVDA, VoiceOver)
  • Alternate Keyboard & Mouse Devices
  • Speech Recognition (Dragon NaturallySpeaking, WSR)
  • Reading Aids (Read&Write, BrowseAloud)

Why is accessibility important?

Your Users

  • 10-20% of Americans have or will have a disability
  • An aging population has increasing accessibility needs
  • Accessibility and usability often go hand-in-hand

The Law

Illinois Information Technology Accessibility Act (IITAA)

It is the policy of the State of Illinois that information technology developed,
purchased, or provided by the State is accessible to individuals with disabilities.

https://onenet.illinois.gov/iitaa

How do we make web sites accessible?

Key Concepts

  • Code - Use HTML how it was meant to be used
  • Color - Use contrasting colors & don't use color alone
  • Alt Text - Provide text alternatives for non-text content
  • Labels - Label interactive elements
  • Keyboard - Ensure keyboard operability

Accessibility Testing

  • Automated Testing
  • "Quick Tests"
  • Testing with Assistive Technologies

Know the limitations...

  • Accessibility requires manual tests
  • Some tools don't test what you think (e.g. DHTML Test)
  • You need to be able to recognize when they makes mistakes...

World's Least Accessible Web Page

12 automated testing tools vs. 142 errors:

  • Best 40%
  • Worst 17%
  • None 29%

WAVE Disclaimers

  • WAVE cannot tell you if your web content is accessible. Only a human can determine true accessibility.
  • The absence of errors DOES NOT mean your page is accessible or compliant.
  • We never indicate that your page is accessible or if it has 'passed' WAVE.

Quick Test: Colors

  1. Turn on High Contrast
  2. Check that:
    • Text changes color
    • Nothing important disappears
  3. Use the Colour Contrast Analyzer 

Quick Test: Keyboard

  1. "Tab" through links, form fields, custom controls
  2. Check that:

Quick Test: PDF Documents

  1. Open the PDF document in Adobe Reader (or Acrobat)
  2. Open the File menu and pick Save as Text
  3. Open the text file and confirm that all text is present and in the right order

Quick Test: PDF Forms

  1. Open the PDF form in Adobe Reader (or Acrobat)
  2. Tab through links and form fields as described above
  3. Hover the mouse over each field and check that the tooltip provides an appropriate label

Keys to Success

What TO do...

  • Start early
  • Get training
  • Use automated and functional testing
  • Find the right tools
  • Trust but verify
  • Get everyone involved

What NOT to do....

  • Put it off
  • Assume your developers or vendors know
  • Rely (only) on automated testing
  • Believe the hype

Procurement

  1. Require compliance in procurement & contract documents
  2. Ask for VPATs
  3. Spot-check or demo to confirm
  4. Perform automated tests
  5. Perform functional spot-checks

Development

  1. Require compliance in project processes
  2. Ensure developers have been trained
  3. Perform developer tests
  4. Perform automated tests
  5. Perform functional spot-checks

Content Creation

  1. Engage content creators
  2. Identify tools that support accessibility
  3. Provide training
  4. Provide support
  5. Perform automated tests & functional spot-checks

Help?