This is part one of a two-part series on eCommerce design best practices.
Design plays a crucial role in how customers view your online store. You may be tempted to get artistic and add unique elements like flash animation and off-beat colors—but flash animation can slow down your shopper’s browser, and some colors can send the wrong signals.
When in doubt, the tried and true elements of eCommerce design represent best practices for your eCommerce store. Here are 10 tips (in two parts) for following best practices in eCommerce design.
01: Make your shopping cart visible on all pages.
While it seems like a simplistic design element, it’s important to make sure shoppers can see their order queue, no matter where they are on the site. Making your customer’s cart visible is easy when you use contrasting colors to set it off from the rest of the page.
Shopping cart visibility is beneficial for the customer because it gives them the peace of mind that all of their purchases in queue have registered. It also makes it simple for the customer to head straight to the checkout process wherever they are.
02: Get rid of checkout distractions.
Think of your checkout as tunnel vision: the goal is clear, and the path should be just as clear. Eliminating distractions like sidebar navigation makes it easy on the minute web attention spans that we all share as online shoppers.
Ignore the urge to continue selling during the checkout process. You only have a few minutes to make it from checkout to sale.
03: Calls-to-action are best for buttons leading to checkout.
You don’t want your customers to find your online store too pushy—but the opposite, an eCommerce site that is too passive, can hinder sales even more. "Add-to-cart" buttons should boast some kind of call-to-action, not passive statements like "learn more" or "more details".
Instead, consider plain old "add to cart" or "buy now"—phrases that encourage the customer to purchase your product. Pay special attention to colors here; blue and green encourage users to buy, while red and orange can turn them away.
04: Simplify navigation paths.
You want to avoid clutter on your page—but what if you have lots of product categories? A good way to remedy this without cluttering the page is to employ fly-out menus, listings that pop out when the mouse hovers over them.
Breadcrumbs are crucial for navigation. Clicking a “back” button sometimes causes “post-data” notices to pop up; breadcrumbs offer customers easy ways to get back to pages without losing any data.
05: Auto-complete makes searches more intuitive.
Page search features don’t always return the results your customers are looking for. You can’t always count on the customer to know the right search term of phrase; adding “autocomplete” functionality to your search box is a gentle way to direct customers to the products their searching for.