Web Site Accessibility

1. Mike Barlow Lead Application Architect - dbITpro Web Site Accessibility TCF Information Technology Professional Conference 2012

2. Why is Accessibility Important? • Up to 20% of people are affected by some form of disability • A significant portion of people with disabilities can benefit from web sites specifically designed to be more accessible  • In the US alone, there are currently estimated 52 million who have cognitive, visual, hearing or physical disabilities which affect their ability to use computers and the Internet

3. What is Web Site Accessibility? • Making the web usable by everyone whatever their ability or disability  • A Web Site is accessible if it can be used as effectively by people with disabilities as by those without • A properly designed Web Site should be accessible to all no matter what their disability

4. What types of disability? • Visual Impairments • Color Perceptions • Visual Acuteness • Motor/Mobility Impairments • Inability to use the hands • Tremors • Muscle slowness • Auditory Impairments • Deafness

5. What types of disability? • Seizures • Photo epileptic seizures • Cognitive Impairments • Developmental disabilities • Learning disabilities • Cognitive disabilities

6. So What? • Web Accessibility and “So What” • What does it mean

7. Assistive Technology • Different meanings in different aspects • Augmentative Communication • Hearing Aids • Wheel Chairs • Prosthetics

8. Assistive Technology • Assistive Technology for access to information • Screen Readers • JAWS • Window Eyes • Voice Over • Braille Displays • Pointing Devices • Alternative Keyboards • Speech Recognition

9. Equal Access

10. Why is Accessibility Important? • Increasing accessibility will: • Increase sales • Increase audience reach • Improve search engine listings • Ensure your site complies with disability discrimination law

11. Discrimination? • Employment discrimination, lack of access to education materials, reading • Paying higher prices (online stores) • Lack of access to social communities – accessing twitter/facebook/IM to find out about updates and friends/family. • Inability to access information on preparing for emergencies

12. Discrimination – So What? • Department of Transportation Regulation Issued in 2008 • Allowing that Airlines are NOT required to provide Accessible Websites. • HOWEVER… • If the Website is NOT Accessible they MUST give you the price of the flight available on the Website at the time of the call. • No Call Center Fee charged.

13. Discrimination – So What? • UUL Studies identified several Airlines which would not comply with the regulation even when they were informed of the regulation! • Would not provide the lower fee (it was 1/3 less) • Would not waive the Call Center Fee

14. Discrimination – So What? • Similar studies were performed on Employment Discrimination • Online Employment Applications • 32 Attempted Application Submissions • 24 Submitted • 9 Without assistance by non disabled users • ~ 28% Success Rate

15. Disability Discrimination Law? • Over the years many companies have been litigated against and have had rulings made against them • 2000 Applicability of the ADA to Private Internet Sites • http://commdocs.house.gov/committees/judiciary/hju65010.000/hju65010_0f.htm

16. Disability Discrimination Law? • April 2010 Achieving ADA in the Digital Age • http://judiciary.house.gov/hearings/printers/111th/111-95_56070.PDF • http://judiciary.house.gov/hearings/pdf/Richert100422.pdf • 2004 Spitzer vs Ramada.com and Priceline.com

17. Disability Discrimination Law? • 2004 Gumson and Access Now vs. Southwest Airlines http://caselaw.lp.findlaw.com/data2/circs/11th/0216163p.pdf • 2008 National Federation of the Blind (NFB) vs Target http://webaim.org/blog/target-lawsuit-settled

18. Disability Discrimination Law? • Target developed their “Online Assistive Technology Guidelines” and was certified by NFB as compliant with these guidelines • Target paid NFB $90,000 for the certification and first year of monitoring and then $40,000 per year thereafter • Target’s web developers received at least one day of accessibility training • Target paid damages of $6,000,000 to the class action claimants • Target paid $20,000 to the California Center for the Blind

19. Disability Discrimination Law? • More articles are available on the “WebAIM – Web Accessibility in Mind” site • http://www.webaim.org/articles/laws/usa/idea.php

20. What does it mean? • Guidelines • Section 508 • of the Rehabilitation Act of 1973 • http://www.section508.gov/ • Guidelines have not been updated since 1999 • Dec 2011 – Draft of new Standards • http://www.access-board.gov/sec508/refresh/draft-rule.htm

21. What does it mean? • Guidelines • Web Content Accessibility Guidelines • World Wide Web Consortium (aka W3C) • http://www.w3.org/ • http://www.w3.org/WAI/ • Accessible Rich Internet Applications (WAI-ARIA) • http://www.w3.org/TR/wai-aria/

22. Section 508 • Section 508 is a part of the Rehabilitation Act of 1973 relating to accessibility standards applied to Electronic Information Technology (EIT) used by the Federal government • Lists 16 separate items which must be met to be in compliance • http://www.section508.gov/ • http://www.webaim.org/standards/508/checklist

23. 508 Checklist (Cont.) • Text equivalents for non-text elements • Equivalent alternatives for any multimedia presentation • Don't rely only on color to indicate differences • Must be usable without stylesheets • Client-side and server-side image maps • Identify row and column headers for data tables

24. 508 Checklist (Cont.) • Title frames to facilitate identification and navigation • Avoid screen changes on pages between 2Hz and 55 Hz • Use text only pages when necessary • Provide text notification when using scripting languages • Provide a link to any applet/plug-in/application required

25. 508 Checklist (Cont.) • Design forms which can be used by assistive technology • Skip repetitive navigation links • Provide alternatives for timed responses

26. 508 Checklist (Script) • Allow for keyboard only usage • Do not disrupt/disable accessibility features • Clearly identify the current on screen focus • Provide information about UI elements to AT (Assistive Technology)

27. 508 Checklist (Cont.) • Consistency for use of images as controls • Do not override user selected contrast and color selections • Allow for non animated versions of animated objects • No flashing/blinking text

28. Additional Standards • W3C’s Web Accessibility Initiativehttp://www.w3.org/WAI/ • Web Content Accessibility Guidelineshttp://www.w3.org/WAI/intro/wcag

29. Web Content Accessibility • Principles • Perceivable • Operable • Understandable • Robust • Guidelines • Success Criteria • Sufficient and Advisory Techniques

30. Perceivable Information and user interface components must be presentable to users in ways they can perceive. Guideline - Text Alternatives: Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language. Technique – <imgsrc=“Logo.gif” alt=“Corporate Logo” />

31. Operable User interface components and navigation must be operable. Guideline - Keyboard Accessible: Make all functionality available from a keyboard Technique – <button accesskey=“s” tabindex=“3”> <u>S</u>ave </button>

32. Understandable Information and the operation of user interface must be understandable. Guideline - Readable: Make text content readable and understandable. Technique – <acronym title="North Atlantic Treaty Organization"> NATO</acronym> <abbr title="Cascading Style Sheets" >CSS</abbr>

33. Robust Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies. Guideline - Compatible: Maximize compatibility with current and future user agents, including assistive technologies (Semantic Web Site) Technique – <h1>My Page Heading</h1>

34. Real World Accessibility • In the last 10 years, on average, 10%-20% of Federal Websites examined are in compliance with Section 508 • Universal Usability Laboratory – • Evaluated 100 Federal Homepages

35. Real World Accessibility • Out of 100 Federal Homepages • Human Inspection • 96% Violated Section 508 • Automated Tools Inspection • 92% Violated Section 508

36. Real World Accessibility • Of the 100 Federal web sites examined • 58% - Have an accessibility statement • 42% - Say they are “508 compliant” • 22% - Statement describing accessibility features • 3% - Statement describing tools used to test for accessibility • 2% - Describe process used to develop or ensure accessibility compliance • 2% - Describe how often the site is checked for compliance

40. Real World Accessibility <ul> <li> <a href="#" >1</a> <div style="display: none; "> <h3>West Wing Week</h3> <imgsrc="/www_hero_fixed123.jpg“ alt="West Wing Week“ title="West Wing Week"> </div> </li>

41. Real World Accessibility <ul> <li> <a href="#" title="West Wing Week">1</a> <div style="display: none; "> <h3>West Wing Week</h3> <imgsrc="/www_hero_fixed123.jpg“ alt="West Wing Week“ title="West Wing Week"> </div> </li>

42. Is My Site Accessible? Validators • Web Accessibility Evaluation Tool • http://wave.webaim.org • WAVE Toolbar for Firefox • http://wave.webaim.org/toolbar • Web Developer Extension • http://chrispederick.com/work/web-developer • Total Validator • http://www.totalvalidator.com/index.html

43. Is My Site Accessible? • 508 Toolbar (for M.S. I-E) • http://www.rampweb.com/Accessibility_Resources/Section508/download.asp

44. Making a Web Site Accessible • 508 Checklist • http://www.webaim.org/standards/508/checklist • Best Practice Example Code • http://www.section508.gov/SSA_BestPractices/default.htm • Color Contrast Checker • http://www.webaim.org/resources/contrastchecker • Navigation Skipper aid • http://www.webaim.org/techniques/skipnav

45. Making a Web Site Accessible • Web Accessibility Initiative • http://www.w3.org/WAI/ • WCAG20 Quickref • http://www.w3.org/WAI/WCAG20/quickref • WCAG - Techniques • http://www.w3.org/TR/WCAG20-TECHS • WCAG - Guidelines • http://www.w3.org/TR/WCAG20

46. Making a Web Site Accessible • Building Web Sites Using Web Standards • http://msdn.microsoft.com/en-us/library/aa479043.aspx • Accessibility Support in ASP.NET • http://msdn.microsoft.com/en-us/library/ms228004(VS.80).aspx • Creating an Accessible Web App • http://msdn.microsoft.com/en-us/library/3has1x30(VS.80).aspx

47. Making a Web Site Accessible • Check Accessibility of Web Pages(using Visual Web Developer) • http://msdn.microsoft.com/en-us/library/ms247244(VS.80).aspx • ASP.NET Controls and Accessibility • http://msdn.microsoft.com/en-us/library/ms227996(VS.80).aspx

48. Good Reading • Web Accessibility In Mind • http://www.webaim.org • http://www.webaim.org/articles • Accessibility Myths • http://htmlhelp.com/design/accessibility/myths.html • http://www.techsoup.org/learningcenter/access/archives/page9994.cfm • http://www.webcredible.co.uk/user-friendly-resources/web-accessibility/myths.shtml • http://www.csszengarden.com/

49. Compliance Testing • Just because a site passes accessibility checks does NOT mean the page is useable • The only true test is the user test • Having an individual whose primary vehicle for accessing the internet and websites with their screen reader is the best and most accurate test available • Usability is the goal and usability by the user is the ultimate test

50. Accessibility is NOT Expensive • Hire a proper front end developer • Start from Scratch • Clean Compliant Code • Ease of Maintenance • Better for SEO • Avoid Legal Issues