Site Clinic: Basic Principles Of E-Commerce Design

Posted by: Date: June 06, 2008

by Jackie Baker

Mary Beth is an independent distributor with Flint River Ranch, a company that sells all-natural dog and cat foods. She sent me a plea for help: her site, Pets Love Flint River, is only generating a sale every few months.

Utilize a right-hand column
Studies have shown that a three column format is the most effective layout for e-commerce websites.

Left Column: navigation. (Links that are organized, easy to scan, and left aligned!)

Center: Content. All of your product information goes here.

Right Column: Call to action items and other features.

The right column is a great place to put buttons/links for “view cart” and “checkout.” These are most effective when they are bold, designed to look like buttons, and incorporate traditional icons like a shopping cart. These should be a contrasting color that stands out from the rest of the design. Underneath the shopping cart buttons, you could incorporate secondary and tertiary calls to action such as “request a free sample” or ” become a distributor.” You could also use this space to incorporate testimonies.

Unless it’s a requirement of the company, I’d move the distributor notice that is currently to the right of the header, and incorporate it as an actual page under the link “distributor info.” Or, it could be incorporated in the footer. While this is important information, it is getting too much attention and could potentially be driving visitors away.

Make the Checkout Process Smooth
One major issue with the checkout process on PetsLoveFlintRiver.com is that there is no navigation. If you start checking out, but want to add a different product, there is no way to get back to the shopping pages. There’s no link to home, to shipping information, or to contact. Visitors need to be able to return to other pages without having to click the back button. All global navigation links should still be a part of the checkout pages.

On a positive note, the checkout process on PetsLoveFlintRiver.com is as simple as possible. The less you ask for, the more likely visitors are to give it to you. Another well-done piece is the error page; if a visitor skips a required field and tries to submit the information, they are given an error page that says exactly what information is missing. They are then sent back to fix it. On the other hand, poorly handled errors are a quick way to lose a customer.

I would also suggest making the action buttons (“continue” “add to cart” etc) a color other than green. There is so much green in the design already that a contrasting color like blue or yellow would stand out better. On another site I recently reviewed, the color of the “add to cart” button blended in and I recommended changing it to red or something else bold. All the site owner did was change to color and add a shopping cart icon and his purchasing immediately went up around 200%. Sometimes the smallest changes make the biggest difference.

It’s Not Always Just About SEO
The basic optimization done on the PetsLoveFlintRiver.com is causing the site to rank well for some branded terms that are relatively competitive. But getting visitors to come to your website doesn’t do any good if they are unable to find their way around. Cleaning up the navigation and making it obvious that this is an e-commerce site should go a long way to boosting online sales.

Want more from your web site?
Search Influence can help! Targeted Traffic. Increased Revenue. Results Guaranteed. Customized Internet Marketing you can afford.