Best UX Practices For Your eCommerce Website Design

By: Idea Theorem
14 March 2018
8 min read

What is eCommerce?

ECommerce has become an important part of the economy. Statista anticipates a 246.15% increase in worldwide eCommerce sales from $1.3 trillion in 2014 to $4.5 trillion in 2021. There are massive opportunities for global eCommerce that are too good to ignore. Every product-based startup starts its career from online stores as it is easy to set up. And these days, every brick and mortar store needs to have an eCommerce store to sell their product online.

Companies that are 100 years old have been forced to move into the eCommerce spcae to sell their products as users are becoming indifferent to the physical shopping experience. The only problem with the online store is that customers are not able to touch and feel the product. That is why the following eCommerce website design best practices have become an integral part to keep users happy.

Why Should Owners Care About eCommerce and UX

First of all, a lot of owners don’t know the meaning of UX and its importance. Many people confuse UX with how pretty the design looks but there is much more to the design than that, for example creating an opportunity for customer retainability. A lot of eCommerce store owners do NOT know their target audience which will take you nowhere. Doing user research and creating personas for your eCommerce website will help you find the right target audience.

Creating a good experience on your online store has become an important part to retain your customers. Thousands of dollars are spent on digital marketing, yet UX goes unnoticed by most store owners. Bad UX will affect your revenue, current customers, and potential customers. UX design is an important part of an eCommerce store. Good eCommerce UX can lead to:

  1. Increased conversion rate
  2. Reduced customer support
  3. Increased customer loyalty
  4. Increased referrals

While designing user experience for an eCommerce site, there are a few things to keep in mind:

  1. Does the page load fast?
  2. Are Call to Actions (CTAs) labeled properly and clearly defined?
  3. Is the store easily navigable?
  4. Is the text clear and concise?
  5. Is the store accessible?
  6. Is the store responsive and adaptable on different devices?
  7. Is the search form working?

According to Baymard Institute, the average cart abandonment rate is 69.23%. There are many reasons for cart abandonment, for example, many users will be window shopping, price comparison, comparing different products, and many more. These are natural and unavoidable cart abandonments. But there are other reasons that it can occur, like:

  1. Site forcing them to create an account
  2. Too long process to checkout
  3. Total cost not shown up-front
  4. Website had errors
  5. Customers did not trust the website with their credit cards
  6. The extra costs are too high

If the UX is bad, customers will not hesitate to leave the site and shop somewhere else.

Best Practices For Your eCommerce Website Design

The functionality of the store is of utmost priority

Don’t add any functionality to make the website just look pretty or fancy. The core functionality of the website should be just SALES. If you add more functionality than required, you can make the website slower. Customers’ time is valuable and they will not wait for the website to keep loading. The slower the page load time, the lower the conversion rate. Look at Amazon, it’s website is not fancy or beautiful but gets the job done. Users come, they buy and they leave. Some of the “fancy” functionality could be:

  1. Parallax Scrolling
  2. Full page image or video
  3. Any new type of navigation
  4. Animation at every step

UX design does not mean continuously adding new design elements or functionality, instead focus on keeping users happy and the website functional. UX’s main goal should be to help customers get what they came for.

Make the text readable

The text on the website should be clear and concise. People will not read through long paragraphs of text, they don’t have time for that. Keep it short and use bullet points wherever possible. Make sure the text is readable and the text size is large enough for people to read without straining their eyes. Make your products easy to find for your customers. Have a clear indication of the product description for customers to search. Understand how your customers read (scan) your website.

In user experience design, the copy comes first. Copy tends to get overlooked on eCommerce sites, especially on the product page with the product description.

Make the product page simple

Even though eCommerce is a fast-growing market, people still prefer to shop at real-world store as they can look and feel the product before buying. To make customers comfortable while buying a product online store owners should have high-quality images from every angle for the user to see as well as zoom features so that users can make an informed decision. Videos help too!

Make the product page simple with relevant information in an organized manner – have all the features listed out for users to quickly scan.

Idea Theorem- Best Practices For Your eCommerce Website Design
Zara’s has high-quality images to make customers see what they are buying

Make navigation simple

Make navigation simple and intuitive for the customers to use.

  1. Label the menu items with familiar words, not some creative words where users have to think twice
  2. Have basic elements like a shopping basket, where users expect it to be (on the top right corner of the website)
  3. Use breadcrumbs to let customers know where they are
  4. Have a search bar on every page of the website
Idea Theorem- Best Practices For Your eCommerce Website Design
Amazon’s breadcrumb navigation to help customers pinpoint their location in the mega website

Offer assistance to your customer through chatbots and phone

With chatbots becoming an integral part of websites, store owners can use them to offer virtual assistance to their customers. They can provide guidance while customers are choosing their products. It gives a more personalized experience for the customers.

Idea Theorem- Best Practices For Your eCommerce Website Design
American Eagle’s ChatBot

Hassle-free checkout process

Have a hassle-free checkout for your customers. Don’t force them to get an account created, there is a high possibility that they will abandon the checkout process. Keep the checkout process simple by minimizing the number of steps to make a purchase. Have the total cost of the purchase including shipping and tax before they start with the checkout. This will make the customers trust your website.

Trust Factor

There should be enough trust created by the store owners that the customers will be ready to give their credit card numbers.

Mobile eCommerce

According to Baymard Institute, 78% of mobile eCommerce sites perform poorly when reviewing the combined mobile product finding experience: that is primarily the mobile homepage, category navigation, and on-site search experience. If your website looks awesome on the desktop does not mean that it will be user-friendly on mobile phones. The website has to be fluid and adaptable to different screen sizes.

How You Can Spot UX Problems On Your Website

There are many ways you can spot UX issues on your website. Many eCommerce store owners do not want to get UX research done as they feel that it is expensive. But the money spent on getting a UX audit will help spot the issue and hence increase the conversion rates.

There are many ways to spot the issues:

  1. Heats Maps/Scroll Maps
  2. A/B Testing
  3. Analytics
  4. Session Videos
  5. Click Rate

Even small changes in the website can help increase your conversion rates. Or there could be other reasons which may require you to redesign your website. The above eCommerce website design best practices will help store owners gain more traction and conversion rates.

Are you Ready for a UX Audit?
Get Started Here>>

What’s Next

Idea Theorem™ is a Toronto-based UI UX Agency. We create simple and usable products for web and mobile. Our human-centered design approach lets us understand your customers, identify their pain points & deliver solutions that enhance their experience with your brand. Contact Us if you have any questions and we will be happy to help you.

Check out our resources!