Most skip navigation links are visually hidden on the page. Even though they are visually hidden, a screen reader will pick these up and announce them to the user. page shown in the image below contains a skip navigation link that is not visible to a non-AT user.
On this site, when someone uses the keyboard to tab through the links, the skip navigation link becomes visible. This is not always the case as it depends on how the link is coded. Having the link display visually when it receives the focus can be beneficial to those who use keyboard navigation.
When a user invokes the skip navigation link, the focus of the page will go to the anchor tag (bookmark) that is defined at the start of the main content. This allows those navigating with the keyboard to quickly bypass links to access the main content of the page.
Here is a code snippet of a skip navigation link and anchor tag; this code should be the first link on the page:
<!-- SKIP NAV -->
<a href="#content-area">skip to page content</a>
The target is the anchor tag which is placed just before the main content:
Select Next to learn about Testing with AT.