After reviewing nearly 2000 portfolios this year, I came to the conclusion that there was one thing missing on most of them——keyboard navigation. After spending over a year working on a project and forging an experience that fully utilizes the keyboard, I started to seriously question why it hasn’t been used more. It truly should be used on nearly every site because it is a necessary feature for every interactive web experience. So why aren’t the majority of interactive designers and builders using it? Are they intimidated when dealing with the keyboard, perhaps are they unaware of its potential or maybe even so concerned about budget constraints that it gets left off? It could really be any of those things and I’m open to hear your thoughts.

To show where I’m coming from and the magnitude of websites lacking the use go to any website right now. Tap the keyboard or hit your arrow keys. Was the result just crickets or do you need further proof? Try searching “design portfolio” in Google. Not one of the sites on the first two pages of results use keyboard navigation in any form.

So why aren’t more people utilizing it?

Accounting for the why is tricky. Though if I were to guess based on experience in questioning developers and usability testing it would be because of a lack of time, effort and the concern that the keyboard would need to be used at some point. The truth behind the last part is that yes a user may need to use the keyboard, but only a very small percentage of the time. Two examples of those type of actions would be typing in a form or using shortcuts. The solution is to simply disable the keyboard nav while in form fields and not override necessary shortcuts (e.g.. cmd + c, cmd + z, etc).

When should it be used and why?

The answer I want to say is always. However, there are some circumstances where it might not be necessary—very slim. When you have sites that require you to click and drag to scroll or have pages and pages of content, why not give the user the ability to skip to each pane or project. If instead you require the user to perform a second action of clicking then you may be making things more difficult. Sure you want the drag to be part of the experience, but keep in mind that the more unnecessary friction you add to each interaction the higher their disinterest meter will go.

Designspiration is the perfect example of taking a “dead” keyboard and pumping it full of life. Short cuts on the site include a fully functional a-z and 0-9 live search function that can be activated by simply typing at any time. Equally as important is the ability to use the arrow keys in the way that they should be: smart pagination between result sets, smart paging within result sets and smart scroll viewing.

Other solid examples of the keyboard in use are The Bullitt Agency, Hugo & Marie and Thinking For a Living.

As we move forward with progressing our interactive experiences, we should be sitting down to really think about the feature sets needed to attain complete site usability. Also working out solutions for how the user uses keyboard events could mean a world of difference to their resulting experience. Your users are friends, be nice and easy on them.