Half Day Tutorial Details

Download: Schedule of Events (PDF) subject to change
By Day - Selected
By Presenter
By Track
View My Agenda

How to Test for Web Accessibility and Universal Usability

Hands-on, applied, working session for experienced UX and UI practitioners who want learn more about testing Web pages for universal usability.

As the population ages, technology changes, laws change, our users becomes more diverse, and optimizing for search engines and language switchers becomes increasingly critical, understanding accessibility – or rather universal usability – also becomes an increasingly important skill for UX/UI practitioners. This is a hands-on tutorial on testing for universal usability.

Half Day Tutorial by Ann Chadwick-Dias (Fidelity Investments), Marguerite Bergel (Fidelity Investments)
6:00pm to 9:00pm on Tuesday, June 21, 2011

About the Half Day Tutorial

Session Outline Introduction and Overview We will introduce ourselves, our roles within our organization, and what we do every day at our company in these roles. Participants will also introduce themselves.

Understanding Universal Usability and Accessibility We will discuss some case studies that demonstrate how universal usability (a single solution for all users) has succeeded at our company. We will likely show some video clips of user sessions demonstrating these points. We will also briefly discuss accessibility standards, including our own internal ones. Basic standards will (mostly) be covered in the process of testing Web pages throughout the day. But rather than considering standards in detail, we will focus on the high-level principles of accessibility that will help participants remember the key things to test for when evaluating different types of web content, functionality, and technology.

Understanding the Tools of the Trade We will demo and discuss the following tools (subject to change, as new tools are being developed continuously). We will use most of these tools during the course of the day.

• Paciello’s Web Accessibility Toolbar (WAT)

• WebAim’s WAVE Toolbar

• Other Firefox extensions/toolbars (web developer, juicy studio, web accessibility).

• Screen Readers (JAWS, System Access to Go, NDVA)

• Mobile Device Simulator

• Our Custom Grown Tool (CAT)

• Enterprise-level Commercial Software packages (HiSoftware, Deque, Parasoft)

Testing Web Pages Our basic approach for most of the day will be as follows:

• Each participant will write down 1-3 publicly accessible URLs (must be from a single site) that s/he wants evaluation on an index card. These should have been submitted prior to the tutorial so that the instructors can ensure an adequate representation of pages and designs.

• We will randomly draw from the pile all day to begin evaluating sites. Depending on timing and number of participants, we will attempt to evaluate at least 1 page for every participant.

• When a participants site is drawn, s/he must be prepared to briefly (2-5mins) describe the site and its users and what s/he hopes to learn from our group evaluation.

• The trick will be to have a rich, representative set of pages to test against.

• If what the participants provide does not adequately cover each of the topics lists below, we be ready to present our own examples to ensure we cover every testing topic.

Evaluation Process We will vary the approach and tools we use to test each page. We will strictly monitor time and discussion to ensure we get through a good representation of pages.

The key for time management in this tutorial will be to cover at least 1 Web page for every participant AND ensure that we have covered all the critical topics for testing (in these representative pages).

A “basic” testing approach for each page will include testing for:

  1. Basic keyboard testing (logical tab order, focus management, etc.). This gets tricky with Ajax and Flash/Flex.

  2. Adequate contrast and proper use of color.

  3. Legibility, including text size and rendering.

  4. Search engine friendliness - page titles, meta data, descriptive links.

  5. Equivalent alt text on images.

  6. Equivalence for complex graphics.

  7. Proper semantic structure – headings, list markup, data and layout table markup.

  8. Logical code order.

  9. Links that open new windows and layers.

  10. Labeling of form controls, if applicable.

  11. Frame titles, if applicable (including iframes).

  12. Timed responses, if applicable.

  13. Audio/video content, if applicable.

  14. Other file formats (PDF, Flash, Flex).

  15. Additional Issues (equivalence versus technically accessibility, for example).