Transcript Master Title Goes on These Lines

Functional Accessibility Evaluation
of Web 2.0 Applications Testing
Jon Gunderson, Ph.D
University of Illinois
What is Web 2.0
•
•
•
•
URL does not define content: Login
Content updates with out user interaction: Chat
Content changes based on user actions: wiki
Non-html controls for interacting with page
Illinois Web 2.0 Examples
• University create web services
• Calendars
• Surveys
• Forms
• Purchased Services
•
•
•
•
Blackboard: Course management tools
Xythos: Document sharing via the web
Confluence: Wiki
Mirapoint: Web e-mail interface
Web 2.0 Widgets and Dynamic
Content
• Javascript, HTML and CSS to create user interface
controls
• Keyboard support
• Roles
• Tree, slider, menu….
• Properties
• Labels, description, level, ….
• States
• Checked, disabled, invalid, ….
Best Practices
• Navigation and Orientation
http://html.cita.illinois.edu/nav/
• Text Equivalents
http://html.cita.illinois.edu/text/
• Scripting and Automation
http://html.cita.illinois.edu/script/
• Styling
http://html.cita.illinois.edu/style/
• Standards
http://html.cita.illinois.edu/standards/
Navigation and Orientation
•
•
•
•
•
•
•
•
•
Titling
Menus
Sub Headings
Form Labeling
Links
Data Tables
Lists
Language
Frames
Text Equivalents
• Informative images
•
•
•
•
Charts
Tables
Pictures
Graphs
• Decorative images
• Status images
Scripting
•
•
•
•
•
Adding styling effects to hover content
Adding Content when loading page
Adding/updating content based on user input
Client side validation of form fields
Widgets
Styling
• Use of CSS
• Text styling
• Layout of content
• Background images
• Layout and linearization
• Keyboard focus styling
• Interoperability with mobile web technologies
Free Best Practices Tools
• Illinois Functional Accessibility Evaluator
http://fae.cita.illinois.edu
• Illinois Firefox Accessibility Extension
https://addons.mozilla.org/en-US/firefox/addon/5809
Demonstration of Free Tools
Web 2.0 Issues
• Keyboard support
• Links and controls
• Widgets
• Focus management
• Navigation
• Sections
• Navigation bars
• Dynamic Content
• Content updated by user action
• Content updated by external events
Widgets
• Keyboard Navigation Best Practices
http://dev.aol.com/dhtml_style_guide
• Accessible Rich Internet Application (ARIA) Markup
http://www.w3.org/TR/wai-aria
• WAI ARIA Best Practices
http://www.w3.org/TR/wai-aria-practices/
• Example Accessible Widgets
http://test.cita.illinois.edu/aria/
http://wiki.codetalks.org/wiki/index.php/Set_of_ARIA_Test_Cases
Explore Accessibility of Web Widget
• Tree Widget
http://test.cita.illinois.edu/aria/tree/tree1.php
Explore Accessibility of Web
Application
Thank You!
Thank you for attending this session at ATIA 2009
Chicago! Watch for us in Orlando this January!
Please help us improve the quality of our conference by
completing your session evaluation form.
Completed evaluation forms should be submitted as you
exit or to staff at the registration desk.