WebWord.com > Moving WebWord > Complicate Your Web Site  (27-Aug-2001)


If you want to know when new articles go online,
subscribe to the WebWord.com Usability Newsletter!

Complicate Your Web Site

Guest Article by Joshua Ledwell

Summary

When you're designing a transactional web site, you need to complicate it with extra steps and customization. Anticipate the most likely problems, provide clear error handling, and build informative confirmation messages to keep your users happy.


When Simplicity Is Not the Best Policy

Navigating a web site is the simplest task a user undertakes online: look for links, click them, and go to a new page. When something breaks, the built-in errors (site not responding, page not found) make sense and the remedies (back up or try again later) are self-evident. 

Web site navigation is such a comfortable process that it's tempting to extend it to more complicated online transactions like downloading software, registering for membership, or buying something. Keep it simple and direct, right? Not quite. You actually want it complicated and overdone!

When you design a transactional web site, where the site's purpose is to take information, process it, and give back something in return, you need to meet you users more than halfway. They are putting in extra work to use your site, and they expect extra thought from you to smooth their path.


Anticipate Problems

Since you're a usability wizard, your web site certainly has a foolproof design, and of course it resides on bulletproof servers that never fail. Nevertheless, when users are transacting with your site the possibility of errors is much higher than if they were just navigating. In addition, errors become more complicated, and their remedies less apparent.

Often you know ahead of time what the most common transaction problems will be, based on the information you're asking for. Anticipate common problems in advance, and mitigate them with custom solutions. For example, at sites that use member IDs, very often the ID a user wants is already taken. Astronest.com, an online game site, ameliorates the common "ID already taken" problem with a Check ID pop-up.

A Check ID pop-up is a shortcut around "ID already taken" errors.


This shortcut frees new users from laboriously trying new IDs, scrolling, and resubmitting the entire form until they guess right. The pop-up can also alert users to other errors, like forbidden characters or an ID that's too long.

You can cut down further on form errors by replacing text entry with selectors whenever possible. Use pulldown selectors, not text fields, when you're asking for information like:

  • Dates: day, month, even year

  • Demographics: age range, education level, job

  • Address: U.S. state, or country name 

  • How did you find my web site question

Posted all over the web are free and easily implemented JavaScripts to catch more form problems:

  • Email address typos, and other text field validation

  • Hitting your form's Send button twice

  • Impossible birthdates (e.g., September 31)

Your final act of anticipation is to expect the unexpected. Maintain prominent links to your FAQ and your customer service email address, so frustrated users always have a last resort.


Make Errors Your Own

A web server's standard error messages are everything your don't want your transactional web site to be: stark, unusable dead ends. When you surf the web, you'll run into cryptic errors labeled with meaningless numbers like 404 or 500.

Since they rely on databases and dynamic feeds, transactional web sites tend to have even less comprehensible errors. They crash into pages of CGI and Cold Fusion gibberish, or even worse, surrender with a terse "Server Error" message. Rarely do standard error messages offer any useful advice on what to do next.

It's sad to see this, because web server software makes it very easy to build custom error messages. A small investment in custom error page work can reap a valuable return by encouraging your users to persevere in their transaction. Here's an example of very easy changes that yield a much better page.

The custom Lycos server error offers alternatives so users won't leave altogether.


Custom error pages guidelines:

  • Build error pages in the same design template as your site, to lessen the error disconnect.

  • Describe exactly what went wrong as briefly and specifically as possible, in language an average person can understand. Example: "Sorry, our lost password system is not working right now." 

  • Offer clear navigation to retry the task if possible, or other remedy, and to help and customer service. Example: "Please use your browser's Back button and try again. If the problem persists, you can contact Customer Service here."


The Problem with Success 

After all this anticipation and error handling, you'll have users who successfully complete their transactions at your site - finish signing up for membership, give you their credit card number, and so on. Many sites fail their users at this critical point because, at the very moment of success, they don't give users enough feedback to know it.

Imagine you're registering for membership at a free personal news web site, when the site takes your address and then immediately dumps you in front of a local news ticker. It's fast and direct, but you might immediately wonder: Did I get Paris, France when I wanted Paris, Texas? Is this site going to spam me later? How can I change the information I just put in?

It's not enough simply to complete the transaction by opening to a subscription-only page, starting a chat applet, or shipping product. Transactional web sites must have a confirmation step that provides the feedback users need: Everything worked, here's what happens next, and if you need more information here's how to get it.

First, proclaim success. Confirm that the transaction worked, and thank your users for their extra transactional effort. Repeat important information like the ID they chose, the exact name of the product or service they just bought, or the address they'll use to come back later.

Offer a prominent link or button next, with action text that clearly refers to the site's primary activity: Check your free email Inbox, Personalize your homepage, Continue shopping, etc. A primary navigation option designed to dominate the page gives impatient users a way to skip through confirmation quickly. Meanwhile more concerned users can read everything on the page and still know what to do once they're ready to continue.

Then add supporting information like your site's privacy policy, an itemized invoice, and help and customer support info. If you send a confirmation email (usually a good idea) you can let users know to expect that too. Don't worry about repeating items from previous steps - when it comes to help and customer service, repetition becomes desirable. Keep on posting links to help, FAQ, and customer service email.

In general, the more specific and personal information users give you, the more confirmation they will want that everything worked and their information is not being abused.

Here's an example of how not to confirm a transaction. After a user registers, homepage site Homestead.com does include a confirmation step with a nice "Congratulations." They forget, however, to add other useful information, and their continue link is tiny. 

Trouble at home: Homestead.com's confirmation page is a usability fixer-upper.


Homestead appears to be sacrificing confirmation usability to their opt-in advertisers, but it would have been wiser for them to place the ads on their own page before confirmation.

When it comes to transactional web sites, don't "keep it simple, stupid." Think your process through from your users' perspective, and complicate your system just enough to help them through. 

   About the Author

Joshua Ledwell is Senior Producer for Direct Marketing at Terra Lycos. An Internet professional since 1996, he is a battle-scarred veteran of web site usability testing, rapid prototyping, and eye tracking. 

 


What next?


Home | Services | Moving WebWord | Cool Books | Hot Web Sites | Reports
Newsletter Archive | Weblog Archive | Interviews | About WebWord

Subscribe to the Webword.com Newsletter
Receive the best free usability newsletter on the Internet.

 

Contact John S. Rhodes, the WebWord.com Editor and Webmaster

URL: http://webword.com/moving/complicate.html

© 2001 by WebWord.com. All rights reserved.
Do not reproduce or redistribute any material from this document,
in whole or in part, without explicit written permission from WebWord.com.