Designing your eCommerce store is not only about making it look good, but also making sure that it generates sales. Your goal is to make potential customers not only trust your site but have confidence in the product they're buying as well.

Your second goal is to make sure that they are able to navigate properly and quickly through the site. Not only do you want them to get to the item they're looking for quickly, but customers want their purchase to be quick and painless as well.

Here are 10 easy eCommerce design best practices that you can apply to your eCommerce store in order to boost confidence and speed up their purchasing process, ultimately increase sales.

1. Clear Call to Action Buttons

The call to action buttons on your site need to be easily visible and very clear as to exactly where they are going to take the user . Size, color, and design are three ways to make call to action buttons more noticeable to the user.

A well designed call to action button leads the customer where they need to go and where you want them to go. Make sure to enhance the most important actions; buy button, check out button, and shopping cart button.

Avon.com does a great job of bringing your attention to where they want it, the add to my bag (IE: add to cart) button. Although it might not be the best designed button in the world, it certainly grabs your attention when you land on their pages.

Avon call to action example

2. Make Important Info Public

Customers are more likely to buy products when they know exactly what they’re getting into; how much they’re paying, when it will arrive, and what to do if they’re unhappy with a purchase.

Easily informing them of information such as the estimated shipping costs, arrival times and return policy make them more at ease with making the purchase. Provide them with this information early and often. Anything that applies to a particular item needs to be mentioned publicly and obviously on that item's page. Anything that would boost sales, such as a Free shipping discount should be mentioned early and repeated.

Examples from REI.com. This banner is on the main page but is also repeated on every single product page.

REI refund banner

When clicked this pop-up shows:

The REI Difference and Guarantee

3. Easy Navigation

Crafting a well thought out categories and filters system for your users makes it easier and quicker for them to find the product(s) they want and make a purchase. Many times product filters and categories are either overdone or underdone, so be sure to approach creating them from a customer perspective.

When creating them, think about which filters would be needed to find product X, Y or Z. Asking customers questions is a great way of finding out if you’ve added too much or not enough. Send out a survey via email about your new or existing drop down menus and filters to find out more. You can even try challenging customers to find a short list of items and see how easy or difficult it is for them to find them.

Walmart.com provides a large but effective drop down ("drop side") categories list.

Walmart Dropdown menu

4. Multiple; Large and High Quality Images

Customers want to see what they are buying. Showing multiple camera angles and displaying the product in various ways allows the customer to see what the product looks like. A great way of demonstrating products is with a video showing the product from multiple angles.

Photos of the product help to show off the product, but photos of actual customers who are using/wearing the product shows a potential customer what it looks like when being used. Try providing a field where customers can upload/submit their own images of them using the product.

A study by compete showed that 1/4 of dissatisfaction with a shopping experience was the result of the product not being what the customer expected.

Naturals inc. Does a great job showing off a product with multiple high quality images. Notice how not only is the wallet shown from different angles but also opened and showing it's full functionality.

hobo international lauren wallet vintage leather

5. Provide Images of Product Variations

The product images in your eCommerce store are everything to the customer. Photographs allow them to see what they will be spending their money on. Having large -format, high quality images that the customer can see increases their trust in what they should expect to see when the product arrives.

But what if the product comes in multiple colors or design variations. Present at least 1 image for each color or design change. Even though a product may have the exact same specs, shape, design, materials, etc., when you change the color you can completely change the look of the product. Providing multiple images that show each product variation will reduce returns, increase confidence and increase conversions.

Trekt Outdoors provides a great example of portraying product variations. On products that have a different color, such as the cardigan shown below, they take a photo of each color variation and display them in an easily viewable format on the product's page.

Teryx arcteryx mens cardigan example

6. Add User Reviews and Testimonials

Providing customers with feedback from other users about their purchase increases trust in the product(s) they’re about to purchase.  Customers want to know about other people's experiences to see if it matches up with what they're looking for. Additionally, allowing users to submit public reviews can be good for SEO as well.

• Consumer reviews are  trusted nearly 12 times more than the description. (eMarketer)
• 81% of consumers say that the availability of customer reviews is ‘very important’ (33%) or ‘somewhat important’ (48%). (iPerceptions)
• 63% of consumers say they're more likely to purchase from a site if there are product ratings and reviews. (iPerceptions)

Sears has done a great job collecting customer reviews over the years. As a result they're able to provide a more in depth look into their products and recommendations.

sears kenmore washer review

7. Remove Forced Logins/Registrations

People hate nothing more than being forced to do something that they don’t want to do. Requiring someone to login or register before making a purchase only puts a wall between them and their objective, purchasing a product. This wall is unnecessary, especially since, after collecting their basic information: credit card info, address, name and email address, you can automatically create an account for them and email it to them.

The other options are to allow them to register/login, but have a guest purchasing route so that they may bypass the registration if they prefer or utilize social media login systems to register/login users.

Example by REI (again!)

REI checkout page

8. Progress Indicators (1-2-3)

Customers are becoming increasingly impatient when it comes to filling out online forms. Unless you already have the customer’s information on file, they’re going to have to fill out a few web forms in order make a purchase. To keep them informed about how long the purchase process is going to take, provide them with page by page progress indicators so they will know how long it will be before they’re finished.

Bed Bath and Beyond uses the traditional horizontal 1-2-3-4 progress indicator.

Bed Bath and Beyond Progress Indicator

WhatisBlik.com has an alternate way of handling progress indicators using a vertical numbered list. Each field then expands out once the last is completed, keeping you on one page for the entire process.

Vertical Progress Indicator Example

9. Shorten Forms

Make the process of filling out forms quicker and easier through shortening the number of required fields. This not only makes the customer happier but accelerates the purchase process. Remove any information fields that you don’t really need.

All you need is to collect their basic information: credit card info, address, name, phone(optional) and email address, then email the new account details after the purchase. Simply by following a link in the email, they’ll then be able to log into their new auto generated account and provide any optional information you didn’t ask for earlier.

Short checkout form example

10. Provide Smart Forms

To speed up the process even more try to implement smart form fields. If a customer enters a zip code, a simple automated database lookup will tell you the city and state of their address, and you can complete the city and state fields for them.

Lets be honest we’ve all tried to purchase something before, only to get a message like “please select card type.” This makes credit card type a good candidate for smart forms as well.

If a customer enters a card number before selecting the type of card, or forgets to select the card type, you can easily auto fill this information for the user by recognizing what their card type is with an analysis of the format of their card number. The most commonly used/accepted credit cards have the following formats.

Amex 34xxxx and 37xxxx

Visa 4xxxxx

Mastercard 51xxxx-55xxxx

Discover 6011xx, 644xxx, 65xxxx

More Our Tags:

Website Development Bangalore | Web Design Company Bangalore | Website Development Company Bangalore | Web Designing Company Bangalore | Web Designing Companies Bangalore