web analytics

(In)Consistency in keyboard shortcuts

More and more I’ve been using web apps in lieu of the traditional desktop applications I used for years. Primarily it’s because, like many of you, I have a home computer and a work computer; storing information online makes it far easier to access from both locations, particularly when one’s a Mac and one’s a PC. I don’t have to worry about saving files onto my USB key, or emailing myself a link before I leave for work. Instead I use Drop.io and Del.icio.us. Everything I need can be accessed from anywhere at (almost) anytime.

Additionally, as new technologies allow for the creation of richer and more dynamic interaction on the web, I no longer feel as though I’m using the cheap imitation of the product when I sign on. If you’ve ever used Microsoft Office Outlook Web Access, you know what I’m talking about.

In choosing tools to manage many of my daily tasks, I have chosen accessibility over reliability. After all, the web server can go down, your can lose your ISP connection, a ship’s anchor can cut through an underwater fiber-optic cable delivering Internet to an entire nation. In this crazy world, anything is possible. But I’m still willing to take the risk of not being able to access my information around 5% of the time for the convenience by which I’m able to access it 95% of the time.

A lot has been written about the future of web apps, so I don’t need to make my case here. The bottom line is that everything is going online, and even Microsoft is beginning to wake up to the reality.

However, as I move away from the desktop, I’ve become more acutely aware of the major drawback of web-based applications: poorly defined keyboard shortcuts. The desktop model has been around for more than 20 years at this point. I remember using Prodigy on my dad’s computer at the age of three, and even that sucker had hotkeys.

Keyboard shortcuts were invented to save time. Hell, they’re called “shortcuts” for a reason. They’re also particularly useful for repetitive tasks so that we needn’t remove our hands from the keyboard. I’m sure studies have been done on this, and I don’t have the energy to Google them now and provide you with links. You can do that on your own if you’re curious enough. But it doesn’t take a brain surgeon to realize that typing two keys takes a lot less time than moving your hand to the mouse (or in my case, trackpad), finding the mouse pointer on the screen, moving it around at just the right speed to find the target, clicking in just the right place to take the action, and waiting forever and a day for the feedback to appear.

Since many, though not all, of the most successful web apps out there are in the market to help us be more productive and make our lives just a tad bit easier, why do so few of them go the extra mile (or let’s be honest — inch) to provide their users with some truly time-saving functionality? And more baffling, why do they insist on inscribing their own meanings to widely accepted and already ingrained standards?

Ever heard of the developer who coded up Control+S to delete the page? That’s right, you haven’t — because he’s dead.

I decided to dig through some of the web apps that I use most frequently to discover just how deep this inconsistency goes. I’m picking on my favorites because, well, they’re my favorites. I think they’re wonderfully designed applications, but it’s obvious that keyboard shortcuts were a mere afterthought and little concern was given to actually making them usable. In my opinion, the most successful web apps are the ones that have the highest degree of “walk up and use” interactions. Innovation is secondary, and we all know novelty fades.

Off the bat I have to tell you that 37Signals doesn’t offer keyboard shortcuts in any of its web apps — so far as I can tell based on my experience and about 15 minutes of Google research. And while their products are well-integrated and lightweight and fairly easy to use, and they’re much beloved in our community, they’re obviously not the be all and end all in web application development. I mean, come on people. They don’t have keyboard shortcuts!

And neither does del.icio.us. And (outside of their slideshows) neither does Flickr. They’ve got hotkeys for toggling info on/off (i), opening a photo page (p), and opening a photostream (o)– but I think it’s a stretch to call the slideshow a web app, so those don’t really count.

So I’m left to analyze only these four: Remember the Milk, Google Reader, Bloglines, and Gmail.

Open an item:

  • RTM – n/a
  • Google Reader – o or <Enter>
  • Bloglines – o
  • Gmail – o or <Enter>

 Select the next item in the list:

  • RTM – j
  • Google Reader – j
  • Bloglines – j
  • Gmail – j

Select the previous item in the list:

  • RTM – k
  • Google Reader – k
  • Bloglines – k
  • Gmail – k

Doing good so far! But here’s where things go awry…

M

  • RTM – Toggle multi-edit mode on or off
  • Google Reader – Mark as read/unread
  • Bloglines – Collapse/expand left pane
  • Gmail – Mute all future conversations

N

  • RTM – Select none
  • Google Reader – Scan down
  • Bloglines – Keep as new
  • Gmail – Next message

R

  • RTM – Rename the selected item
  • Google Reader – Refresh
  • Bloglines – Refresh left pane
  • Gmail – Reply

S

  • RTM – Change the tags for the selected task
  • Google Reader – Toggle star
  • Bloglines – Next sub
  • Gmail – Star a message or conversation

I hope by now you get my point. They aren’t consistent. While I understand that every app has different functionality and thus one key can’t mean the same thing all across the web, I think it’s fair to demand that there by some rhyme or reason to how they’re chosen. Hitting the wrong hotkey could have negative consequences that you might not be able to undo.

Oh yes, undo. Make Command+Z (Control+Z) work! Is that too much to ask?

Lists of keyboard shortcuts for the above mentioned apps can be found here:

Remember the Milk

Google Reader

Bloglines
bloglines hotkeys
Gmail – You have to turn it shortcuts on in Settings since it’s off by default.

Some others that might interest you:

Wikipedia

WordPress

I’ll be adding more as I discover them. Do you know of any that I missed?

[Update: I meant to include this long list of keyboard shortcuts for some of your favorite web apps, though some may be outdated or PC-only]

Related Posts:

Want to help put humanity back into business?

Sign up for email notifications to stay up-to-date on Whitney's latest writings, speaking engagements, client projects, special offers, and other news.

Comments

  1. Hi Whitney

    Interesting post..

    When we decided on keyboard shortcuts for Alertle (www.alertle.com), a new web-based RSS feed reader, we focused on “intuitiveness”.

    For example, to move up/down between headlines, simply use the up/down arrow. And to scroll up/down while reading an article, use pgup/pgdown. The way the application was designed and its layout helped in that.

    But I think Google Reader can’t have up/down arrow as its keyboard shortcut for moving between the headlines because they use it to scroll on the page! Thus they have “j”, “k” for it..

    Check out a comparison between Alertle and Google Reader at this link: http://blog.alertle.com/?p=10

    Full list of Alertle’s shortcuts are here: http://wiki.alertle.com/doku.php/hotkeys

  2. Even the method for initialising shortcuts is still in the air.

    It would seem most sensible to use the accessibility standard of access keys to initiate shortcut commands. (shift+letter).

    This I believe is the approach that google take and makes most sense from a standards and progressive enhancement point of view. The use of Ctrl+key is likely to iterfere with the browser.

    Developers however need to be careful that the use of the shift key doesn’t interfere with typing, as nothing is more infuriating than trying to type something with a cap only to jump somewhere else in the page or fire some random function.

Trackbacks

  1. […] Twhirl gets the win here with a box big enough to see your whole tweet, has twitpic, and a built-in URL shortener.  And I just discovered during this post that the filter box is a nifty little search box.  No contest on this one for me.  I cannot use Twitterrific for updating because I can’t see my entire post.  And while CMD-D on my Mac is easy enough to remember, the rest of the keyboard shortcuts in Twitterrific are negated because I can’t remember them (see Whitney’s post on keyboard shortcuts.)  […]

  2. […] written about inconsistencies in keyboard shortcuts before, and yes I’m a stickler for details. I’m disappointed to find that only four of […]

Leave a Reply