E-Commerce Site Design: Checkout Pages By James Maguire
February 13, 2006
No area of e-commerce site design gets nearly as much attention and concern - even angst - as checkout pages. An online merchant building its checkout pages is like an artist laboring over their masterpiece: everything has to be laid out precisely right.
Is it the right amount of steps? Is it clear enough?
This concern is justified. The checkout pages are where shoppers type in their beloved credit card number. The all-important checkout page is the very core of e-commerce.
To review the design guidelines for these critical pages, E-Commerce Guide spoke to Jakob Nielsen, a leading Web usability guru who has conducted extensive research into checkout page design.
Nielsen, to be sure, observes that checkout pages have improved over the last few years. "On the other hand, I see so many sites that continue to make the same mistakes," he says.
With that, the sage Mr. Nielsen rolls up his sleeves and talks about what every well-designed checkout page must include.
The Basics, And Then Some
At the heart of the checkout process, of course, is the shopping cart. The design and set-up of this critical tool drives the successful (translated: profitable) checkout process.
Most merchants are aware of the needed ingredients of a good shopping cart: It must display each item and all additional charges, with a constantly updated total that offers the least expensive shipping method (but customers, of course, should be able to choose among various shipping methods). On certain sites, it should allow a "gift option" in case the shopper wants an item wrapped or sent with a gift message.
A shopping site shouldn't ask a user too many questions. "Ask only for the information needed to complete the order," Nielsen notes. "Some people leave a site if too much personal information is required."
Another basic point: A customer should be able to review the entire order before being asked to provide credit card information.
To truly harvest the most revenue, a shopping cart should be user-friendly, therefore it should:
Offer links to get more details about any items in the cart. Carts should allow "the easy ability to see what's in the cart, and to go from what's in that cart to the product page," he says. "And when they get to that product page, they should say 'this is already in your shopping cart.'"
Enable shoppers to easily change quantities and - believe it or not - remove items. Merchants need to make this easy, even if that means not selling an item. Notes Nielsen: "Many merchant might think, 'Well, that's not something I want to make easy,' but by doing that you make it easier to shop; which in the long run gives you more orders."
And, of course, provide a big bold "Return to Shopping" link. Never, ever, forget the "return to shopping" link.
Abandonment Anxiety
One aspect of the checkout process creates more anxiety for e-tailers than need be: shopping cart abandonment.
Why, e-tailers wonder, are people ditching many (or all) of the items in their cart before completing the sale? Is there a problem with my checkout pages?
But merchants need to be aware that they view carts far differently than shoppers do. For a shopper to add an item to cart "doesn't really mean they're buying it, it means it's one of the thing they're considering," says Nielsen.
People put things in their cart without necessarily intending to buy them "partially because navigation and search are so complicated on e-commerce sites," he says. "If I've found something once, I don't want to find it again - it's like they want to put a little sticker on it to hold it."
Merchants might be well served to offer shoppers a "holding area" or a "wish list," but then again, the cart works just as well. (Still, adding a wish list tool is an effective tactic, particularly for a site that might be used for gift giving.)
Online merchants, instead of bemoaning abandonment rates, should support the many ways shoppers like to use carts - an easy-to-use cart is a revenue-booster.
Oh, No! Not An Empty Cart!
A very real weakness in shopping cart set-up - one that customers often complain about - is a cart that won't let them save their selections and come back hours (or days) later.
"This is particularly true in sites where you have to do a little bit of work to change specs, like when you're buying a laptop," Nielsen says. Shoppers often want to halt mid-process, and "those sites that erase a shopping cart after an hour, or 24 hours, they're going to lose a lot of those orders."
By the same token, in a single shopping session, customers should never have to re-enter checkout information they've already entered elsewhere. All fields should pre-populate for repeated information, "A lot of sites offer a simplified way of dealing with shipping vs. billing address. Like, the little check box that says they're the same - it saves people a lot of time and hassle."
One last data entry point: Customers won't always enter data in the expected format, and they shouldn't have to. The ideal checkout page allows shoppers to enter their data as they wish - but catches errors as they happen.
(And they will happen. In Nielsen's study, 11 of 39 American users made at least one typo while filling out forms, but weren't aware of their mistake until the site presented an error message.)
The Big Bugaboo: Having to Register
Everyone seems to know it - merchants included - but it still causes aggravation on countless checkout pages: When a shopper has to register on a site before buying, it hurts sales. "We know users hate that, and we know it's very error prone," Nielsen says. "Requiring registration before or during a purchase drives away business."
"People who work in e-commerce know too about much technology," he says, with a laugh. "So they think 'How hard can it be to type in the user name and password?' - but I can't tell you how many times we've sat with users, and that trips them up." He's seen users go round and round for ten minutes, and then say, "Oh, forget about it." Many users are far from tech savvy.
As a response to consumer backlash on this issue, many sites have now started to offer a "go straight to buy it," option, with no lengthy questionnaire.
Only after a purchase should shoppers be invited to register. "Once they've bought it, they get a Thank You screen that says, 'If you want to make it easier to buy in the future, why not register? The next time you come we'll remember all your information.'"
Shoppers who buy repeatedly on a site will actually do this, but, "The point is: you want that first sale so much," Nielsen says. "So blowing that is just a major, major mistake."
The No-Brainer: Fewer Steps Is Better
Among many merchants, it's an unquestioned truth: the fewer the steps in your checkout process, the better. With this logic, a four-step checkout process is much better than a five-step checkout.
"Every extra thing you ask a user to do is an extra thing that can go wrong," Nielsen says. "And an extra opportunity for them to think, 'Do I really want to buy this?'"
However - and this is a point he stresses - it's not feasible for merchants to go overboard with the shorter-is-better approach. It's not effective to say, "All right, let's put everything in one big page." That simply wouldn't work, he notes.
As you design your streamlined checkout, it's best to build in a step that lists shipping costs as early in the checkout process as feasible. The reason: "People are reluctant to enter their billing information before they know the total price - you won't give out your credit card number for an unknown charge to be added to it."
This need to make shipping costs clear, early on, is a good rationale for merchants to offer free shipping (or flat fee shipping cost) - it greatly simplifies the checkout process.
Classic Mistakes
It's a design flaw in a checkout page to incorporate a large number of coupons or discount offers, Nielsen says. "If people think there's a way to get things for cheaper, and they're not getting it, then they feel they're being cheated."
Instead, "Just really make [the checkout process] smooth. If they've decided they want to buy it, the less decisions means the less they have to think about. Just close that sale, immediately."
Another classic mistake in checkout: allowing the checkout pages to load so slowly that people think the site's not working.
This is often caused by a server being overburdened by excess traffic, Nielsen notes. "This is particularly a problem once you get into the holiday shopping season, because sites might have three times as many customers as they usually do - or maybe tens times as many, these days - and so their server slows to a crawl when it comes to the checkout, where every page has to be computed and calculated."
"Computers are fairly cheap these days, so not having enough capacity in your data center is a sad way to lose sales." To stay watchful about page load time, it's a good idea to shop your own site in the busy seasons.
The bottom line for online merchants: Take care of your checkout pages, and they'll take care of you.
James Maguire is a contributor to ECommerce-Guide.com. His column appears every Monday.
Do you have a comment or question about this
article or other e-commerce topics in general? Speak out in the SmallBusinessComputing.com E-Commerce Forum.
Join the discussion today!
Tools:
Add ecommerce-guide.com to your favorites Add ecommerce-guide.com to your browser search box IE 7 | Firefox 2.0 | Firefox 1.5.xReceive news via our XML/RSS feed
IE 7
Firefox 2.0
