Keyboard navigation

For the last six months or so, I’ve been working on a team designing a pretty nifty web-app for travel agents. I’ve always thought myself that keyboard navigation was important, since most of us don’t use both hands for the mouse, and I’m struck by the efforts that my UI coder and User Experience colleagues make to ensure the app works smoothly for keyboard navigators. (This is particularly important in the travel agency business, where some agents have been typing on a green screen since the eighties.)

And now I find myself stuck, with no mouse and two hours to kill, navigating the internet on a television with a keyboard, and I’m quickly finding out which of my favourite sites have thought about keyboard navigation!

In heavily JS-based web apps, this is not something that comes for free. Watching good UI coders suffer for an hour or so to set up a good tabbing order on a screen does not scream fun work…. and that goes double for fixing keyboard navigation bugs that can sometimes leave the tabbing order off the screen! But if you want to see who’s made the effort and who hasn’t, you don’t have to look far. Unplug your mouse and fire up facebook.com, and you’ll see the extent that the developers have gone to to ensure that their site browses easily using only the keyboard. Not only have they set up a very easy and logical tabbing order (including custom button highlights), they’ve also started using keyboard shortcuts as part of the design. Nice. On the other hand, some sites have just made no effort, which can lead to dead-end tabs, and looking to see the link target in order to determine where your current tab position will take you… try logging into the wordpress.com administrator panel if you want to see what I mean!

The good news is that regular websites, and webapps that reload the page,  get away scot-free, as long as they’re well designed. Looking at some old sites I wrote, they proved to be dead easy to navigate using just they keyboard, since the divs are well lined out. However, trying one older table-hell websites or ones with wierdly positioned divs (delicious.com, surprisingly!), and the hacks become quickly apparent.

What’s the point? Well,  since most PC users always have one hand on the keyboard, it seems a waste not to take advantage. I’m hoping to see more sites take up keypress navigation in the future.

PS. WordPress.com, my keyboard is stuck in this box. You suck!


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s