PRINCIPLE 2: OPERABLE
Provide a ‘skip to content’ link
People with clear vision can quickly glance at the layout of a web page or document and easily find the content they’re looking for. If they’re able to use a mouse, they can even click on a link or other control within that section of the page. However, other users, including screen reader users, people who navigate by keyboard, and people using screen magnification, are unable to find and jump to content with similar ease unless the page is coded properly.
Best practice
Dropping a “Skip to Main Content” Link on your site
Head over to the nottingham.ac.uk website, hit tab and you'll see our skip to content link sitting proudly at the top of our page. Details are as follows :
A “skip to main content” link is a same-page link that targets the id of an HTML element containing the main content. This enables screen reader users, keyboard users, and screen magnification users to bypass navigation links and jump directly to the main content of the page. The benefits for screen reader users are minimal if other techniques are used to accomplish the same thing (i.e., headings and ARIA landmark roles). However, these links are still helpful for keyboard users and screen magnification users, since browsers don’t natively support jumping to ARIA landmarks or headings in the same way that screen readers do.
A common practice is to position the “Skip to main content” link in the top left corner of the page but visibly hide it using CSS, then make it visible on :focus so it appears immediately after users press the Tab key.