Enabling keyboard navigation in Mac OS X Web browsers

I like using the keyboard to navigate websites. It is often more efficient and comfortable than having to reach for the mouse and position the cursor just right. Another reason I have for using the keyboard is that it lets me check that aspect of accessibility on the sites we build at work.

One problem is that, for some strange reason, Mac OS X web browsers do not have full keyboard navigation enabled by default. They do support keyboard navigation, but you need to enable it. In some cases it’s very easy, in others it requires a bit more work.

Since I am asked about this every now and then I have written this summary of how to enable full keyboard navigation in some web browsers for Mac OS X.

Safari

  1. Choose Safari > Preferences.
  2. Click Advanced.
  3. By default, the Tab key just focuses form controls – you need to use Option-Tab to focus links as well. To change this, check the checkbox labelled Press Tab to highlight each item on a webpage.

Firefox

  1. Choose Apple menu > System Preferences.
  2. Click Keyboard & Mouse
  3. Click Keyboard Shortcuts.
  4. Below “Full keyboard access”, check the radio button labelled “All controls”. With Firefox 3.6 on Mac OS X 10.6 you should be done now. If you’re using older versions or you still can’t tab to links, proceed with steps 5-10.
  5. Close System Preferences and open Firefox.
  6. Type about:config in the Firefox location bar, press enter and click the “I’ll be careful, I promise!” button.
  7. Look for a setting called accessibility.tabfocus. Most likely it isn’t there, but if it is, double-click it and change its value to 7. Skip the next steps.
  8. If there is no accessibility.tabfocus setting, right-click anywhere in the list and choose New > String.
  9. In the “New string value” dialog that opens, enter accessibility.tabfocus and click OK.
  10. Enter 7 in the “Enter string value” dialog and click OK.

You may need to refresh any pages that were open in other tabs before you opened about:config for the changes to take effect.

It is worth noting that sometimes you don’t have to go through steps 6-10 to enable keyboard navigation in Firefox. It seems a bit strange, but if I create a new user profile in Firefox 3, keyboard navigation works without further configuration. If I create a new Mac OS X user, however, keyboard navigation does not work until I add accessibility.tabfocus in about.config. Why? No idea.

Opera

  1. Choose Opera > Preferences.
  2. Click Advanced.
  3. Select Shortcuts in the list of settings.
  4. Check the “Enable single-key shortcuts” checkbox.

In Opera you don’t keyboard navigate quite the same way as in other browsers. The Tab key only works with form controls. To navigate links you use the Q and A keys to step backwards and forwards through the links on the page. You can also use headings to navigate by pressing the W and S keys to step to the previous or next heading. In addition to this, Opera has something called Spatial navigation which lets you use the Shift key and the arrow keys to move around the page.

Camino

  1. Choose Camino > Preferences.
  2. Click Web Features.
  3. From the “Tab selects” menu, choose All form controls and links.

OmniWeb

  1. Choose OmniWeb > Preferences.
  2. Click General.
  3. Next to “Keyboard Navigation”, check the radio button labelled Tab key selects links and form controls.

Chrome

  1. Choose Chrome > Preferences.
  2. Go to the “Under the Hood” tab.
  3. In the “Web Content” section, make sure that the checkbox labelled “Pressing Tab on a webpage highlights links, as well as form fields” is checked.

Start loving your keyboard

Now that you know how to enable full keyboard navigation in most Mac OS X web browsers, try it out if you haven’t already – you may find yourself liking it. Even if you don’t, you’ll be able to check that you do not create accessibility problems for people who cannot use a mouse and rely on their keyboard to navigate the Web.

Posted on June 9, 2009 in Browsers, Mac, Accessibility