Increase E-Commerce Sales With These 4 Design Tips

Written by Tom Ewer on April 22, 2014 Blog, Sell Online.

Having a good product or service is your best bet for running a successful online store. But how you present that product or service plays a major role in how it is received by your target audience and whether or not you’ll see your conversion rate slope upwards.

Yep, I’m talking about web design here. You obviously want a site that looks good, but there are some specific things you need to pay attention to if you want to boost sales on your e-commerce site.

Here are four design tips I’ve found particularly helpful when trying to optimize an online store with increased sales numbers in mind.

1. Clear Navigation

clear-navigationWhere the navigation menu appears and how it looks plays a major role in how your potential customers enjoy their on site experience. For instance, the  primary navigation should always be highly visible and in a predictable place. Typically, navigation appears on the very top of a site or along the left-hand side.

It’s also important to keep the menu as simple as possible. It shouldn’t be loaded with too many categories in a tiny font size. You should list only the most important and most broad categories in this menu. If your content must be categorized further, drop-down menus can be employed that disappear when the user isn’t hovering on that specific option. The key is to keep everything accessible but not cluttered.

Another part of navigation is a search bar. While it’s not always featured along the top of every website, it most certainly should appear in this space on e-commerce sites. It’s customary and expected. Remember: it’s fine to stray outside the lines and be creative, but you shouldn’t defy customer expectation with regard to the shopping experience itself.

It’s perfectly okay to have multiple navigation menus as well. Very large e-commerce sites tend to have the main navigation across the top with a secondary menu along the left-hand side for product categories. This keeps everything visible and within reach, so to speak.

2. Featured Items

Organized navigational options is a good thing but it won’t necessarily attract your customer’s attention. That’s why it’s important to feature some items on your home page to draw the visitor’s eye. This will not only increase sales. It will also give visitors a sense of what you’re about at a glance. Remember, customers don’t want to have to work to buy your products, so offer up a few options from the get-go.

One way to really make products stand out is to use the WooSlider Product Slideshow. This extension allows you to use the WooSlider plugin to pull products from your WooCommerce store and display them in a responsive slideshow wherever you want on your site.

A good way to handle this is to feature items that are seasonal or you’re currently trying to promote. Beyond that, you should also include a few featured items at the bottom of individual product pages. This can typically be handled with a plugin, too. Don’t worry — there’s no need to manually adjust these listings. What you feature at the bottom of a product page could be an upsell as well.

It’s important to think contextually here. What’s something that complements what a customer is interested in buying? Amazon Product Recommendations are a good example of this kind of upsell. You keep them on a specific product page but offer something related in an effort to bulk up an order.

But what if you want to change a few details on specific product pages? Then you might find the WooCommerce Conditional Content extension useful. It makes it simple to display messages on specific products that are about to go on sale or out of stock. It also allows you to display messages on the user’s shopping cart when products you designate have been added to it. It’s another way to upsell, and a very sleek one, at that.

3. Reviews and Testimonials

292642699_8e8a8b5aa8While it’s still somewhat customary to include testimonials on their own dedicated page for service-oriented businesses, it’s a much better idea to include them on your home page and dispersed throughout your website. Why? This way, someone who’s not necessarily looking for feedback on the caliber of your services can’t help but see what others think of you. And that’s really important because it might be just the thing to turn a prospect into a customer.

This is even more important for individual products. Enabling product reviews from customers provides shoppers with a sense of comfort. They feel like they can trust you because you allow the opinion of previous customers to be displayed on your site.

It’s simple to integrate this ability into your WordPress site. The most basic store site typically allows for product reviews. If you want more robust review options, you might want to consider a WooCommerce extension like Social Review Engine. This plugin is designed for WordPress sites and can be set up in minutes. It adds social media integration to reviews, which can help increase search engine rank and makes it easier for customers to share products they love.

4. Easily Accessible Information

We’ve already discussed the importance of clear navigation menus, but in a broader sense, how you display information on your site may be even more important. Your home page should make it easy for customers to identify what your store is all about from the get-go. From the images you use to the copy you write, it all should reflect your brand and illuminate your business at a glance.

It’s also a good idea to create a resource section on your site. This should be clearly identified in the top navigation menu and include FAQs and any other information you think would be helpful to your customers. It’s a good idea to include shipping information and rates, as well as return and refund info in this space.

You should also consider blogging on a regular basis. This is the perfect way to make store announcements and offer up discounts or coupons. And by putting this kind of info on your blog, you’re following customer expectation.

And remember to include links to your most resourceful posts in your FAQs to increase on-site time and further promote the sense that you care about the customer’s experience.

Finally, on individual product pages, make sure the pricing information is easy to read and in a highly visible spot. Don’t make the customer scroll for it; keep it above the fold and visible at a glance.


While your primary concern when building an online store is offering a good product that people will love, you also need to think about the user experience. A major part of UX involves your design choices. How you present information can have a direct impact on how your customers perceive your store and whether or not they’ll add items to the cart and actually checkout. It will pay off then to take some time evaluating where you’ve placed featured items, how you’ve highlighted important information, and what you’ve done to bolster trust.

Do you follow these design tips on your online store? Please let us know what design elements and item placement decisions you’ve found to be the most successful in the comments.

Image source: Markus Goller, Matt Biddulph, joeltelling


8 Responses

  1. Arafin Shaon
    April 22, 2014 at 7:14 pm #

    Got to say incredible indeed! Really incredible tips mate.

  2. Jon
    April 22, 2014 at 11:34 pm #

    How much testing and research went into these tips? There has been research that says sliders kill conversions not increase them!

    The best way to improve your design with conversion in mind is to do A/B testing, though woo doesn’t have a plugin for that! You can do some minor testing but being able to swap in different page templates at all the different stages of the e-commerce process (shop index / cat index / cart / checkout / etc) would be really useful.

    I suggested it on the ideas board ages ago though it’s never got any traction, please go add your votes!

    • Warren Holmes
      April 24, 2014 at 9:43 am #

      That article talks about using sliders on your homepage, in our article we mention using a slider on your product page which I think can be effective if you have a lot of images for your product.

      Have you taken a look at A/B testing platform like Optimizely and Visual Website Optimizer? All you need to do is drop in some JS code on your pages and you can do any kind of testing you want from their backend. We’ve used A/B testing to great success on some of our pages 🙂

      • Grumbledook
        April 24, 2014 at 12:01 pm #

        Thanks, I’ll check them out.

      • Muhammad Umair
        May 23, 2014 at 9:12 pm #

        Google Analytics also comes with a nice A/B testing feature.

  3. Rahul Sharma
    April 23, 2014 at 10:14 am #

    Are you ever going to release any theme? Because I was here for that and I don’t think you guys are serious about themes anymore 🙁

    Right now I really care less about woocommerce. I am happy you guys are doing great with it, but please stop disappointing your older customers.

  4. Savidge4
    May 12, 2014 at 8:40 am #

    To slide or not to slide, that is the question. Understanding that there are studies that suggest not using them, keep in mind that there comes a time when a fad becomes mainstream. When it comes to implementing something such as a slider to a site, you can do all the A B testing you want. The reality is that A B testing on 100 visitors a day really is not good quality A B testing. I personally look to the giants in the e-commerce world and see what they are doing. Sony has been using them for YEARS. Gap on the other hand started recently. With no question you know they A B tested the daylights out of this with FAR more traffic then we could imaging having.

    The one thing I have noticed, is many are only partially changing the slider images. Leaving the text the same but changing the image. In the case of Gap, they are using the same text, just transitioning an image of a man and women. Another thing I have noticed, is the transition time. Much longer than one would expect. Again this comes down to good solid A B testing.

    I suggest testing less and paying more attention to that line between fad and mainstream.


The most customizable ecommerce platform for building your online business.

  • 30-day money-back guarantee
  • Support teams across the world
  • Safe and secure online payment
%d bloggers like this: