RELATEDPOSTS
Tags:
A New Year, A New Look, A New Experience at Minus 5 Permanent Ice Lounge Renovates with New Ice Bar and Sculptures
BRAINtrust Creative Director featured at gallery exhibition
iPhone App Design Trends

15 Common Mistakes in E-Commerce Design

October 8, 2009

15 Com­mon Mis­takes in E-Commerce Design and How to Avoid Them (via @smashingmag) -

Sell­ing online can open up huge new mar­kets for many busi­nesses. When your store can be open 24/7 and you can reach a global mar­ket with­out the costs of mail­ings and call cen­ters, it can be a huge boon to your busi­ness. But there are plenty of things to con­sider when design­ing an ecom­merce site. It’s not as sim­ple as throw­ing up some shop­ping cart soft­ware and plop­ping prod­ucts into a database.

There are tons of mis­takes that online retail­ers make every day, all of them avoid­able with a lit­tle care­ful plan­ning. And even if you’re already com­mit­ting some of these mis­takes, most of them are easy enough to fix. Avoid­ing them will greatly improve the expe­ri­ence of your customers.

Below are 15 of the most com­mon mis­takes that e-commerce sites make, as well as advice on how to avoid or fix them. Take the advice under con­sid­er­a­tion before embark­ing on a new e-commerce project or when think­ing over your cur­rent ecom­merce site, and make efforts to fol­low the rec­om­men­da­tions out­lined here.

1. A lack of detailed prod­uct information

When you’re shop­ping in a brick-and-mortar store, you have the advan­tage of being able to pick up an item, feel it, look at it from every angle, and read any infor­ma­tion on the pack­ag­ing or labels. Shop­ping online removes that inter­ac­tion. Ecom­merce sites need to do the best they can to improve upon the in-store shop­ping experience.

How often have we gone to an online store and found their descrip­tions to be com­pletely lack­ing? And if a cus­tomer is left won­der­ing about the specifics of a prod­uct, they’re more likely to go look for the infor­ma­tion else­where. And unless your site’s price is sig­nif­i­cantly lower than your com­peti­tors’, they’ll likely just buy from the other site.

What To Do About It

Pro­vide as much prod­uct infor­ma­tion as you can. Sizes, mate­ri­als, weight, dimen­sions, and any other per­ti­nent infor­ma­tion depend­ing on what the prod­uct is. For exam­ple, in an online cloth­ing store, you might include the fab­ric type, sizes and col­ors avail­able, a size chart (usu­ally linked from mul­ti­ple prod­ucts), the weight or thick­ness of the item, the cut and fit of the item, care instruc­tions, and com­ments about the brand or designer. Using descrip­tive words rather than sim­ply tech­ni­cal terms can have a greater impact on the consumer.

Exam­ples

ecommerce screenshot

ecommerce screenshot

ecommerce screenshot

2. Hid­ing Con­tact Information

Con­sumers want to know that they’re deal­ing with a real com­pany when they hand over their credit card infor­ma­tion. They want to know that if they have a prob­lem they’ll be able to talk to a real per­son and get the help they need. If your site doesn’t pro­vide any con­tact infor­ma­tion, or hides it so the con­sumer can’t find it eas­ily, they’re less likely to trust your site, and there­fore less likely to do busi­ness with you.

What To Do About It

Put your con­tact infor­ma­tion in an easy-to-find place on every page of your web­site. The most obvi­ous places to put your con­tact infor­ma­tion are either in your header, the top of your side­bar, or in your footer. Pro­vide mul­ti­ple means of con­tact if pos­si­ble. A con­tact form, email address, phone num­ber, and mail­ing address all add to the level of cus­tomer trust. Remem­ber, too, that the more expen­sive or tech­ni­cal the prod­uct you’re sell­ing, the more likely a con­sumer is going to want more con­tact information.

Exam­ples

ecommerce screenshot

ecommerce screenshot

3. A Long or Con­fus­ing Check­out Process

This is one of the most dam­ag­ing mis­takes an ecom­merce site can make. You have to make it as easy as pos­si­ble for your cus­tomers to hand over their credit card infor­ma­tion and com­plete their order. The more steps you put between them plac­ing an item in their cart and actu­ally pay­ing for it, the more oppor­tu­ni­ties you give them to leave your site with­out com­plet­ing their purchase.

The ideal check­out process includes a sin­gle page for con­sumers to check their order and enter their billing and ship­ping infor­ma­tion, and a con­fir­ma­tion page before they sub­mit their order. Any­thing more than that is only an obsta­cle to com­plet­ing the check­out process.

What To Do About It

Fol­low the ideal model as closely as you can. If you have to include other pages, try to make them as quick and easy to fill out as pos­si­ble. Com­bine pages if you can, and use two-column lay­outs for cer­tain sec­tions (like putting billing and ship­ping infor­ma­tion next to each other) to make pages appear shorter.

Exam­ples

ecommerce screenshot

4. Requir­ing an Account to Order

This ties in directly to the pre­vi­ous item. If you require a cus­tomer to sign up for an account before they can place an order, it’s another obsta­cle you’ve placed in their path. Which is more impor­tant to you: get­ting the order or cap­tur­ing cus­tomer infor­ma­tion? Remem­ber that the sec­ond option may mean los­ing some customers.

What To Do About It

There’s an easy fix for this. Instead of requir­ing a cus­tomer to sign up for an account before they order, offer them the option at the end of their order­ing process. Give them the option to save their account infor­ma­tion to make plac­ing future orders eas­ier or to track the sta­tus of their cur­rent order. Many cus­tomers will opt to save their infor­ma­tion, and you won’t be dri­ving away cus­tomers before they’ve com­pleted their order.

Exam­ples

ecommerce screenshot

ecommerce screenshot

5. An Inad­e­quate Site Search Engine

If a cus­tomer knows exactly what they’re look­ing for, many will opt to use a search engine instead of sift­ing through cat­e­gories and fil­ters. You need to make sure that the search fea­ture on your site works well, and prefer­ably has fil­ters for let­ting cus­tomers refine their results.

How often have you searched for a prod­uct on a large ecom­merce site and been returned with hun­dreds of applic­a­ble results? While the vari­ety of options can be nice, if half of those results are noth­ing like what you’re look­ing for, it’s more an incon­ve­nience than any­thing else. Includ­ing a way for cus­tomers to fil­ter their search results by cat­e­gory or fea­ture elim­i­nates this problem.

What To Do About It

Make sure the ecom­merce soft­ware you’re using has a good built-in search engine, or look for plu­g­ins to extend its func­tion­al­ity. Ide­ally, an ecom­merce search engine should let users search by key­word and then refine results based on the cat­e­gories your site includes. Let users sort their search results based on stan­dard cri­te­ria (most pop­u­lar, high­est or low­est price, newest item, etc.) as well as elim­i­nat­ing items that don’t fit within a cer­tain category.

Exam­ples

ecommerce screenshot

ecommerce screenshot

6. Poor Cus­tomer Ser­vice Options

This is sim­i­lar to the hid­ing con­tact infor­ma­tion bit above. You need to make it easy for cus­tomers to get in touch with you if they have a prob­lem or ques­tion. Make it clear what the best way to con­tact you is if they have a tech­ni­cal ques­tion, a sales ques­tion, or they want to return an item. Offer­ing a help request form for cus­tomers to fill out can instill more con­fi­dence than just an email address.

What To Do About It

Use a tick­et­ing sys­tem for cus­tomer ser­vice inquiries, espe­cially if you don’t have a phone num­ber avail­able. Make sure that you post a FAQ that cov­ers com­mon ques­tions cus­tomers might have, like what your return pol­icy is or what to do if they need to order parts or replace­ment items.

Exam­ples

ecommerce screenshot

ecommerce screenshot

7. Tiny Prod­uct Images

Since con­sumers can’t phys­i­cally han­dle the prod­ucts you’re sell­ing before plac­ing an order on your web­site, you need to do as much as you can to recre­ate and improve upon that expe­ri­ence. Tiny prod­uct images don’t effec­tively do this.

What To Do About It

Either pro­vide large images right on the prod­uct page or allow users to click on an image to zoom in. You want users to be able to view the image as large as is prac­ti­cal on an aver­age mon­i­tor. This means an image that enlarges to 1024×768 pix­els is a good size to aim for.

Exam­ples

ecommerce screenshot

ecommerce screenshot

ecommerce screenshot

8. Only One Prod­uct Image

Unless your prod­uct is deliv­ered dig­i­tally (and even some­times if it is), you’ll want to pro­vide mul­ti­ple images from dif­fer­ent angles. An image in each color, of the front, back, and sides, and even detailed shots of spe­cific fea­tures can all go a long way toward mak­ing a con­sumer more likely to buy from you.

What To Do About It

This one’s sim­ple: include more images. Four or five images of each prod­uct are ideal, offer­ing enough views to allow a con­sumer to feel com­fort­able that they know exactly what they’re getting.

Exam­ples

ecommerce screenshot

ecommerce screenshot

ecommerce screenshot

9. A Poor Shop­ping Cart Design

Your shop­ping cart is an incred­i­bly impor­tant part of your ecom­merce web­site. It needs to allow users to add mul­ti­ple prod­ucts, to revise the quan­ti­ties or other options about those prod­ucts, and it needs to remain trans­par­ent at the same time. Not exactly the eas­i­est thing to do, right?

What To Do About It

Make sure your cart lets a user add an item and then return to the last page they were on. Even bet­ter: allow them to add an item to their cart with­out ever leav­ing the page they’re on (by using a mini cart). Let your cus­tomers edit the quan­ti­ties of items in their cart or remove an item from their cart. And let them pre­view what ship­ping charges will be before they start the check­out process.

Exam­ples

ecommerce screenshot

ecommerce screenshot

ecommerce screenshot

10. Lack of Pay­ment Options

There are plenty of sites out there that only allow users to pay with Visa or Mas­ter­Card, or to only pay with a Pay­Pal account. There’s no rea­son for this any­more. What about the per­son who has an AmEx and doesn’t have or want a Pay­Pal account? What about the per­son who doesn’t have a credit card and wants to pay straight from their bank account? You need to pro­vide as many pay­ment solu­tions as is prac­ti­cal to opti­mize the num­ber of orders you get.

What To Do About It

Use a pay­ment ser­vice that lets cus­tomers pay with each major credit card, and prefer­ably also with an elec­tronic check. Adding a Pay­Pal check­out option increases the choices your cus­tomers have, mak­ing them more likely to pur­chase from you. Con­sid­er­ing dif­fer­ent con­sumers have dif­fer­ent pref­er­ences when it comes to mak­ing online pay­ments, cater­ing to as many as you can means you’ve expanded your cus­tomer base.

Exam­ples

ecommerce screenshot

11. Not Includ­ing Related Products

You’ve prob­a­bly noticed when you go to a brick and mor­tar store that they group sim­i­lar prod­ucts together, or oth­er­wise make it easy for you to find prod­ucts that are related to you. They’ll put a bat­tery dis­play in the elec­tron­ics sec­tion, or include cell phone cases near the cell phones. The same can be done on your web­site, and can increase add-on sales for you business.

What To Do About It

Use an ecom­merce plat­form that lets you include related prod­ucts on prod­uct descrip­tion pages. A plat­form that will let you man­u­ally choose related prod­ucts can also give you a big advan­tage, since you may see rela­tions that a soft­ware pro­gram doesn’t (such as coor­di­nat­ing cloth­ing pieces to cre­ate an outfit).

Exam­ples

ecommerce screenshot

ecommerce screenshot

ecommerce screenshot

12. Con­fus­ing Navigation

There’s noth­ing worse than try­ing to find a prod­uct on a site with con­fus­ing nav­i­ga­tion. Or even worse, an online store that doesn’t use cat­e­gories or oth­er­wise sep­a­rate their mer­chan­dise to make it eas­ier to find a spe­cific type of prod­uct. The same goes for sites that have cat­e­gories with no prod­ucts in them or with only one or two items. Why even bother with a category?

What To Do About It

Think through your cat­e­gories and nav­i­ga­tion ele­ments care­fully before you start putting prod­ucts in your cat­a­log. Make sure that every cat­e­gory has at least a few prod­ucts in it, or else group smaller cat­e­gories together (or include them in larger, sim­i­lar cat­e­gories). Make it easy for cus­tomers to look through dif­fer­ent cat­e­gories, get to their shop­ping cart, and oth­er­wise move around your site.

Exam­ples

ecommerce screenshot

ecommerce screenshot

ecommerce screenshot

13. Not Includ­ing Ship­ping Rates

There’s no good rea­son not to include accu­rate ship­ping rates on your site. I’ve aban­doned pur­chases on numer­ous occa­sions because it said some­thing like “We’ll email you with an accu­rate ship­ping quote for approval before pro­cess­ing your order.” When shop­ping online, I want to be able to com­plete my order all at one time, with­out hav­ing to wait around for an email to decide whether the ship­ping charges are too high. Include your rates on your site, no mat­ter what.

What To Do About It

Most major ship­ping com­pa­nies and the USPS offer ship­ping cal­cu­la­tors on their web­site, and there are plu­g­ins or wid­gets avail­able for most major shop­ping cart sys­tems to fig­ure ship­ping charges on your site. Use one. If you can’t use one for some rea­son, then use a flat ship­ping rate that’s high enough to cover what­ever it is you need to ship. For par­tic­u­larly heavy or large items, you can always include a freight sur­charge in the price (just be sure to indi­cate that’s where the addi­tional cost is going).

Exam­ples

ecommerce screenshot

ecommerce screenshot

ecommerce screenshot

14. Not Includ­ing Store Policies

Before a cus­tomer buys from you, they’ll likely want to know what your ship­ping poli­cies, return poli­cies, and other store rules are. And there’s no rea­son not to post this infor­ma­tion in a FAQ or some­where else on your site. Mak­ing your store poli­cies clear upfront can save a lot of headaches later on from cus­tomers who are unhappy with an order they’ve placed.

What To Do About It

Use an FAQ or store poli­cies sec­tion on your site to spell out exactly what your rules are for dif­fer­ent kinds of cus­tomer inter­ac­tion. It’s some­thing that can save you tons of prob­lems down the road.

Exam­ples

ecommerce screenshot

ecommerce screenshot

ecommerce screenshot

15. Not Putting Focus on the Products

The goal of an ecom­merce site is to sell prod­ucts (or, at least, that’s what the goal should be). If your site puts more focus on bells and whis­tles or the design itself, it’s not achiev­ing that pri­mary goal. Make sure your site dis­plays your prod­ucts first, and every­thing else second.

What To Do About It

Think about how prod­ucts are dis­played in brick and mor­tar stores. While an in-store or win­dow dis­play may show a lot more than just the prod­ucts for sale, they all con­tribute to show­cas­ing the prod­ucts in their most flat­ter­ing light. Do the same with your web­site. Make sure that every design ele­ment present is doing some­thing to show­case your prod­ucts in their best pos­si­ble light.

Exam­ples

ecommerce screenshot

ecommerce screenshot

ecommerce screenshot

Fur­ther Resources

About the author

Cameron Chap­man is a pro­fes­sional Web and graphic designer with over 6 years of expe­ri­ence. She also writes for a num­ber of blogs, includ­ing her own, Cameron Chap­man On Writ­ing . She’s also the author of Inter­net Famous: A Prac­ti­cal Guide to Becom­ing an Online Celebrity.


© Cameron Chap­man for Smash­ing Mag­a­zine, 2009. |
Perma­link |
66 com­ments |
Add to del.icio.us | Digg this | Stum­ble on Stum­ble­Upon! | Tweet it! | Sub­mit to Red­dit | Forum Smash­ing Magazine

Post tags:

Twitter Updates