Add “Skip to Content” Links Above the Header and Navigation

As previously mentioned, some users with a visual impairment will be using screen-reader technology to read the text elements of your interface aloud.

One problem is that it’s easy for these users to get lost in the mess of links and content on an especially busy page. Users need a way to get to the navigation. For fully sighted users, the location of the navigation is a well-accepted pattern, but partially sighted users may not have the same “mental model” of a web page or web app.

Figure 68.1: Amazon’s homepage is, at the time of writing, almost impossible for visually impaired people to navigate using a keyboard.

Adding a “skip to content” link to the top of your site (it can be hidden with CSS rules and only needs to be visible to assistive technologies like screen reader software) will allow the user to skip past the navigation effortlessly. They...