University of Michigan

Accessibility Testing Newsletter > 10.26.2012

All Newsletters

The Accessibility Testing Newsletter is a twice-monthly publication (second and fourth Fridays) intended to supplement training provided through the Accessible Apps project. It will contain information of use to both programmers and non-programmers. The Newsletter is sent automatically to AIS staff, and to other U-M personnel by request. Please send comments or questions to Jane Vincent, Assistive Technology Lead, jbvincen@umich.edu.

Thanks to Gonzalo Silverio for his feedback on the last issue.

Refresher: What Screen Readers Do

Most current computer operating systems and websites are highly visual in nature. In addition, standard strategies for pointer movement require hand-eye coordination. Therefore, blind computer users need an accommodation solution that both transforms onscreen information into an alternative format and substitutes for the mouse.

Screen reader software provides this solution in two ways:

Commonly-used screen readers include the following:

A useful demonstration of screen reader use, "Introduction to the Screen Reader," is available on YouTube.

Coming up in our 11/9 issue: a Refresher on factors that make web pages compatible or incompatible with screen readers.

Problem of the Week

When I was using AChecker to review the U-M home page, it told me that there was insufficient color contrast between the blue text and maize background shown below...

Quick Links text with insufficient color contrast.

I can understand staying away from other color combinations, but this one is pretty important at U-M. What can I do?

Answer: Colors are often expressed using hexadecimal code, a string of six base-12 numbers varying from #000000 (black) to #FFFFFF (white). According to the U-M Identity Guidelines, the appropriate hexadecimal code for maize is #FFCC33 and the appropriate code for blue is #000066, as in the following example...

Sample text using maize and blue colors which pass the color contrast standard.

Fortunately, this combination easily passes the color contrast standard. As long as you stick to the identity guidelines, accessibility will be addressed as well.

Answer to 10/12 Quiz Question:

Question: "Skip-nav" links are used to allow non-mouse users to bypass long lists of static links (e.g., navigation links on the left hand side of the page, or pulldown menus) and go right to the page's main content. "Long" is often defined as a total of 4 or more links in one or more groups that precede the main content.

"While you're testing the following page, you notice that it doesn't have a skip-nav link. Does it need one...

Michigan Online Giving Page with two groups of three links each

Answer: Between the top of the page and the main content, there are seven static links in two different groups: 'Join Us - Sign Up,' 'Log In,' "Email us anytime >>," "Questions? Visit our FAQ page >>," 'Search Funds,' 'My Pledges and Gifts,' and 'My Profile.' Therefore, adding a skip-nav link will make this page more efficient to navigate for screen reader and sighted keyboard-only users.

10/26 Quiz Question: Carousels

Web Content Accessibility Guideline (WCAG) Success Criteria 2.2.2 states 'For any moving, blinking or scrolling information that (1) starts automatically, (2) lasts more than five seconds, and (3) is presented in parallel with other content, there is a mechanism for the user to pause, stop, or hide it unless the movement, blinking, or scrolling is part of an activity where it is essential...' This criteria is tremendously helpful to assistive technology users, as well as to individuals with attention deficit disorder (ADD).

The news carousels now included on many sites are a type of 'moving, blinking, or scrolling information.' For example, here's a carousel from the U-M home page...

Carousel with large picture on the top and thumbnails of other options on the bottom.

This carousel has the following features:

Does this carousel meet WCAG Success Criteria 2.2.2?

Adapted from an essay by Scott Williams
The answer, and a new Quiz question, will be in the 11/9 issue.

Evaluation Tool Tip: AChecker

AChecker is an automated checker that provides feedback about HTML code that doesn't meet accessibility standards. The program is browser-based and free to use.

There are two ways to access AChecker:

Coming up in our 11/9 issue: New features in the WAVE automated checker.

For the Accessible Apps team:
Pam Fons, Scott Williams, Jane Vincent