Blog 4 minutes

5 tips to improve your e-commerce website design

Andrea Rijna
July 22, 2019

How does a great e-commerce website design contribute to your online success? The answer is simple: it helps you boost conversions.
But what if you don’t have much time to spend on your design, you don’t have an in-house designer, or you’re not the most creative person? There are still some easy and impactful steps you can take to optimize your web store design. In this blog post, I’ll be sharing 5 simple and easy tips to help you improve your e-commerce website design, content and customer experience.

Why e-commerce website design matters — Also in B2B

My global customer success colleagues and I have the privilege of helping Sana Commerce customers on a daily basis to become more successful with e-commerce. As most of my customers are focused on B2B (business-to-business) e-commerce, they spend a lot of time managing large amounts of products in their catalog, sometimes up to 300,000 or more. This often leaves little time to spend on designing their web store.

However, offering your customers a great online experience is key. Although B2B e-commerce is often more traditional than B2C (business-to-customer) e-commerce, your B2B customer is still a consumer in their free time. They might order new gadgets on Amazon on Sunday and then go to your web store on Monday morning to order spare parts, coffee or other supplies. The experiences that they have in their private life, is the bar that they set when they visit your e-commerce website.

And if they have a poor user experience, they might decide not to purchase from your web store — or they might simply not be able to find what they are looking for!

Download the B2B buying process report

Because having a great e-commerce website design is so important, 60% of Sana Commerce’s current development resources are dedicated to making our e-commerce software even more flexible and advanced in terms of content management and design.

User experience and conversion matter. So, let’s get to it.

Tip 1. Optimize your photos and product images

Stretched out pictures, blurry images, huge image sizes or no/little product photos at all. We’ve seen it all. Make sure to use images on your content pages that are of good quality and not too heavy in terms of file size. This will increase the performance of your web store and your customers’ user experience.

So, I would advise you to do the following:

  • Compress your images and find a balance between size and quality, especially with full-page banners. Adobe Photoshop, is, of course, the most professional design software, but that also comes at a high cost. There’s also software like Affinity Photo or Luminar that aren’t expensive and will work perfectly to compress your images.
  • Invest time on taking photos of your products. Your customers are more likely to buy products if they can see what the product looks like. This applies even to customers who always order the same products. The better the picture, the more attractive the product. Conversion is influenced by many psychological factors, including a subconscious feeling of security. Your customers want to be sure that they are choosing the right item when they order your products.

Watch the webinar on B2B e-commerce best practices

Tip 2. Build dynamic page designs with a mix of content blocks

Content blocks are building blocks that you bring together to create your webpages. These can be image sliders, text blocks, and videos, but also newsletter and Twitter feed content blocks.

To create a great e-commerce customer experience on your website, you need to mix and match your content blocks. Pages that are mostly white and lack color and images can quickly become dull to customers. Creating a contrast helps your customers identify the different types of pages. It also makes your pages come alive, showcasing your products and company in a better light.

Our B2C customer Natura has built a great website that provides its clients with an astounding e-commerce customer experience. They are experts in using full-page image sliders, product sets (like best-sellers) and services content bars (shipping, service, etc.), and linking to other pages on their website. Note that their use of photos and product images also contributes to a stunning web store design.

Screenshot of Natura Brasil's e-commerce website design

Natura’s e-commerce website design

Sana Commerce has many content blocks available in the standard product. My personal favorite is the video content block.

Tip 3. Create a well-converting conversion path with the right color usage

You can use color to guide your customers towards the pages/paths that are important to your web store. It all starts by using contrast — a dark text and button on a dark image, or a light button on a light page won’t stand out. If a certain button or call-to-action is relatively unimportant, give those buttons a neutral color. If a button should lead to a conversion, make that button a color that stands out.

Do you want your products to convert well? Then you can influence your customers on their way to the checkout by making all the important buttons the same, eye-catching color. We call this a conversion path.

Your company probably has a style guide. When you pick a color palette for your e-commerce website design, try to pick the most eye-catching colors from your company style guide. If your style guide doesn’t have any eye-catching colors, you might want to consider expanding or adjusting your guide to contribute to your online conversion. Our customer Kippie managed to develop a great e-commerce customer experience that matches their brand identity. Their conversion path stands out and has achieved great results.

Best examples of web store displaying products

Kippie web store design

Tip 4. Help your customers easily find your products

Is your e-commerce website’s main menu overflowing with categories, subcategories, brands and other information? Then it’s probably difficult for your customers to find the products or pages that they are looking for. How can you solve this problem? That’s easy: just keep it simple!

Here are some examples of how you can simplify your product catalog:

  • If you have too many items in your main menu, think of ways to regroup them to make your main menu less crowded. Do you really need to mention 10 types of tires? Or is “tires” enough for your customers to understand that they need to click there to find the right tire?
  • Leave out categories that are less important.
  • Create a separate landing page or product carousel for seasonal promotions, trending items, etc. to make them stand out.
  • If your assortment is simply too big and targets both B2B and B2C customers or products with a different purpose, consider setting up separate e-commerce websites. This will allow you to offer more relevant content to your customers.
Maddox drop down menu on homepage

Web store design optimization

Learn more about how to manage your e-commerce product catalog with our 8 best practices.

Tip 5. Ask your customers for feedback on your website design

All successful e-commerce websites have one thing in common: customers that love using it. Although we sometimes think that we know what our customers want and how they work, we probably don’t know everything. There’s only one way to find out: collect customer feedback. Ask questions like:

  • How do you research for products?
  • Why would or wouldn’t you use a web store or customer portal?
  • Which features influence you to make online purchases?

When you’re a B2B company, you have the unique advantage of having a good relationship with your customers. So, send out a survey, give 10 customers a call or ask them to get together in a room for a feedback session. The outcomes will truly help optimize your e-commerce website design.

Find out more about how to capture B2B customer feedback to improve your e-commerce customer experience.

Download the free marketing guide for B2B business

More e-commerce design and content tips

Optimizing your e-commerce website design will lead to happy and well-converting customers. Adding in images, content blocks and color doesn’t have to take too much of your time and can have a massive impact on your business. So, make sure to gather your customers’ feedback, grab your style guide and get to work.

Want to take your web store to the next level? Check out our additional resources for B2B and B2C web stores:

If you’re a Sana Commerce customer, feel free to reach out to your team for personal advice on your website design and how to become more successful with e-commerce.

Online marketing best practices to drive e-commerce sales

Get our marketing guide