Developing an Accessible Web

April 30, 2008 Developing an Accessible Webs

Developing an Accessible Web

Arnold [email protected]


Contents

Importance of accessible webs Overview of assistive technology (AT) Demonstration of AT web interaction Accessible web page examples Guidelines for good web design Summary


Scope of Disabilities

20% of the population have a disability. 1 in 10 people have a

severe disability. 1 in2 persons over 65 have

reduced capabilities 10 million Blind or Visually

Impaired 1.5 million without sight


Ethical “In accordance with right”

Aids employment opportunity 70% unemployment rate for blind/vi The technology is there and inexpensive.

Enhances the Quality of Life: Information (news, transportation) Communication (Email, groups, networking) Education and Training


Legal

Federal American for Disabilities Act (ADA) Section 504.

Section 508 for companies dealing with the federal and many state agencies.

State “section 508” laws that are eminent.


Professional (Programming)

Accessibility requires Good coding practices A degree of proficiency in the language

Developers with program accessibility expertise are in demand.

D.I.R.T.F.T.S.(Develop It Right The First Time, Stupid!)


Assitive Software

Screen Readers JAWS(IE), Windows Eyes(IE), Orca(Linux) Voice Over(Mac), Narrator(Vista) Systems Access(IE), IBM WATS(IE)

Magnifiers (XP, ZoomText,MAC) Voice Recognition (Dragon Natural,Vista,

MS Word)


Assistive Technology

Braille note-taking Scanner/OCR software Refreshable braille displays Braille translation software Braille embossers

http://www.blind411.org/ITinit/assistive.htm

http://www.blind411.org/ITinit/assistive.htm


Screen Reader Demo

“System Access To Go” by Serotek, Inc.

(5 minute snippet to demonstrate a screen reader)


An Accessible Page


HTML Guidelines

Informative Title Use ALT tag on

images Use Skip Navigation Navigation Using

Lists Highlight Link Prefer CSS vs

Tables Use Heading Levels

Contrast No Fixed Font Size Audio alternative For Tables use % if

you have to. Keystroke Shortcuts

possible conflict “Back to ..” links


An Accessible Form


HTML Form Guidelines

Do use Label on Forms meaningful Text error messages a “Submit/Go” button

Don’t use Flash to create a form.


Macromedia Flash Issues


Macromedia Flash

Don’t use navigation within the object.

Do use accessibility functions of the development

tool to externalize to the screen reader: Text Image descriptions

Doctype to describe the object.


Testing

Disable CSS. Check basic function. Disable Javascript. Check basic

function. Get a person who uses a screen reader.


Web Accessibility Guidelines

World Wide Web Consortium W3C Web Accessibility Guidelines (WAG) W3C WAI ARIA – Accessible Rich Internet

Applications Objects and Widgets Flash, Ajax,J avascript, Web 2.0 HTML 5 Draft


Accessible Rich Internet Applications

Problem: Javascript poses a problem to screen

readers. It can change page contents and focus without the screen reader knowledge.

AJAX (An RIA) uses Javascript extensively. Future:

WAI-ARIA, Web 2.0 and HTML 5 address the problem. It’s a cooperative effort between developers and screen reading software.


Summary

1. Conform to standards2. Understand the intent of the guidelines

Awareness of accessibility is important.3. Use good coding practices4. Then use common sense, conscience

and professional ethics balancing with business needs.