Skip links (also referred to as skip navigation links) are an important accessibility feature required by the Web Content Accessibility Guidelines (WCAG). The links allow users to bypass repetitive content, which is especially useful for individuals who browse the internet with screen readers and other assistive technologies.
For a quick example of a skip link, reload this blog and press the Tab key. Your keyboard focus will move to a hyperlink that reads “Skip to Content.” By pressing enter, you can bypass our header menu and start navigating through the content.
You’ll find skip links on most websites (and if you’ve built your website using a template on WordPress or another content management system, there’s a good chance your site has this feature).
If your website doesn’t contain skip links, you might violate WCAG 2.1 Success Criterion 2.4.1, “Bypass Blocks,” which requires that websites provide a mechanism for bypassing repeated blocks of content.
SC 2.4.1 specifically applies to “blocks of content that are repeated on multiple web pages.” WCAG strongly encourages bypass-block mechanisms on single-page websites, but does not explicitly require them.
However, you should still provide skip links when they make sense — even if your website is only one page.
For example, let’s say you’re building a landing page for a marketing campaign. Your landing page contains a dozen user testimonials, a few pages of sales content, and a form for collecting leads. You want your users to read the content, then fill out the form.
However, keyboard users must tab through every testimonial before they read the content. This isn’t a great experience for those users, and a skip link would greatly increase your chances of conversions. More importantly, you’d make a better first impression on these potential customers.
Remember, the goal of digital accessibility is to make the internet more useful for real people. Repetitive content can be frustrating for people who use keyboards alone for navigation, which is a sizable part of your audience. Providing a skip link addresses an accessibility barrier, and it’s usually a quick, easy fix.
Related: How "Skip Navigation" Links Benefit Accessibility
It’s important to note that other techniques can also provide users with ways to skip repetitive content. For example, subheadings and other semantic HTML elements can identify the different regions of your content.
ARIA (Accessible Rich Internet Applications) landmarks can also identify regions of the page. Because ARIA support varies from one assistive tool to the next, semantic HTML is usually preferable.
Even so, skip navigation links are usually the simplest solution. If you’re concerned that adding the links will affect your website’s visual presentation, you can hide them until the user needs them. Use CSS to hide the link offscreen, then make it visible when the user presses the Tab key.
A few simple rules to keep in mind:
Finally, make sure your skip links appear before header menus and other blocks of repeated content. If your reader needs to press Tab a dozen times before they can activate the skip link, the skip link isn’t serving its purpose.
To learn more about digital accessibility, download our Essential Guide to ADA Compliance for Websites or send us a message to connect with our accessibility experts.