E-commerce website design tips

Ecommerce Web Design Tips

Back in the “noughties”, you could get away with a poorly designed e-commerce site but, times have changed. Consumer expectations have significantly increased, and the average attention span has dropped considerably. Giant leaps in technology and faster broadband speeds has led to mass adoption of laptops, tablets and mobile phones. In turn, this has led to online shopping overtaking brick and mortar sales in many industries. Excellent design is now expected by the consumer and therefore crucial for turning website visitors into customers. Here we explore crucial E-commerce website design tips to make your online shop a roaring success.

Optimise with Data

F Pattern Heat Map
Image credit: Instapage

Your eCommerce web design should be optimised to generate sales efficiently. One way to do this from a high-level view is to use readily available data. For example, multiple studies and heat maps (in-depth tracking of how the user interacts with every part of the page) have shown that people tend to view websites in either an E or an F formation, meaning that the eye starts at the top-left corner and works its way horizontally across the page. It then moves down the left side and horizontally again, so on and so forth. Depending on your niche, it’s usually advisable to have no more than three or four products per row in your product catalogue. Sticking to this rule of thumb guideline will keep your pages visually appealing and easy on the eye.

Navigational Menu

Bear in mind that many of your website visitors will likely have a specific product already in mind when they visit your site. The configuration of your menu now has an important part to play. A well designed navigational menu will allow users to easily navigate the pages of your website to find what they are looking for quickly and efficiently. Your navigational menu should appear across all pages for maximum ease, preferably across the top of the page (with the possible exception of landing pages or squeeze pages). If you have a large number of categories and pages on your website, you could use drop-down menus to display them in an organised way that doesn’t cause sensory overload. In some situations, you could use menu bars vertically, along the left side of the page to still accommodate the F format.


For online e-commerce stores with a large number of products, consider offering a prominent search facility. Having a search bar will allow the customer to find the product they are looking for quickly without having to scroll through pages of information they have no interest in seeing.

High-Quality Product Photography

E-commerce Product Photography

Every business (but especially E-commerce businesses) should not underestimate the importance and power of high-quality photography of their products and throughout their website. Having powerful visual imagery on your site will not only attract customers and encourage them to purchase products, but it will also strengthen your brand image in your marketplace. Where appropriate, use lifestyle images of people using or interacting with your products. Don’t forget to keep plenty of white space around each item; this will allow the user to take in each image on its merit and differentiate between products.

Don’t forget to retain honesty with your photography (and descriptions). You need to show your products in their best light, but you don’t want to create disappointment when it arrives at your customers’ door.

Clear Shipping & Return Policies

A similar rule applies to delivery. In addition to using accurate product photos, descriptions and clear pricing information, you must make your shipping and return policies clear and easily accessible on your website. Always be upfront about shipping costs and make sure customers are aware of shipping policies applicable to them. Ensure that your customers can see the total price of a product, including shipping, before making a purchase.

Make it Personal

For most industries, It’s a good idea to include additional information about your brand, a personal story of its journey, and the people behind it. Maintain an active blog, and offer an option for website visitors to sign up for an email newsletter (an invaluable tool to increase sales). However, make sure this additional information doesn’t distract the visitor from making a purchase.

Pop-Ups - Good or Bad?

Ecommerce Popups - Yes or No?

A similar rule applies to delivery. In addition to using accurate product photos, descriptions and clear pricing information, you must make your shipping and return policies clear and easily accessible on your website. Always be upfront about shipping costs and make sure customers are aware of shipping policies applicable to them. Ensure that your customers can see the total price of a product, including shipping, before making a purchase.

Product Filter

It’s pretty annoying to find the perfect pair of shoes online, only to realize that the store doesn’t have your size in stock. A good product filter will allow users to search for the product they want while ensuring that the results they see are relevant and specific to their requirements. In short, a product filter will make the navigation process as seamless as possible.

Contact Options

If possible, there should be plenty of options for visitors to get in touch. Even if they don’t need to, it helps to know they have multiple methods of contacting the store should the need arise. It will raise the trust level of your website and improve conversions. A visible email address may be useful for the customer, but it can lead to you getting inundated with spam. A contact form that doesn’t reveal your email address may be a better option. Displaying a phone number is extremely important and if possible a landline. Display your hours of operation clearly and let the customer when they can make contact. Again, this will depend on your industry, but it may also be a useful tool to have a widget that lets them send a Facebook message to your company directly through the website.

Personal Information

It’s natural that we become suspicious when we asked for personal information (I try to avoid forms that ask for a phone number). Only ask for the information you need for them to make a purchase. Also, make sure you include having a ‘guest’ checkout option. Having to create a whole account on your site can also turn them away faster than you can say “cart abandonment.” Only request the necessary information (for example, their shipping address, name, and payment information). If you want to collect other information, then consider using follow-up communication (with their consent of course) or your thank you page to obtain this. That way you won’t distract from the purchase.

Have a system in place so that once you’ve made the sale, the customer is redirected to a thank you page. Order confirmation or thank you pages are helpful when tracking conversions (especially through paid ads such as Facebook). They also provide clarity to the customer, so they know their order has been successful. Ideally, you would also send them emails regarding the processing stages of their purchase.

In 2019 it should go without saying but, having a responsive layout is essential. It allows your website to adapt to screen size, device type or operating system, It used to be the case that companies would have a separate mobile website, but this is rarely required anymore.

Prevent Information Overload

Most likely, a user came to your website because they were interested in buying (or at least finding out more about) one of your products. They didn’t come to read a novel (unless you’re selling books, of course). By organising your information into short paragraphs, bullet points, and sometimes even infographics, you will make it much easier to digest and therefore increase the likelihood that people will read it.

Effortless Web Design

Think about last time you purchased something from an e-commerce shop. Did you consciously think about the design of that website? If the design were doing its job well, it wouldn’t have demanded your attention. It would have quietly allowed the products to shine and would have made your purchase as seamless as possible. However, what about the last time you left an e-commerce store frustrated, and abandoned your shopping mission (perhaps before even reaching the cart). Unless it was a product issue, it’s highly likely that design was top of your mind. Poor website design stands out and may make customers confused and irritated, and this will ultimately affect conversion rates and profits.

Understand Your Market

At WDM, one of the questions we always ask is, “What do you want customers to feel when they come to your site? Safe & secure, edgy & excited, cool & exclusive, a sense of belonging?” It’s a question that usually creates an awkward pause, but it’s essential. If you’re a fashion brand, you may want visitors to feel inspired, if you’re a toy company you might want them to feel happy or excited.

A critical factor of good design and branding, especially in e-commerce, is understanding your target market. What does it want deep down? Why should care about your product over others? A good web designer will help you achieve this (providing you give them the right information, to begin with).

Have A Realistic Budget

It’s important to keep costs down in any business but before you contact a designer, have a realistic budget in mind. Remember, your website isn’t just a cost – It’s an investment in your business. There are plenty of web designers that will build a website for only a few hundred pounds, but if it’s just designed to look nice rather than convert visitors into customers then going cheap will cost you a fortune in lost sales. If you’re getting a website built for the first time, then have a read of our six golden rules for hiring a web designer.

Online stores will generally have a blend of both content and commerce to cater to new and returning visitors (the only exception to this would be a sizeable generic brand that sells everything). If a customer is visiting for the first time, they may wish to engage with your brand’s story to see if it aligns in any way with their values or beliefs.

In summary, you can have the most beautiful design in the world, but if it’s not simple to use, potential customers will get frustrated and leave your online store almost instantly. The cost of a professional website designer will pay for itself fairly quickly. A good designer won’t merely build something you like the look of, they’ll use your ideas to create a website that works for your business. Make sure that your designer follows these simple E-commerce website design tips and you’ll have a great platform with which to build your online business.

Ready to tell us about your project?

Free Guide...
5 Steps To A Winning Website

Make sure your next website is a success!

Get free advice to grow your business...

More To Explore

Christmas holidays composition
Mind Your Business

Merry Christmas and Happy Holidays

As we approach the Holiday season I’d just like to take this opportunity to thank all of our wonderful clients and wish you all a


Want helpful advice to grow your business online?

Our Newsletter Subscription is Free!

Get Your Free Guide On The 5 Steps That Are Crucial For A Winning Website Project

Learn how to make your next website project a winning one, starting with this free guide.

We hate SPAM and promise to keep your email address safe. Here’s our privacy policy.