When designing for efficiency in web application, an area that often gets little attention is the contexts of input. On most desktop computers, there are two ways of inputting data: via keyboard or mouse.
Working in a web-based system, many web editors and administrative personnel find themselves switching from the mouse to the keyboard and back constantly. Taking your hand away from the mouse in order to operate the keyboard takes time: you stop your current flow and have to start a new one. Every time the user has to change input device, speed and efficiency is lost.
The most common deficiency regarding input-context change is having to click on a form field in order fill in data. It gets annoying having to go back and forth all the time. Instead, many prefer to just stay on the keyboard. Leverage this fact when you designing workflows in web applications. Make it easy to stay on the keyboard!
A series of actions will help you accommodate keyboard-only interfaces:
- Use javascript to put focus (i.e. select a field) on the first form element, so that the user can start typing in information right away.
- Make sure all fields have tab-indexes, so that the user can use the tab button to easily go from field to field in an order that makes sense for the input.
- Provide keyboard shortcuts for saving, undoing, going to the next section, or similar actions.
- Add auto-complete functionality to input fields, so that the user does not have to scroll down a huge select box.
Count the number of times a user have to change back and forth between the keyboard and mouse when filling out a form or navigating an interface. Work on bringing this number down. Consider each context change (from keyboard to mouse or back) a fail on the designer’s part!
4 comments
Kirkland Towing Services on Mar 19, 2010
I think this is very interesting article, this should be encouraged in order switch over from mouse to keyboard. :)
Joshua Lay on Jun 10, 2010
Great article :)
I’ve recently come across a situation at my work place where our contact centre staff have web based software for customer resource management.
A lot of time is wasted switching contexts and therefore increasing time taken for simple tasks.
We’re looking towards implementing a keyboard shortcut layer to help improve speed and ease of use.
Joshua Lay on Jun 10, 2010
Great article.
This is something I’ve come across for web software used by my companies contact centre staff.
A lot of time is being wasted switching context even for the most simple tasks.
I’ve proposed a keyboard short cut layer in javascript to help alleviate this slow down in work flow.
Random Accuracy on Jun 11, 2010
I agree with the main points of your article. I think there are two large groups of users who will opt for using keyboard over the keyboard/mouse combo: Super Users and Screen Reader users.
The Super Users have become masters of your software and are all about getting things done without moving their hands (using shortcuts, etc), while the Screen Reader Users rarely have a choice.
When designing for the web, I would add a little caution to your third bullet. Adding keyboard shortcuts to the forms are great for Super Users. Just be aware that Screen Readers (JAWS, Window-Eyes) have their own set of keyboard shortcuts and doubling up on certain key combinations could make your site unusable for the Screen Reader population.
Just something to be aware of, especially if your client is required to be Section 508 Compliant (in the States) or another countries equivalent.
Comments have been closed