web accessibility for section 508

28

Upload: yivincent-cao

Post on 06-May-2015

370 views

Category:

Education


2 download

TRANSCRIPT

Page 1: Web accessibility for section 508
Page 2: Web accessibility for section 508

What is Section 508 ?

2

• Section 508 is an Amendment to the Workforce Rehabilitation Act of 1973, signed into law by President Clinton in 1998

• Section 508 requires information technology that is developed or purchased by the Federal Agencies be Accessible by people with disabilities

Page 3: Web accessibility for section 508

54 million Americans has a disability, that’s 10% of the population (2000 U.S. Census)

Among them

• 10 million Americans are Vision impaired

• 20 million Americans are Hearing impaired

Why Accessible is important

3

Page 4: Web accessibility for section 508

• Learning disabilities 45.7%• Mobility impairments 13.9%• Health impairments 11.6%• Mental illness 7.8%• Hearing impairments 5.6%• Vision impairments 4.4%• Speech impairments 0.9%

Disability Types

4

Page 5: Web accessibility for section 508

• Learning disabilities 45.7%• Mobility impairments 13.9%• Health impairments 11.6%• Mental illness 7.8%• Hearing impairments 5.6%• Vision impairments 4.4%• Speech impairments 0.9%

Disability affect surf Web

5

Page 6: Web accessibility for section 508

• Learning disabilities 45.7%• Mobility impairments 13.9%• Health impairments 11.6%• Mental illness 7.8%• Hearing impairments 5.6%• Vision impairments 4.4%• Speech impairments 0.9%

Disability affect surf Web

6

Page 7: Web accessibility for section 508

Vision Impaired

7

Page 8: Web accessibility for section 508

Vision Impaired -Legally Blind

8

Page 9: Web accessibility for section 508

Vision Impaired -Color Blind

9

Page 10: Web accessibility for section 508

Vision Impaired -Color Blind 1

10

Page 11: Web accessibility for section 508

Vision Impaired -Color Blind 2

11

Page 12: Web accessibility for section 508

How do they surf Web

12

• Can’t see the Screen clearly

• Can’t use the Mouse/Pointer system well

• Can use Keyboard

• Can hear Audio

Page 13: Web accessibility for section 508

How do we design for them

• Section 508 Guideline

• Web Accessibility Initiative Guideline

• IBM , Microsoft able-Guideline

• Do usability testing with them

13

Page 14: Web accessibility for section 508

How do we design for them

• Section 508 Guideline (16 for web)

• Web Accessibility Initiative Guideline

• IBM , Microsoft able-Guideline

• Do usability testing with them

14

Page 15: Web accessibility for section 508

Section 508 Guideline - 1

Section 508 - §1194.22 (a)“A text equivalent for every non-text element shall be provided.”

15

Page 16: Web accessibility for section 508

Section 508 Guideline - 1

1 <img alt => is required for all images

when image is Active (link, button) or Conveys information

16

Page 17: Web accessibility for section 508

Section 508 Guideline - 1

1 <img alt => is required for all images

when image is Active (link, button) or Conveys information

17

Page 18: Web accessibility for section 508

Section 508 Guideline - 1

2 Use “longdesc” for Explanation provide more content ,like data chart

18

Page 19: Web accessibility for section 508

Section 508 Guideline - 1

2 Use “longdesc” for Explanationprovide more content ,like data chart

19

Page 20: Web accessibility for section 508

Section 508 Guideline - 2

Section 508 -§1194.22 (n)“Electronic form shall allow people using assistive technology to access the field elements, and submission of the form, including all directions and cues.”

20

Page 21: Web accessibility for section 508

Section 508 Guideline - 2

1 Use <label for=>, position prompts Label close to Text Fields

21

Page 22: Web accessibility for section 508

Section 508 Guideline - 2

2 If the Button has text, use that text for the <img alt=> attribute

22

Page 23: Web accessibility for section 508

Section 508 Guideline - 2

2 If the Button has text, use that text for the <img alt=> attribute

23

Page 24: Web accessibility for section 508

Section 508 Guideline - 2

2 If the button has text, use that text for the <img alt=> attribute

24

Page 25: Web accessibility for section 508

Section 508 Guideline - 2

2 If the button has text, use that text for the <img alt=> attribute

25

V.S.

Page 26: Web accessibility for section 508

Section 508 Guideline - 2

2 If the button has text, use that text for the <img alt=> attribute

26

V.S. = $6 million

Page 27: Web accessibility for section 508

1 Web Accessibility is Important

27

2 Design with Accessibility in mind

Take home

Page 28: Web accessibility for section 508

Thank you !

28

Yi Cao [email protected]