UI Design
< 5 minute read

eCommerce UX – An Overview of Best Practices (with Infographic)

Miklos is a lead UX/product designer with more than 18 years of experience and a wide variety of user experience projects under his belt.

A thirtysomething Millennial is shopping for a cool running shoe she spotted on an Instagram sponsored post. She clicks through to the eCommerce site. The site takes forever to load on her mobile—she can’t buy the item without registering, nor can she find the return policy or contact info for customer service. She leaves faster than Usain Bolt can sprint 100 meters.

Even with worldwide eCommerce revenues scaling new heights to the tune of trillions of dollars every year, when it comes to eCommerce UX, shoppers still tend to be considered last. How many billions are lost due to shopping cart and checkout abandonment? Who hasn’t flown into a computer rage because an eCommerce site wouldn’t accept a credit card or a phone number?

Many eCommerce businesses are still focused on the numbers and are typically put together by engineering teams. Sadly, UX continues to be considered as something to be added later. Subsequently, many eCommerce companies with billions of dollars in annual revenue (including some big names) still don’t get the user experience right. If they committed to making their eCommerce user experience more seamless and pleasurable, these giant, billion-dollar names could add even more billions to their bottom line.

eCommerce UX best practices

Nevertheless, there is light at the end of the eCommerce tunnel. Despite countless online merchants still not being on board with the idea that better UX results in higher revenues, almost three-quarters (74%) of businesses believe that user experience is important for improving sales.

Clearly, there’s much work to be done on the UX front. The executive suite, product management, and developers can be convinced of some eCommerce UX best practices. After all, building the near-perfect eCommerce store is not impossible. Savvy UX designers can align eCommerce site designs around well-researched and time-tested standards and conventions.

By 2020, user experience will replace price and product as the key brand differentiator. – Jonathan Beckman, Founder of Apptourage

Here are some vital eCommerce UX best practices that will elevate the user experience and in consequence give rise to improved sales.

eCommerce UX

• • •

Further reading on the Toptal Design Blog:

Understanding the basics

What is a mobile first approach?

A mobile first approach means designing for the smallest screen first and then moving up. If a site works well on mobile it will convert more successfully on other devices. Working within the constraints of mobile (eg. screen size and bandwidth) means lean content which leads to a content/user-focused design.

What is eCommerce design?

eCommerce UX design is designing for eCommerce (banking, buying or selling over the internet) sites specifically. A great eCommerce UX design provides superior user experience, takes into account best practices, gives a business an edge over the competition and helps to broaden a brand’s reach.

What is touch gesture?

Touch gestures are hidden controls that let users interact with screen elements using touch. A standard set are: tap, double-tap, drag, flick, pinch, spread, press & tap, press & drag & rotate. Proper implementation of touch gestures will elevate eCommerce UX.

What is form design?

Form design is the creation of web forms (e.g., contact, shipping, registration, etc.) that visitors use to submit their information. Great web form design can help increase conversions, and can directly impact a website’s overall UX including eCommerce UX.

What is an input mask?

An input mask is a database/data entry term and controls what a user can enter in a form field by forcing them to enter data in a specific format. Doing it properly will boost eCommerce UX.