UWW Accessibility testing and section 1194.22 (o)

508 Standards, Section 1194.22, (o) says that a "method shall be provided that permits users to skip repetitive navigation links. Basically, on every web page, you need to have a bookmark link that appears before any menu or navigation itmes, which allows a user to go directly to the main "content" of a page.

The 508 Accessibility testing software used at UW-Whitewater is called AccMonitor, and it test for 508 Standards, Section 1194.22, (o) by checking all of the bookmark links on a page and seeing if either the link text or the "title" attribute value is "skip navigation" and "main content." Therefore, in order to make your pages successfully pass the AccMonitor 508 Accessibility testing software, you need to ensure that you properly code your pages, using the following guidelines:

When adding your Skip Navigation link, there is one important thing to remember: When you create your link, be sure to include the title attribute. When the T&IR department runs the Accessibility software, it verifies that a skip navigation link is in place by reading the title. If the program reads "main content" in the title attribute, it knows that the link is Skip Navigation and will pass this section of the accessibility check.

So be sure to always include title="main content" in your Skip Navigation link, otherwise the software will report that your page is not accessible.

Instead of using a text link, you can also use an image as the Skip Navigation link. You would code the link exactly the same as above. But instead of typing in Skip Navigation as the link, you would insert an image, like so:

<img src="blank.gif" alt="Skip Navigation" border="0" height="0" width="*">

For the width attribute, you can make it as large or small as you want. You preferably don't want it too large though. Using an image is the best choice if you don't want to display the Skip Navigation link on your site, but still have it accessibile.

Bad Example

1.  Not including a Skip Navigation link
...
<a href="first.htm">first</a>
<a href="second.htm">second</a>
<a href="third.htm">third</a>
...
<a href="last.htm">last</a>
<p> Content of the page
In this case, the screen-reader will read every single link on the page before actually reading the content of the page.

Good Example

1.  Using Skip Navigation to by-pass navigation links
...
<a href="#content" title="main content">Skip Navigation</a>
<a href="first.htm">first</a>
<a href="second.htm">second</a>
<a href="third.htm">third</a>
...
<a href="last.htm">last</a>
<p> <a name="content"></a> Content of the page
Here the user can select the Skip Navigation link and head directly into the main content of the site instead of listening to all the links.