Web Accessibility & Inclusive Design: A New Standard

Dennis Deacon Elizabeth Carpenter Andrew Larkin

Chicago Web Accessibility and Inclusive Design Meetup

Have things really changed?

This website best visited by able people.

What is Web Accessibility?

Web accessibility refers to the inclusive practice of removing barriers that prevent interaction with, or access to websites, by people with disabilities.

Disability Types• Visual

• Auditory

• Motor / Dexterity

• Cognitive

• Seizure / Vestibular

The “curb cuts” principle is that removing a barrier for persons with disabilities improves the situation for everybody.

Assistive Technology“Assistive technology promotes greater independence by enabling people to perform tasks that they were formerly unable to accomplish, or had great difficulty accomplishing, by providing enhancements to, or changing methods of interacting with, the technology needed to accomplish such tasks.”

Examples of Assistive Technology• Screen Reader • Screen Magnifier • Refreshable Braille

displays • Voice Recognition

Software • Mouth Stick

• Sip-and-Puff • Switch • Hearing Aids • Glasses /

Contact Lenses

An Accessible Website• Perceivable

• Operable

• Understandable

• Robust Web Content Accessibility Guidelines (WCAG) 2.0

<Workshop>

<Review>

<Demo>

Progressive Enhancement

Progressive Enhancement

Accessibility Low Hanging Fruit (80/20 rule)

• Page Headings / Semantic Order (h1, h2, h3…)

• Alternative Text (<img alt=“”>)

• Color - Contrast (Is this readable?) & Sole meaning

• Form Fields / Labels

• Focus Indicator

• Descriptive Link Text (not “Read more”)

• Table Header/Date Relationships

• Proximity (Form labels immediately above fields)

ARIA• Rule #1: Don’t use ARIA.

• Ok, use it, but only when “necessary.”

• When the default markup or custom control does not have sufficient semantics.

• Don’t duplicate semantic meaning (ex. <button role=“button”>)

• Instead of giving a non-semantic element meaning via ARIA, consider using an existing element with that meaning.

Accessibility Compliance !===

Usability / Great User Experience

–Judy Hueman

“For people without disabilities, technology makes things convenient. For people with disabilities, technology makes things possible”

Questions?

meetup.com/a11ychi

twitter.com/a11ychi

facebook.com/a11ychi

Chicago Web Accessibility &Inclusive Design Meetup