JAN is a service of the U.S. Department of Labors Office of Disability Employment Policy. 1 Your...

JAN is a service of the U.S. Department of Labor’s Office of Disability Employment Policy.

1

Your Website into Shape

Beth Loy, Ph.D., Principal Consultant

Linda Carter Batiste, J.D., Principal Consultant

Work As Your Partner: Accessible Videos Accessible Documents Accessible Webcasts/Webinars Accessible Social Networks Accessible Online Application Systems Accessible Websites

JAN: SNAP!

2

SNAP Your Website into Shape1) Select your team,

2) No is not an answer,

3) Accept challenges, and

4) Prioritize accessibility first.

JAN: SNAP!

3

JAN: SNAP!

Overview

1. Legal Issues

2. Best Practices

3. SNAP Tool Example

4. Questions

4

Legal Issues

JAN: SNAP!

5

JAN: SNAP!

Americans with Disabilities Act

6

JAN: SNAP!

Rehabilitation Act

7

JAN: SNAP!

On the Horizon

8

Best Practices

JAN: SNAP!

9

Tip 1: Review online application systems.

Why a Human is Needed: Provide usable and understandablealternatives.

Example: Explain to people withdisabilities how they can get help using the online HR system and where to get reasonable accommodation.

JAN: SNAP!

10

Tip 2: Use text descriptions for visual material.

Why a Human is Needed: Repetitive text descriptions for nonessential visual material are unnecessary.

Example: bullets

JAN: SNAP!

11

Tip 3: Caption audio and video.

Why a Human is Needed: A determination of open, closed, and/or audio captions depends on audience, venue for distribution, and script.

Example: JAN YouTube script

JAN: SNAP!

12

Tip 4: Maintain consistent page design.

Why a Human is Needed: Headers, footers, content, and page navigation should be included in style sheets and given a skip option if applicable. Cognitive-related design elements are the most often overlooked.

Example: dropdowns/footers

JAN: SNAP!

13

JAN: SNAP!

14

Tip 5: Minimize reliance on color.

Why a Human is Needed: Computer generated testers show visually what sites will look like.

Example: red/green and blue/yellow

JAN: SNAP!

15

Website Testing Tools for Color Color Laboratory

HTML Writers Guild's AWARE (Accessible Web Authoring Resources and Education) Center

http://wickline.org/ref/colorlab/

Colorblind Design Evaluation WebAIM at Center for Persons with Disabilities, USU http://newmanservices.com/colorblind/default.asp

Plug-ins available for Photoshop to simulate color deficiency

JAN: SNAP!

16

Tip 6: Allow keyboard navigation.

Why a Human is Needed: Usability tests can ensure tab order fits the user’s needs.

Example: Built-in tab order may need overridden.

JAN: SNAP!

Tip 7: Program items with audio, video, and motion elements with controls.

Why a Human is Needed: Stop, go, pause, and volume elements are tested “hands-on.”

Example: Skins may not accurately indicate ability to control elements.

JAN: SNAP!

Tip 8: Program the default human language of each page.

Why a Human is Needed: The need to analyze accurate content to a user is a judgment call.

Example: Use assistive technologiessuch as Braille translators and screen reading software.

JAN: SNAP!

Tip 9: Provide users with accessible documents.

Why a Human is Needed: To fully test documents for accessibility, they need to beaccessed and reviewed for logical order.

Example: Use free screen readingsoftware to review documents.

JAN: SNAP!

Tip 10: Evaluate the Website.

Why a Human is Needed: Automatic checking is not asubstitute for manually testing a Website for accessibility.

Example: Use tools to test with multiple versions of browsers.

JAN: SNAP!

Tool

JAN: SNAP!

green (fully accessible) yellow (partially accessible) red (inaccessible) flags not applicable (NA)   

STEP # RESULT DESCRIPTION RELEVANCESTEPS FOR ANALYSIS

JAN: SNAP!

1 GREENDoes the site allow navigation with a screen reader?

JAN: SNAP!

2 GREENDoes the site provide text alternatives for all non-text content?

JAN: SNAP!

3RED

NOTE: No captioning/audio description found

Does the site provide accessible multimedia (audio/visual (A/V) or alternatives) that allow users to understand the content?

JAN: SNAP!

4 GREEN

Does the site use other means of conveying information besides color?

JAN: SNAP!

5 GREEN

Does the site allow users to lower the volume or completely turn off any background audio content?

JAN: SNAP!

6 GREEN

Does the site allow navigation by a user who does not use a mouse?

7 GREENDoes the site provide users with enough time to read, understand, and interact with online content?

8 GREENDoes the site avoid content that flashes or blinks too quickly?

JAN: SNAP!

9 GREENDoes the site allow the default human language of each page to be programmatically determined?

JAN: SNAP!

10 GREENDoes the site present content in an organized manner that avoids unexplained changes in context?

11 GREENDoes the site help users avoid and correct mistakes?

JAN: SNAP!

12 GREENDoes the site allow users to skip repetitive content?

13 GREENDoes the site provide fully accessible PDFs, PowerPoint documents, and online forms?

JAN: SNAP!

14RED

NOTE: Not found

Does the site display the company’s equal employment opportunity (EEO) policy statement?

15RED

NOTE: Not found

Does the site explain to people with disabilities how they can get help using it and where to get reasonable accommodation if they cannot apply online?

JAN: SNAP!

Welcome to the Hiring Center

Please read the following statement carefully:

XXXXX offers reasonable accommodation in the employment process for individuals with disabilities. If you need assistance in the application or hiring process to accommodate a disability, you may request an accommodation at any time. Please contact any member of management at your nearest XXXXX facility.

XXXXX is an Equal Opportunity Employer- By Choice.

JAN: SNAP!

JAN: SNAP!

XXXXX

Website Testing Tools Functional Accessibility Evaluator

University of Illinois at Urbana-Champaign http://fae.cita.uiuc.edu/

JAN: SNAP!

Website Testing Tools WAVE

WebAIM at Center for Persons with Disabilities, USU http://wave.webaim.org/

JAN: SNAP!

Website Testing Tools Cynthia Says

Education and Outreach project of HiSoftware, International Center for Disability Resources on the Internet, and the Internet Society Disability and Special Needs Chapter 

http://www.cynthiasays.com/

JAN: SNAP!

Website Testing Tools TAW (Spanish)

Center for Development of Information and Communication Technology (Headquarters of the Spanish W3C)

http://www.tawdis.net/

JAN: SNAP!

SNAP Your Website into Shape1) Select your team,

2) No is not an answer,

3) Accept challenges, and

4) Prioritize accessibility first.

JAN: SNAP!

40

Questions

41

JAN: SNAP!

Contact (800)526-7234 (V) & (877)781-9403 (TTY) AskJAN.org & jan@askjan.org

42

JAN: SNAP!