Skip Navigation Example

This page has a hidden "Skip Navigation" link in it. The link is only visible when you tab into it using a keyboard. This link is a requirement if you are trying to conform to WCAG Level A (specifically, section 2.4.1 — Bypass Blocks).

If you are using a screenreader, you will notice that when you tab into the skip navigation link and press enter, you will not only jump to the main content of the screen, but the screen reader will also read the content of that element. You will also notice that the main content has an orange outline like the other tabbable items in the page, but will lose that outline when you tab out. These features are important for users who are visual impaired.

Information on how this was all done is available on my blog post at User Agent Man.