 Accessibility & Information Architecture Presented by Liz Molleur INF385E April 5 th, 2009

What is Accessibility?  “Web accessibility means that people with disabilities canperceive, understand, navigate, and interact with the Web,and that they can contribute to the Web.” – W3C: WebAccessibility Initiative  “Web accessibility is about making your website accessibleto all Internet users (both disabled and non-disabled),regardless of what browsing technology they're using.” –Webcredible.com

Who needs to do this?  All covered entities must be ADA compliant in providing effectivecommunication unless doing so creates an undue burden.  State and Local Governments & Places of Public Accommodation   Government entities receiving Federal Funding - RehabilitationAct of 1973  Anyone wanting to make their site more usable and accessible toa larger population.

Who Benefits…  Visual Disabilities  Hearing Impairments  Physical Disabilities  Speech Disabilities  Cognitive and Neurological Disabilities  Multiple Disabilities  Aging-related Conditions  Users of older technology  Users with slower Internet connections  You!

Information Architecture & Accessibility  (a) Text Tags  (b) Multimedia Presentations  (c) Color  (d) Readability  (e) Server-Side Image Maps  (f) Client-Side Image Maps  (g)&(h) Data Tables  (i) Frames  (j) Flicker Rate  (k) Text-Only Alternative  (l) Scripts  (m) Applets and Plug-Ins  (n) Electronic Forms  (o) Navigation Links  (p) Time Delays Web-based Intranet and Internet Information and Applications ( ) - (e)

Text Tags for Non-Text Elements  Navigation Actions  Images with content  Audio Clips  Video Clips  Good for screen readers and crawlers HTML Source Code:

Multimedia Presentations Provide captioning for audio portions of site Sync captioning with video to retain full value

ColorColor “Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup.” - Web-based Intranet and Internet Information and Applications ( ) About 7% of the male population in the US is affected by color blindness. - Howard Hughes Medical Institute, 2006

 Readability  Style Sheets can help clean up HTML making the page more compatible with screen readers and easier to navigate  Recommend using CSS when possible  Keep page layout consistent and organized  Keep text appropriate to your audience   Do not over-ride user defined style sheets

Image Maps Client-Side  Allows the author to assign text to different “hot spots” on the map for easy navigation with a screen reader  Preferred over server-side image maps for accessibility Server-Side  Use redundant text links for each active region for navigation without a mouse  Only use when regions can not be defined with an available geometric shape

Making Tables Accessible  Identify headers for columns and rows  Associate data cells with row and column headers  Use the Scope Attribute  Add a summary  Can make the table more useful but does not replace the need for cell association with headers

Frames  Include Text in the body of the frame to identify the contents  Provide Titles for Navigation and Identification   Not supported by all assistive technology yet  Provide a “No Frames” link

Frequency of Flicker  “Pages shall be designed to avoid causingthe screen to flicker with a frequencygreater than 2 Hz and lower than 55 Hz.” Text Only Pages  Equivalent information and functionality  Updated with the primary page  Option to meet other compliance needs

Scripting Language  Information provided by script must also appear in functional text  Label all images with “alt” attribute  Label images with “title” attribute  Not yet supported for all assistive technologies  Status lines  Can be replaced with an event handler  This information must also be reflected in the “alt” attribute

Applications Applets & Plug-ins  Link to a complaint application  Responsibility of the author to do this research before requiring the use of a plug- in  Provide alternative content  Important for users with disabilities as well as those with slower connections

Online Forms  Need to allow people using assistive technology to access the information, field elements, and functionality required for completion and submission of the form  Includes all directions and cues  Use associative labels adjacent to input fields or use an “Explicit Label” tag Explicit Label Tag FIRST NAME: Implicit Label Tag FIRST NAME:

 Skip Navigation Links  Offer users the chance to skip repetitive navigation menus  Should be Visible at the top of the page  Option of making the link invisible until a user tabs to the space

Time Prompt users when time limit is almost expired Allow option for extended time Allow adequate time for users to indicate when additional time is required

Testing Your Work  Check the Validity of your site  accessibility/basics.shtml accessibility/basics.shtml  Test with users  Use Accessibility Checking Software   Not a replacement for Human Testing

Make a Plan  Establish a policy and create a process for implementation.  Ensure that all new and modified web pages and content are accessible.  Develop a plan for making your existing web content more accessible. Consider making the more popular web pages a priority.  Train staff and contractors responsible for web page and content development.  Provide a way for visitors to request accessible information or services by posting contact information on your home page.  Periodically enlist disability groups to test your work.

Resources W3C Web Accessibility Initiative - Guide to the Section 508 Standards for Electronic and Information Technology ( ) – Webcredible: User experience research & design – WebAIM: Web Accessibility in Mind – Accessibility of State and Local Government Websites to People with Disabilities – Questions?