Accessibility 101

The Technical Stuff

 

Memphis Tech Talks hosted by FIT & MTF

George Spake

Web Services at UTHSC

On the twittters: @georgespake

georgespake.com

What's Accessibility?

"the design of products, devices, services, or environments for people who experience disabilities"

 

A11Y
A [11 letters] Y

Why does A11Y matter so much?

What's the big deal?

The Business Case:

• Make services available to an
  entire demographic
• Lead the charge
• Make Google happy
• Avoid LAWSUITS!

Unlike old browsers and antiquated standards that we can choose not to support,

disabilities aren't going away any time soon

 

 

 

The Good News

Making your applications accessible is easier than you might think.

There is an entire industry focused on A11Y

Tons of support

Standards and tools already exist

Frameworks like Foundation and Bootstrap prioritize A11Y

 

You said "The Technical Stuff"

(We're getting there)

• Section 508
• W3C
  • WAI - Web Accessibility Initiative
    • WCAG  - Web Content Accessibility Guidelines
    • ARIA - Accessible Rich Internet Applications
• Properly Structured HTML

 

Laws and Standards, Recommendations, Best Practices

Section 508

"Effective June 21, 2001, requires Federal departments and agencies that develop, procure, maintain, or use electronic and information technology to assure that these technologies provide access to information and data for people with disabilities"
 

• Dated
• Broad Scope
• Currently being "refreshed"
• Expected to point to WCAG

Laws and Standards, Recommendations, Best Practices

 

WCAG - Web Content Accessibility Guidelines

"W3C recommendations under WAI - Goal: provide a single shared standard for web content accessibility that meets the needs of individuals, organizations, and governments internationally"

 

• Specific W3C Recommendations
• More rigid than 508
• Aim for WCAG 2.0 AA
• Includes ARIA

Ok, but the technical stuff!!

Laws and Standards, Recommendations, Best Practices

 

ARIA

The Accessible Rich Internet Application Suite

• Markup that targets screen readers and assistive technology
• "Making AJAX and related technologies accessible"
• W3C Site is the best resource
• Foundation and Bootstrap integrate
  ARIA in to components

 

[Demo]

A girl can't access the navigation menu

Laws and Standards, Recommendations, Best Practices

 

HTML

Hypertext Markup Language

 

• Properly structured, semantic HTML
  can take you a long way
• Image alt tags
• Bulleted Lists
• Proper use of headings

I have to do what?

Some accessibility gotchas that are easy to miss...

Some people are color blind and they can't read this

Display: none means "make this invisible"

Don't rely on hover - provide fallbacks

Videos should be captioned
Images should be alt-tagged (use empty alt tags)
A lot of assistive technology mimics keyboard navigation

 

Watch "How I use the computer" videos

Read the W3C docs

Refer to Foundation and Bootstrap

We're still figuring this out

Our goal is to do everything we can to be prepared to receive and respond to feedback from users with disabilities.