Requirement • Explanation • Tutorial
Section 508 Requirement
A method shall be provided that permits users to skip repetitive navigation links.
"It is common for Web authors to place navigation links at the top, bottom, or side of every new page. This technique can render use of a Web site very difficult for persons using a screen reader, because screen readers move through pages by reading from top to bottom. The use of repetitive navigation links forces persons with visual impairments to re-read these links when moving to every new page. This provision allows the user to more efficiently read the contents of a page" (JimThatcher.com).
A simple way to meet requirement "o" is to place an invisible 1 x 1 pixel image after the Winthrop logo (which should be located in the upper left corner of your pages) and before the repetitive links/navigation. Why put the image after the logo? The image ALT tag of the Winthrop logo tells the user that s/he is still on the Winthrop University site. When the screen reader reads the logo's ALT tag first, it helps to orient the visually impaired visitor.
This image should hyperlink to an anchor, or bookmark, immediately before the main content. The ALT tag for the image should read, "Skip to main content." When the screen reader reads this ALT tag aloud, the visually impaired user simply needs to hit the enter key, and the screen reader will immediately jump to the main content of the Web page. If this type of skipping over repetitive content was not offered to the visitor, the screen reader would read each item to the non-sighted user over and over again as s/he visited a new page.
- To add an invisible image for skipping navigation using FrontPage:
- Place your cursor before the address in the black bar section of the page.
- Choose " Insert" from the menu, then "Picture" and "From File." Select the 1x1pixel.gif located in the images folder of your site. (If you do not have a 1x1pixel in your images folder, please contact the Web developer to request it.)
- Once the image is inserted, right-click on it. Choose "Picture Properties" and click on the "General" tab. Type “Skip to Main Content” in the "Text" form field and click OK. This step will add the ALT tag to the HTML code.
- After the image has been inserted, place your cursor at the top of the body section of your page and choose "Insert" from the menu, then select "Bookmark."
- Type “MainContent” in the "Bookmark name" field and click OK.
NOTE: You can name this bookmark "MainContent" on ALL of your Web pages. By using a generic name, you can easily copy and paste the necessary information from page to page.
- Click the 1x1pixel image in the black bar once again. (The pixel may be difficult to locate, but if you click in front of the address, it should select itself.)
- Once the pixel image is highlighted, click the hyperlink button at the top of the screen (globe with a chain link or hit Ctrl+K on the keyboard). In the "Insert Hyperlink" dialog box, click the "Bookmark" button to the right of the window and select the bookmark “MainContent” then click OK.
Views of the HTML code:
For your convenience, you may also wish to download a printer-friendly Section 508 checklist (pdf).
For additional assistance with this requirement, send an email to firstname.lastname@example.org.