Usability Basics: Help Prevent Errors

Ron Akanowicz

on

October 2, 2008

Usability Basics: Help Prevent Errors

From error to error one discovers the entire truth. Sigmund Freud In my last posting (Usability Basics: Keep the User Informed) I talked about how the interaction with other humans differ from interactions online because of something called a feedback loop- the ability we have of constantly assessing the verbal and non-verbal communication that is happening. Helping a user prevent errors is another way of closing that feedback loop online to create usable sites. In the physical world we come up against real boundaries that signal to us about potential problems. I don't need messaging on the side of an eight ounce glass telling me not to put more than 8 ounces in it, otherwise I'll have a mess- I can see how much the glass will hold. Online we're not always privvy to such physical cues, in which case we do need assistance via messages, instant feedback, or imposed limits in order to avoid problems. One of the most visible ways this usability principle is applied online is with creating passwords. How many times have we created a password, only to be presented with an error telling us that we didn't do it right. Oh, you forgot to include a number, or capital letter. Preventing errors is all about being upfront with users and giving them (us!) the information we need to avoid extra clicks, extra time, more page reloads, etc. Let's look at Drupal 6. This version uses messages to help me prevent making an error when creating a password. The site checks the password on the fly, telling us how many characters we must use, recommendations on the types of characters to use, as well as providing a "strength" meter to show us how well we've done before we submit the form for procesing. Nice. image of drupal password fields Another way sites are endeavoring to help prevent errors is through the use of Ajax to validate field values and provide instant feedback. Kayak.com does a good job of helping users prevent errors. When searching for a flight I begin typing in the name of a city and the site returns a list of potential matches. This actually satisfies two usability principles- helping me to prevent errors by displaying only valid city names and ; and it relieves me from having to remember the three letter airport identifier. Good job.destination field at Kayak website Using imposed limits to help avoid errors is very common when selecting calendar dates. The Wachovia website uses text fields with the proper date format listed below the field. This is better than not having any format information, but I can still enter an improper date and submit the form. date fields
A better solution is to force the user to select a date from either a drop down list or via a calendar widget. This ensure the date is entered correctly the first time and helps the user avoid making an error. calendar widget Helping prevent errors is communicating to your site visitors about rules they must follow, boundaries they must operate within, and values that are expected to ensure they can keep moving forward. This is one important piece of creating usable websites, designing positive interactions, and keeping processes as transparent as possible.

Share it!

I find it really annoying when I am forced to use a calendar in *some* applications. For some it is fine, but I'm a keyboard jockey, so it gets in my way. I think a lot of the responsibility also lies with us devs. Things like date formats can also be munged and fixed. It's a small feature we rarely think to implement, but there is something to be said for letting the user be who they are, and letting the computer be smart enough to figure it out. A good example of this technique is spell checking on search engines, or email clients which catch a lack of an attachment.
I think that Kayak does it perfectly here. When you arrive on the flight search page, there is already a date in the date field, they probably choose a date that is 3 weeks away intentionally based on some research they have done about how far out people start looking for flights. You then know (or have a pretty good idea) that it is a MM/DD/YYYY format. When you tab or click on the date field, you have the ability to use the keyboard to change the date, but a calendar widget also pops up, so you have the benefit of seeing a calendar, and the ability to click on a date with your mouse if you prefer that. I agree that forcing the use of a date picker widget is annoying.