Accessibility Tip of the Week

A key(board) to website accessibility.

  • Summary: Run a quick check of your website to make sure it is accessible using only the keyboard.
  • Who it helps: People who use screen readers, voice control, and other software or devices to navigate the web using the keyboard focus.
  • Additional benefits: Some people use the keyboard to increase their productivity. It is faster than a mouse when you know how to use it.

Here’s an eye-opening activity that will only take five minutes. Open your web browser on your computer and try navigating a website with just your keyboard. That’s right, not a mouse or trackpad, just your keyboard. If you don’t know how, follow along.

Let’s try it out at one of our websites: ta11y.org .

  • Use your mouse to place the focus in the browser search bar at the top by clicking in it. You’ll see either a highlight or a blinking cursor. If you see a highlight, hit the right arrow key on your keyboard to move to the blinking cursor.
  • Use the Tab key on your keyboard to move forward. This will go through the browser controls and then enter the web page.
    • Hint: Hold the Shift key down while pressing Tab to move backwards.
  • As you navigate the page, you will see an outline appear and sometimes a color change. These indicators mark where the keyboard focus is currently located.
  • Did you notice the skip link that appears at the top of the page? These links help keyboard users skip over navigation.
  • When you get to the Assessments menu item, hit the Enter key. This opens a dropdown menu.
  • Use the Up and down arrow keys to navigate through the menu items.
  • Hit the Escape key to close the menu.

What about my website?

Standard personal computer applications from both Microsoft and Apple (among others) are not just keyboard accessible, but can be used with only the keyboard. Your organization’s website can and should also be built to support the keyboard. If you are wondering whether your website is accessible, a great first step is to test its keyboard accessibility.

Now that you’ve got the hang of it, try it out on your website. A reminder of the keys to use:

  • Tab key: Move forward
  • Shift + Tab: Move backward
  • Enter: Activate a link or button
  • Up and down arrows: Navigate menus, drop down items, and radio buttons
  • Space bar: Select check boxes

There are several types of assistive technology that navigate the web only using a keyboard. If you can’t do things or can’t tell where you are in your website, your website is not keyboard accessible. And a website that does not work with the keyboard is not accessible.

This work is licensed under CC BY-NC-SA 4.0    .

If you are promoting accessibility within your organization or community, sending out easy-to-understand tips can be a helpful addition to your strategy. You are welcome to share the tips here under the mentioned Creative Commons license, as long as you cite Accessible Community as your source.