We need skip to content links

Note: This post is older than two years. It may still be totally valid, but things change and technology moves fast. Code based posts may be especially prone to changes...

(Loaded 839 times)

Just a short explanation to all the developers out there that may not understand the need for skip to content links.

If you tried to navigate the web with keyboard only, or maybe even with screen-reader only, that is without mouse – then the title is probably making a lot of sense to you.

But let’s try to explain this also to others that are primarily using mouse or touch when they navigate.

When you can use the mouse or touch it is so simple to just move over the content that is not interesting for you, it is even easier to just scroll and skip everything that you are not interested in. But when you are for example a keyboard-only user, then this task becomes impossible.

Imagine that you must press the tab key to go to the next element and that you are on a site that has fifty links in it’s main navigation. This means that you have to press the tab key at least fifty times to get to the content if the navigation is not hidden by default.

Just try to imagine that on your favorite news page. Every time you want to read the main article of the day you would need to press the tab key for fifty times. This is why we must offer our users a simple link to “skip to main content”, at least. And if our page maybe has a social media plugin with all our activities, then we could cause the same problems to our keyboard- and screen-reader-only users as well.

It is about equal means of access

Sighted user can just simply scan the page and decide where to read for example. Or just scroll on and stop when content is of interest. To skip a “mega-menu” navigation is a piece of cake. And “skip to main content” is enabling the keyboard-only and screen-reader only users a similar possibility – so that they can easily skip the repetitive parts of the webpage and go directly to the main content.

It is such a small element – a link to the anchor – but it is amazing how it improves the usability of keyboard-only users.

Always test your webpages with a keyboard, so that you can really understand and improve the overall usability!

a reminder for every web developer out there.

I really don’t get it why some developers forget about it – as they are almost for sure using all sorts of shortcuts on their devices, especially when in their programming software environments.

Author: Bogdan Cerovac

I am IAAP certified Web Accessibility Specialist (from 2020) and was Google certified Mobile Web Specialist.

Work as digital agency co-owner web developer and accessibility lead.

Sole entrepreneur behind IDEA-lab Cerovac (Inclusion, Diversity, Equity and Accessibility lab) after work. Check out my Accessibility Services if you want me to help your with digital accessibility.

Also head of the expert council at Institute for Digital Accessibility A11Y.si (in Slovenian).

Living and working in Norway (🇳🇴), originally from Slovenia (🇸🇮), loves exploring the globe (🌐).

Nurturing the web from 1999, this blog from 2019.

More about me and how to contact me: