skip-link

Make sure that the skip-link target is present and can receive focus.

Description

Ensure that the webpage includes a skip link at the top before the navigation, which provides users with the ability to bypass extensive navigation and directly access the main content.

Why is it important?

A skip link is crucial for impaired users as it allows them to bypass extensive introductory content, which often includes headers, menus, and advertisements, thus providing quicker access to the main content. This introductory content tends to be lengthy as it serves various purposes beyond conveying essential information, such as branding and navigation, which can pose challenges for users relying on assistive technologies like screen readers to navigate.

By incorporating skip links, websites can streamline the browsing experience for individuals with disabilities, ensuring equitable access to online content.

How to fix?

To add a skip link at the beginning of your webpage use the <a> tag along with a target (e.g. href = "#main-content"), providing impaired users with a quick way to navigate past redundant content to reach the main content section. Ensure the skip link is clearly labeled, such as “Skip to main content,” and style it appropriately for visibility. This will make the link permanently visible.

An alternative to this approach would be using CSS properties to hide the link until it receives keyboard focus.

References

• WCAG 2.1 Technique G1