Loading Jaywing website
12 February 2020 / News

Five Steps to Effective Ecommerce Website Design


If your business sells products, the chances are, you’re going to need an ecommerce website to allow as many customers as possible to buy from you.

However, with so much competition out there, it can be difficult to stand out from the crowd, never mind get customers to buy from you once they land on your site.

Effective web design has become more important than ever to provide customers with everything they need and want in order to make a purchase.

Good ecommerce design is all about convincing and leading customers to purchase from you by providing the best user experience and presenting your brand in the best possible light.

As we’ll outline later, when it comes to any web design project, the first and most important step is collaboration. With this in mind, we’re practicing what we preach and have collaborated on this blog post.

Rose Mountague, our Creative Director and Emma Travis, our Head of CRO and UX have been discussing the five key steps to achieving effective ecommerce website design.

Step 1: Collaborate

As we’ve already mentioned, collaboration is key to effective ecommerce web design. No design team should be left to design any element of an ecommerce website on their own.

It takes a team of people to ensure that the resulting website does everything it needs to do.

Involving CRO, UX and development teams in sketching sessions when starting to define the layout of information, functionality, calls to action (CTAs) and imagery to ensure that user objectives, brand, conversion and functionality are considered ahead of any design work that takes place.

These sketches can then be transformed into working prototype wireframes which we can test with real users to ensure the page is behaving in the way we want it to before investing time designing each page.

When it eventually comes to the design stage, armed with this information, designers can be confident that elements of the web page are positioned and function correctly, so they can spend time overlaying brand and crafting design elements and interactions to complement the agreed wires.

Step 2: Keep it clean

When it comes to ecommerce design, less is always more so avoid cluttering the page with too much information.

A huge problem that many brands face is that their new websites become outdated very quickly because design and technology moves so fast.

So, busy and crowded designs are likely to look outdated quickly, whereas simple design will stand the test of time.

Some elements and personality are bound to shine through on pages like the homepage and content pages of your website but when it comes to product and checkout pages, it’s important to keep things simple and focus purely on the product.

The product should always be the clear point of focus on any product page. This means that successful ecommerce sites don’t need ‘designing’.

Your products are the hero, you are simply designing the container to allow them to shine and make them easy to view and buy.

Any call to actions (CTAs) included on your product pages should be obvious and direct users to take the next action to help maximise conversions.

Step 3: Beautiful imagery

For any successful ecommerce website, accurate and attractive product imagery is essential.

Spend time investing in the right photography and photographer so you can really let your products shine.

Keep imagery varied! Never limit photography to just one shot, you need to display a mix of individual product and lifestyle shots, showing your product in action or in situ.

This will really help customers to visualise and see themselves using, wearing or interacting with your product.

Whilst it’s important to have varied imagery, you should also keep your photography style consistent throughout your site.

If you choose a particular style of photography for one group of products, you should ensure you keep this up for your whole portfolio.

Organising your product shoots in batches will really help with this so make sure you run regular shoots or have the ability to get product shots easily when new products launch to make sure they tie in with the rest of your product portfolio.

Consistencies go right down to image size and ratio, so ensure you keep this in mind when designing your site and planning your shoot.

Product imagery is likely to need to be repeated throughout the site, so ensuring that the image can be scaled and work in the different layouts and sizes you need will save you a huge job when it comes to image production.

Ensure your design team are involved in your shoots or that they are aware of what image assets you have ahead of design.

Its also essential to understand how your ecommerce provider handles imagery in the back end up front so you are aware of how much time and effort you will need to spend on image production.

Producing image guidelines and specs will help your image production team to ensure they keep all images consistent and to the right spec.

Step 4: Make it really easy to buy from you

Making it easy for customers to buy from you goes hand in hand with making sure your website is clean and clear.

It’s important to make sure your USPs are easy to see on each product page. For example, if you offer free delivery, make sure it’s clearly highlighted.

Throughout your website design, you should hold the user’s hand and guide them through the sales process as much as possible.

Autocomplete forms make it easy for the user to sign up for an account, a newsletter or to checkout. Make sure you only ask necessary questions at the checkout or you may put some customers off!

Always follow conventions on the checkout page and avoid creating a long checkout process – the fewer steps the better! Think about how easy it is to buy from companies like Amazon.

Having as many payment methods available as possible will help as many customers as possible to convert but they should be displayed and made obvious throughout the site.

If you have any trust elements such as product testimonials or reviews, make sure you highlight them wherever possible.

These can really influence user behaviour so making them obvious on a page is key to reinforcing that the customer is making the right decision.

Another element of best practice is to visually display progress on in the checkout process so that the customer can see how far along the checkout process they are and how much further they have to go.

Having a guest checkout option is also a must for those first time buyers who might not be ready to share their contact details with you just yet.

Forcing users to create an account before they can make a purchase can reduce conversion rates, it interrupts the checkout process which customers want to be as quick and smooth as possible.

Step 5: Always test!

Although there are some standard guidelines and best practices for all e-commerce websites, remember that what works for one site, doesn’t always work for another.

Different product ranges, price points and audience needs all impact on how users shop and, as such, the effectiveness of one design over another.

This is where A/B testing comes in, the only way to really create a truly effective e-commerce experience is to test and learn what works and what doesn’t for your customers.

Get in touch with our team to find out more about how to design your eCommerce website for success.