Why Motor Impaired Users Need Skip Links

How well could you use a website if your hands had limited muscle control and movement? One task you’d have trouble doing is scrolling through web pages. Motor impaired users often experience this online.

There are a variety of motor disabilities they could have that would limit their ability to maneuver a mouse. Spinal cord injuries, damage to limbs and nerve diseases all make scrolling a burden. One way designers can combat this accessibility issue is by providing skip links.

Skip Links Minimize Scrolling

Links take users to a new page. Skip links scroll users to a new section on the current page. They won’t have to rely as much on flicking their mousewheel or dragging the scrollbar. This allows motor impaired users to browse the page with minimal scrolling.

Your skip links should go above the page fold. Their labels should describe the content section they skip to. They can take the form of buttons or a sticky navigation bar fixed to the top of page.

When users click the skip link, it should scroll them to the start of a content section where the heading is. To scroll users back to the top of the page, you need to offer a ‘back to top’ button. Not offering this button will leave them in the middle of the page where they have to manually scroll back up.

The ‘back to top’ button needs to stick to the page so that it’s always visible when the user goes below the fold. If it’s not sticky, it’ll make it hard for users to find after they finish browsing a section.

The button should go in the bottom right corner and display itself as an up arrow affordance. It should be a modest size so that it doesn’t distract users from page content.

A Necessity for Long Pages

Not all pages need skip links. The ones that need it the most are long pages. It’s hard to define what “long” is because users have different screen resolutions.

A general rule is to measure how many screens it takes to scroll to the bottom on your most popular resolution. If it’s more than 10, that page needs skip links.

Less Swiping on Mobile

A majority of mobile pages are longer than desktop ones. This is because mobile screens reduce page width, which forces content to condense vertically. Some motor impaired users might not have mobile fingers that allow them to swipe the screen. Skip links can reduce swiping and prevent finger fatigue.

Skip Links for Screen Reader Users

Some motor impaired users don’t use a mouse at all. Visual impaired users don’t either. They use a keyboard and screen reader instead. Skip links are useful for screen reader users in another way.

Every time the user loads a new page the screen reader will read aloud the main navigation links. This gets repetitive and slows users down from browsing content.

If you place a skip link before the navigation in the source code, screen readers will read the skip link first. This allows users to skip to the page content without hearing the navigation links read again.

The skip link should only appear when the user presses the tab key, and activate when they press enter. This way it won’t interfere with how normal users use the site. You can hide the skip link with CSS so that only screen reader users will see it.

It should appear in a notification banner at the top of the page. It should disappear when the user tabs to the next link. It should have a label that describes what it does, such as ‘skip to content’.

Accessibility for the Motor Impaired

These skip link techniques are a big help to motor impaired and screen reader users. Any site with lengthy page content and a large navigation needs to implement them.

Scrolling is easy when you have full control over your hands and muscles. But when you don’t, it’s difficult to maneuver a mouse. Designers need to consider the motor impaired when they design. They want to use the site just like everybody else.

UI Design Kit

Affiliate