Keeping the Sharks at Bay Part 2: Don't move! ⋆ SeaMonster Studios

The sharks are circling you, but the letter they sent you didn’t mention anything about auditory challenges, so our last installment of the series left you gasping in the water, and grasping at straws rather than a life preserver. Actually, though, it probably left you standing stock-still, hoping the sharks won’t see you to attack.

The Problem

And maybe that’s appropriate. Did your letter mention that your site was difficult to navigate for someone with a kinesthetic challenge, or in other words, with low motion abilities? If so, this is the post for you. If not, though, don’t give up! We’ll have the low-vision prescription out to you soon, but you should read this one, too, since the things you could do to your site to make it more accommodating to low-motion individuals will also greatly benefit the low-vision folks. This is the middle prong of the trident you’ll use to keep those sharks away, and being the middle, it really does span the gap between the other two.

Kinesth…what?

First, let’s understand: what are kinesthetic challenges? Well, when you reduce the website far enough, all you have are a bunch of zeros and ones, but of course, that’s not how we take it in. We take it in through our browser, which for most people is graphical: we see the site, and interact with it by scrolling, reading, clicking, typing, and so on. But some people with disabilities don’t have these actions as easy options because their motion is restricted in some way. Think of Stephen Hawking, who could only use a thumb switch and some other assistive technologies. Some of these technologies take a webpage essentially back to zeros and ones: a switch is pressed, or not. A straw is blown through, or sucked, or not. If that’s the accommodation, how do you accommodate for that on your website?

person navigating a laptop with a binary backgroud and binary on the screen

Image by Gerd Altmann from Pixabay

It’s actually not as difficult as you might expect, but it does require a few important steps that luckily will help you accommodate people with other disabilities too, so whether or not you are specifically charged with making your website accessible to folks with kinesthetic challenges, you should definitely take these steps.

Step 1: Heading them off at the pass

The first thing you should do is commit yourself to using proper heading levels. This will take you way back to that study skills class in high school that you aced (it was easy), but that you never actually used, so that by the end of high school you could burn all your notes up without one stitch of regret, knowing they were all so slipshod and haphazard that you could never make sense of them later anyhow.

Remember this?

First point
1. Subpoint
2. Subpoint
Second point
1. Subpoint
  1. Subsubpoint
2. Subpoint
Third point

Anything you’ve written (such as the content of your website) can be broken down into its various parts. This was, as Mrs. TS said, a great way to plan your papers, but years before she said that, Mrs. Dobrinsky taught you that it was a great way to take notes because then you could jot a few words for the points, subpoints, and subsubpoints, and be able to see all the relationships between the points without having to explain them in your notes. On your website, your visitors will use your outline similarly, but they’ll use it to get the sense of your page and to decide which parts of it they should read.

On the web there are six heading levels, but the most important, I’d say, are the first three. Use an <h1> tag to express the main point of the page as a whole. You should only have one <h1> on any given page. The <h2> tags express your page’s subpoints, and <h3> tags express points within those subpoints. Most pages don’t really need points within the points within the subpoints, but if your page is complex you could go all the way down to <h6>.

<h1>Page Title

<h2>Main Section

<h3>Subsection

<h4>Subsubsection

<h5>Subsubsubsection

<h6>Subsubsubsubsection

You mustn’t skip heading levels

An important thing to remember, just as Mrs. Dobrinsky used to say, is that you mustn’t skip heading levels. If the last heading tag you used was an <h2>, your next one, to be a point under that, should be an <h3>. Don’t use an <h5> after the <h2> just because you like how the browser makes an <h5> look.
If all of this about heading levels is making your head spin and bob like a buoy in a storm, don’t worry. You can let your web development firm deal with the details, as long as you do the work of dividing your page into sections and subsections, and giving each section a name.

[click image to expand]

Skipping to the Point

Another thing that helps users with low-motion are what are called “skip links”, or “skip-navigation links”. If rather than scrolling through your page, an individual has to tab through it (or tap a switch, or blow through a straw, etc), one of the biggest tasks on each page would be having to tab through that beautiful menu you put at the top of each page. That’s a lot of tabbing, unless you include a hidden link right above the menu that allows the user to skip to the main content of your site.

How to actually create a skip link is beyond the scope of this article, but there are many resources online showing how, like this excellent one from CSS Tricks. It’s not terribly hard, but it is important, and you should be sure to ask your web development firm if they included it in your site.

Parting Blow

With headings in the correct levels, and skip-navigation links, you’re brandishing that trident of yours with gusto, but it’ll be better able to deal the final blow to the sharks when you put the third prong on and make sure that your site is accessible to people who are blind or low-vision. Catch that in our next installment.