skip-link
Ensure 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 lengthy navigation and directly access the main content.
Why is it important?
For users of assistive technology, screen readers present content in the order it appears in the HTML file, starting with the top of the page and including the navigation before reaching the main content. This can be time-consuming, especially when the top content is lengthy and the user is primarily interested in the main content. Including a skip link in an HTML page is advantageous for blind users, individuals with low vision, and those who navigate using a mouse only, allowing them to bypass the lengthy content and directly access the main content.
Examples
-
Success:
- A skip link is included as the first link on a page.
-
Failure:
- Used CSS to hide a skip-link.
How to fix?
It is important to have skip links in the webpage that provide a focusable target, allowing users to skip the navigation. One effective practice is to place the skip navigation link at the top of the page immediately after the opening <body> tag.
Tags
cat.keyboard, best-practice
References
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
Is this page helping you?
Yes
No
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
Thank you for your valuable feedback!
