The Accessible WebImproving the universal experience

What is web accessibility?

None of these should be required on a website:● Keyboards● Mice● Monitors● Desktop computers

Interface Independence

The essence of web accessibility: content is not dependent on the tools used to access it.

Section 504: Equal Opportunities

If your web site:● Is part of your programs or services● Provides information on programs or

services● Shares documents required to register for or

get information about your programs● Then you’re subject to 504.

Section 504: Equal Opportunities

Under Section 504: you must provide alternate formats of information you share.

The ideal web site minimizes the need to create alternate formats: one web site with universal access.

Principles of Accessibility

Web Content Accessibility Guidelines 2.0http://www.w3.org/TR/WCAG20/

● Perceivable● Operable● Understandable● Robust

What does that mean?

Web accessibility is for everything on the web:

● Web sites● PDFs● .doc, .ppt, .xls, .everything else

Testing Web Sites for Accessibility

Keyboard Accessibility

● Unplug your mouse.● Hit the tab key

Can you navigate to every link? Can you tell where you are?

Testing Web Sites for Accessibility

Keyboard AccessibilityCompare these two sites:

● http://themes.joedolson.com/universal/● http://themes.joedolson.com/iatc/

Testing Web Sites for Accessibility

Form Labeling

● Has a profound impact on web site users● Is extremely easy to detect.

Testing Web Sites for Accessibility

Form Labeling Example:

Bad News

Testing Web Sites for Accessibility

Form Labeling Example:

Good News!

Testing Web Sites for Accessibility

Form LabelingCompare these two sites:

● http://dev.joedolson.com/form-bad.html● http://dev.joedolson.com/form-good.html

Testing Web Sites for Accessibility

Alternative Text

● Disable Images● Is any information missing?

What’s gone with images disabled? Is this an equal experience for the user?

Testing Web Sites for Accessibilityhttps://addons.mozilla.org/en-US/firefox/addon/image-block/

● http://www.girlandthegoat.com/

Testing Web Sites for Accessibility

Inclusive Content

It doesn’t matter how accessible your site is if you don’t have accessible content.

Testing Web Sites for Accessibility

Inclusive Content

● Accessible text content● Accessible PDFs● Accessible Audio and Video

Testing Web Sites for Accessibility

Accessible Text Content● Scannable: Use headings and bullet points.● Avoid directional text: where is “left” in a

screen reader?● Use meaningful link text: what does “Click

here” mean?

Testing Web Sites for Accessibility

Accessible PDFs● The source document must be accessible

o Alternative text for imageso Use heading structures - don’t just change fonts and

sizeso Export to PDF, don’t just print to PDF

http://webaim.org/techniques/acrobat/converting

Testing Web Sites for Accessibility

Accessible PDFs - what about scanning?

● Not accessible by default - just big images.● Use Optical Character Recognition● Edit the document to add structure

http://wac.osu.edu/pdf/scan/pdffromscan.html

Testing Web Sites for Accessibility

Inspect your PDFs:With Acrobat X

● Tools > Advanced > Accessibility > Full Check

● View > Zoom > Reflow● Tools sidebar > Action Wizard > Make

Accessible

Testing Web Sites for Accessibility

Accessible Audio & VideoTwo factors: the player and the content.● Player Accessibility● Text transcription● Closed Captioning● Audio Description

In Summary

Web accessibility is complex and subjective; but there’s still an objective difference between inaccessible and usable - you too can spot that difference.

Thank you!

Joseph Dolsonhttp://www.joedolson.com/

joe@joedolson.comhttp://twitter.com/@joedolson