Best Practice for eCommerce Web Design

Posted by Helen

There are many aspects to consider when creating the optimal user experience for your eCommerce website design. You need to analyse your target market, how they buy products, what attracts them to convert and how they find your website. Business owners usually base their eCommerce website design on what they like, from the them to the checkout process, rather than thinking about the practicality of the experience for the customers who will be purchasing their product. This is often counter-productive unless the owner is trying to sell to individuals who use the internet exactly how they do.

For the purpose of this article we can break down some of the most important things to consider when designing the best user experience for your customers. The key areas to keep in mind are multivariate testing, branding and aesthetic, page speed and mobile optimisation. All these aspects of web design have changed massively over the last decade and even just the last five years. Therefore, eCommerce vendors need to continuously update their systems and what worked for them a couple of years ago may not work for them now.

Multivariate Testing

You may be asking yourself “what is multivariate testing?”, after all it isn’t something the normal person will come across on a daily basis and perhaps never in their lifetime. Multivariate tests allow you to test every combination of variable variation with every other combination of variable variation. If we remove the technical jargon, we can gain better insight into how exactly this can help your eCommerce website with the help of John Quarto.

For example, let’s say your product pages have four different headlines spread throughout them and you want to test five different variations of each headline. You’ll want to also test the best combination of the four headlines and their five variations. That means you’ll be testing 625 different combinations (5 x 5 x 5 x 5 = 625) to determine which one gives you the best conversion rate.

There’s nothing wrong with testing for everything and Google encourages that you do test anything that’s possible

Let’s say your page gets 1000 average views per day and you want to expose all your traffic to the variations you’re testing. You will be monitoring your average conversion rate and how much of an increase you want, perhaps 20 percent. According to Google’s current test duration calculation, that would take you 20,518 days to determine which combination would be the clear winner. That’s almost five decades and no one can afford to spend that amount of time on finding the most viable combination.

So, perhaps 20 percent is no the best goal for your conversion lift. Logic would dictate that getting a much higher increase, for example 500 percent, would take much longer but, in fact, the opposite is true. If we only change the percent increase and keep all the other numbers the same, Google calculates it will take just 81.25 days to identify a clear winner for your combinations. Now, you may be wondering why this is…

If you have an incredible combination that is capable of that level of conversion lift, it isn’t going to take long for the test to discover it. Either you come across the golden formula or you don’t, so testing for something as low as 20% isn’t worth your time.

Of course, there’s nothing wrong with testing for everything and Google encourages that you do test anything that’s possible. However, if you have lots of variations, you have a monster of a task to deal with. You can see how quickly the number of combinations can skyrocket into much bigger numbers and then you need to send tons more traffic and spend more time and money to achieve useful data. So, it makes sense to use only a fraction of the possible variables as it reduces the length of your test, finding results much quicker. Additionally, if the variables don’t affect each other, you only need to take a representative sample to collect data from.

Branding & Aesthetic

Successful eCommerce brands have their own unique styles, forming a following and recognition based on excellent products paired with a smart marketing strategy. A large part of their success is owed to a visual personality and captivating style that is targeted toward a very specific audience.

Nature's brands screen shot

The very first thing to consider is choosing the appropriate style for your business and to ensure that your customers can connect to and relate to your individual aesthetic. In an ideal world, this would be a style designed to elicit a “that’s so me” reaction when they view your website and social media posts. It’s key to think about your potential customers will feel when they see your graphics and imagery, which informs how they will respond and connect with your brand’s visual identity.

Once your style is established, you need to use consistent design elements. This will help you stand out from the crowd and form a strong following that reflects the style of your brand. Curating a unique yet relatable design aesthetic that people will quickly begin to associate with your brand, will help your business grow quickly. Some ideas for how to make your brand stick out are applying monochrome filters to your imagery or using big, bold typefaces that grab people’s attention. Whatever style you choose must remain consistent across all your branding and marketing.

When you’re setting up an eCommerce business, it’s easy to follow what other companies in your sector are doing but there’s a difference between inspiration and being the same. It’s a good idea to find your point of difference that sets you apart from your competitors and use it to your advantage. From here, you will be able to create your own original style that sets you leagues above other companies in your industry and create a noise among customers.

Now you’ve got your branding sorted out, you need to stay relevant and keep your marketing customer-centric. This involves understanding what your customers like and what they want to see – inevitably, this will be the ultimate decision maker for how you visually market your business. You are trying to attract a certain type of person and understand their style. For this, you need to put together a customer profile with everything you know about them. Think about their age, what car they drive, what sport they play, what kind of coffee they drink and what they do on the weekend. This will inform how you create your unique graphic style tailored to your audience. Being aware of the competition is important but remember that not everyone is your rival. Collaborating with equally captivating brands can be an excellent way to expand your business and get your brand in front of an audience you wouldn’t normally reach. The best collaborations have that “wow that’s cool” effect on their target audience, while keeping in mind the consumers wants of both brands effectively.

Page Speed

The impact of page speed on the user experience is one that is very much underestimated by many people when developing their website. It’s a core component that directly affects conversion rates, as increased loading times mean that visitors are unable to perform the necessary actions for conversion. An inability to perform such actions decreases a potential customer’s interest and often leads to abandonment. When this becomes a problem affecting a wide range of users having an unsatisfactory experience, the conversion loss can be drastic.

  • Websites that take three seconds to lead experience 22% fewer conversions than a site that loads in one second.
  • Just one second of delay in mobile page loading times equals a 7% loss in conversion.
  • The percentage of online shoppers that abandon their shopping carts because the process was taking too long is 21%.
  • This number increases massively for mobile users, with 66% of mobile shoppers abandoning eCommerce shopping carts because the page loaded either too slowly or never came up at all.

As the numbers show, there is a direct relationship between page speed and conversion rate. Even just a one second delay can make all the difference in the world of eCommerce.

There are many software solutions for speeding up your page speed where you can fine-tune website elements to optimise the user experience. Firstly, you can make sure the appropriate load order is set up for page components – loading essential above-the-fold elements first to give the perception that the page is loaded, while below-the-fold elements are being processed. Secondly, you can minimise the JavaScript code on your website – remove excess spaces, comments, unused lines of code etc, as these can easily inflate the file size of your code, which directly affects load times. Finally, your website will have lots of images by nature, so compressing your images with something a third-party plugin can help reduce the load when processing your website.

One last thing to think about is how page speed affects your search engine ranking and therefore has a knock-on effect on conversion rates. When Google is determining the search rank of a website, its algorithms consider how fast a page responds to web requests. The longer your website take to respond, the lower your website will rank and therefore your organic exposure is reduced. Obviously, with less traffic to your eCommerce website you will have fewer conversions.

Mobile Optimisation

Over the last few years, mobile search volumes have exploded and most intriguingly this has changed the online shopping space. Mobile searches are more goal-oriented than desktop and this results in a drive in mobile conversions for eCommerce websites. As a result, it has become clear that people are buying both directly and indirectly from their mobile devices. This means that not only do eCommerce websites need to be mobile friendly but also stores made of brick-and-mortar do too, otherwise they will lose business.

Everyone hates bad websites and if people can’t find what they want on your mobile site easily, they will look elsewhere. Statistics show that 67% of shoppers are more likely to buy from a mobile-friendly site than one that’s not optimised for mobile.

Think back to the times you have viewed websites on your smartphone and how your behaviour changed depending on load speed or if they weren’t formatted poorly. You’ll have moved on and so does everyone else when put into the same situation. Offering a seamless mobile use experience is critical to eCommerce website performance, perhaps more than any other kind of website. It should be intuitive to use, be easy to navigate and have a clear checkout system that works quickly.

Having a responsive design is the best option for a mobile-friendly website because it eliminates many of the most common website usability issues found on mobile devices. A responsive website reacts to the screen width which helps It rebuild and adapt to the display being used. It makes it compatible and effortless to use on all devices. It also has strong SEO benefits since the website is being served from the same URL and doesn’t need to be crawled separately for a mobile sub-domain. This also makes website maintenance easier because everything will be replaced at once.