Conversion Optimization

13 eCommerce Leaders Share How To Improve eCommerce User Experience

March 4, 2024
written by humans
13 eCommerce Leaders Share How To Improve eCommerce User Experience

Ending up losing $1.42 trillion because of UX gaps is a sad situation if you come to think of the elaborate opportunity any business holds—and this is why we spoke to several eCommerce founders to figure out what they’d recommend. 

Alongside, we also feature here our insights having worked on 500+ businesses across the world in 5 years—read on to discover more:

13 eCommerce Leaders Share How They Provide Amazing UX

5 UX Mistakes That Invariably Impact Conversions 

Crucial UX Parameters For a Successful eCommerce Store

3 Steps to Create a Customer-First Website Experience

10 eCommerce UX Trends to Watch Out For In 2024

If you already haven’t, an eCommerce UX audit will tell you what to reach out for as your optimize your storefront—for 2024, here are some of the top ways you can transform your website UX for the better:

  • Personalization in content & layouts through AI will rule eCommerce UX in 2024 - Fabrity
  • Data-driven design informed by user preferences & behavior will be go-to for greater user satisfaction - Pepper Square
  • A visually rich website with limited yet bold text is what eCommerce businesses will have to focus on - Propelrr
  • Intuitive search filters that will help shoppers refine their search in a more detailed way will become even more important - Arounda
  • Use strategic data capture to improve shopper satisfaction and gather feedback simultaneously - InfoTrust
  • The need to use microinteractions to increase engagement & satisfaction will emerge as even more important - Wix
  • User-centered copy featuring key information that will resonate with the shopper, will become vital - Shopify
  • Interactive product displays like hover effects and 360° product views will create more shopper satisfaction - Web Circle
  • Contextual user experiences based on real-time data reading like weather will take center stage - Rivulet Digital

13 eCommerce Leaders Share How They Provide Amazing UX

What makes a good online customer experience is a host of factors that help shoppers discover, ask, reconfirm and finally make relevant purchase decisions: 

1. Checkout process that’s trustworthy

Research says that at least 18% of all checkout processes face abortion because shoppers find them too complicated—add this to the many other reasons why shoppers abandon their carts, and you have a big problem to fix. 

one click purchase incorporation by Fortador USA

Here’s Kate Ross, Hair & Beauty Specialist, Irresistible Me sharing on her experience with eCommerce checkout UX: 

“We noticed some customers were leaving their carts without buying, so we made the checkout smoother and faster. And we noticed more people actually finishing their purchases, which was great for our sales.”

Skincare & makeup brand Beauty Pie offers a free-flowing checkout experience by featuring multiple checkout CTAs and keeping their forms super functional:

How To Improve eCommerce User Experience-beauty pie checkout ux

If you already haven’t, feature the following in your eCommerce checkout UX:

✅ Make password creation easy (especially if you’re asking shoppers to create an account—best though is to offer a guest checkout option)

✅ Instead of citing “estimated shipping speed” (and citing the number of days as a window), use “estimated delivery date” for greater transparency

✅ Use Luhn validation for credit card fields (this way mistyping won’t go unnoticed and shoppers won’t have to submit the form, only to be told to retype, which often leads to checkout abandonment)

2. Site loading at lightning speed

One of the prime markers Google uses for its first page rankings is page speed—typically websites that appear on the first page of SERPs have page speed of about 1.65 seconds. 

As for shoppers, 80% say a slow website is far more frustrating than a website that’s temporarily down—that’s how important a fast-loading site is as far as the best eCommerce UX is concerned. 

Brian Devening, Owner, Snubbies talks about prioritizing website speed and  mobile responsiveness

James Wilkinson, CEO, Balance One opines: 

“Experiencing slow-loading web pages can seem like an eternity; a fact substantiated by a Google study – 53% of mobile users abandon sites taking longer than three seconds to load.”

To load your eCommerce website faster:

✅ Aim to load your page(s) within 2 seconds of the associated link being clicked 

✅ To scale images, use formats like WebP and JPEG200 only

✅ Use one-line descriptions while offering product recommendations on the homepage or landing page—here’s what Ikea does to highlight certain category recommendations:

How To Improve eCommerce User Experience-Ikea responsive design

✅ Remove redundant and additional code

✅ Avoid sliders on your homepage and stick to banners instead

3. Grab attention through great “search” function

It’s one thing to have shoppers randomly move through different pages of your eCommerce website—and quite another when they want to “search” if your store has what they have in mind. 

The crucial difference here is intent, which means if your search is comprehensive & indicative enough, these shoppers are more likely to convert. 

Alex Horsman, Head of Marketing, Ammo shares: 

“Our practical user interface makes Ammo.com user-friendly and easy to navigate. Ammo.com has a clean design and intuitive layout, which helps customers find what they want in seconds. Our search bar and product categories help users pinpoint their desired products, speeding up the purchase process.”

eCommerce brand Nordstrom boldly call out their search function—and when a shopper types in a keyword, shows up both popular categories and suggestions to ease choosing:

Nordstrom search ux-how to improve UX

‍

To make your eCommerce UX search & categorization functions shine through, do the following:

✅ Always add hint text to your search bar design (for example “what are you looking for today?”)

✅ Make your predictive queries span various categories (and autocorrect fetch the most relevant ones)

✅ Offer a “trending searches” prompt the moment a shopper clicks the search bar (this is especially helpful for new shoppers)

✅ For product categories to be noticed, the sweet number is 7—but even if you have a number of them, let it not cross 12

✅ Add synonyms for uncommon keywords to show relevant results and sell more

✅ Avoid showing “No results” to your shoppers. To do this, you can add customized recommendations and content suggestions on your empty search results page

✅ Autocorrect typos to avoid returning empty search results, removing this friction from the shopping experience entirely

amazon search ux

4. Convince through compelling product descriptions

All great product info has one thing in common: they tell a story that the shopper can relate to and make a purchase decision. 

Here’s what Guillaume Drew, Founder & CEO, Or & Zon opines about the best eCommerce user experience descriptions can create: 

“We have categorically organized our products, offered detailed descriptions encompassing the product's history, the artisan behind it, and our sustainable and ethical production procedures.”

Normand Chevrette, CEO, CME Corp, on the other hand, says: 

“When we introduced a high-demand ventilator model, we didn't just display its technical specifications. We went further by incorporating user-generated reviews and showcasing firsthand experiences from medical professionals.”

Our eCommerce client Hardwood Lumber Co. is known for the superlative UX they create through product descriptions that are high on information—so that shoppers know what they’re getting into:

Hardwood lumber description ux

For your product description UX to be on point:

✅ Offer a snapshot of information right under the product name (you can always feature a “more details” section as a link that can be expanded or have a separate section later labeled “product information”)

✅ Flank written text with labeled icons (this can highlight key elements like “sustainably made,” “money back guarantee” and “free shipping")

✅ Use an accordion style information display (that can either be expanded and contracted through “+” and “–” symbols or what Ikea does with an arrow as a visual cue)

Ikea product description ux

5. Create an ‘experience’ through images & videos

90% of shoppers say that the most crucial element they consider while buying is a product’s photos. Similarly, 84% claim that a brand’s video has had a direct influence on their purchase decisions. 

In the absence of an in-store experience and real-time customer personnel, shoppers fall back on visuals to make sense of the brand & its offerings—concurrently, bad visuals represent one of the most pressing UX problems. 

Guillaume Drew, Founder & CEO, Or & Zon, opines:

“We added videos showing the creation process of each product, directly from the artisan’s workshop. This not only enriched the authenticity of the products but also gave customers an emotional connection with the item they were purchasing. The result was a significant 35% increase in our conversion rates.”

On the other hand, Gareth Newman, Founder, Blakely Clothing states:

“When we launch a new collection, the items are often designed to be worn together, so through our imagery, we send our customers on a journey. In turn, through cross-selling on product pages, cart level and through retargeting, we see an increase in our AOV month on month.”

eCommerce brand Fenty Beauty features boldly labeled images and for good measure, also throw in product page videos that send out reassuring messages to the target audience:

fenty beauty menu ux

To strengthen the UX around images & videos you use:

✅ Place a video within the image gallery (this improves discoverability—just ensure it’s not a long one and is ideally in  GIF format covering the most vital parts of showing the product in use)

✅ Limit the number of images to not more than 7 (always show the count of images against the total number as shoppers scroll)

✅ Consider placing a linked text to the Youtube Video right below the product name (this can be effective if you’re dealing with a slow loading website)

6. Cut out friction through seamless omnichannel 

More than 60% of shoppers tap into several channels of a brand to access information, seek support and buy products. This makes a seamless omnichannel experience an instant necessity for conversions. 

Christy Pyrz, CMO, Paradigm talks about making omnichannel messaging better and making landing pages more uniform

eCommerce brand Warby Parker is known for their omnichannel flex—be it through their virtual try-ons, home trials or UX created through pop-up shops and shop-in-shops:

warby parker omnichannel ux

To reduce omnichannel friction and create the best eCommerce UX:

✅ Offer “shop through the app” prompts when a shopper is navigating your site or social media (apps typically reduce friction in the checkout process)

✅ Offer “We noticed you like
” product prompts when shoppers switch channels (this ensures continuity of experience)

✅ Feature a scannable code with the product shipment to offer suggestions, product recommendations (and make sure to flank this code with relevant text like “Scan for tips & suggestions”)

✅ Make your layouts recognizable across all channels (be it visual elements, typography or the brand iconography you use)

✅ Use a chatbot that quickly picks up on customer details & past interactions (to reduce asking shoppers the same questions again)

7. Fall back on one-page checkout

Talk about checkout friction, and the instant answer seems to be one-page checkout—replete with auto-suggestions and preferred payment methods. 

Oleg Segal, CEO & Co-Founder, Deala says: 

“Initially, our users had to navigate multiple pages before securing a deal. Recognizing this friction point, we streamlined the process down to one simple page. Following this change, we witnessed a dramatic 25% uplift in conversions. Every design choice, every feature addition should ultimately enhance the customer's journey.”

Beauty brand Sephora’s one-page checkout flows easily and offers a “save & continue” button prompt after each major section:

seophora page checkout ux

For your one-page checkout UX to be top notch: 

✅ Feature a progress bar that covers all the sections on the page (this way when a shopper finishes one section the progress bar can proceed and color code the covered section differently)

✅ Use different checkout CTAs to target different audiences (Nike, for example, has different CTAs for guests, members and those who use PayPal for payments)

✅ Feature neat, separate layouts for form filling, cart summary, shipping & delivery details and trust seals

For more ideas, read: The Best One Page Checkout Examples in eCommerce (2024 Update)

8. Prioritize post-purchase ease

Once a sale is made, many eCommerce businesses think their job is over—the truth is it’s just begun. In fact, a poor post-purchase experience essentially means your customer retention & LTV will suffer. 

This is what Gareth Newman, Founder, Blakely Clothing has to tell us:

“Building trust with our customers is huge, first time buyers are usually testing the water but once they have purchased and our post-purchase journey begins we often see return customers purchasing more expensive items and adding more to their bag. Successful businesses don’t just sell a product, they sell a brand.”

For great post purchase eCommerce UX, ensure to do the following:

✅ Segment your emails with care (make use of all the data you generate to target more specifically—this invariably leads to better conversions)

✅ Highlight your FAQ page link across product pages and emails for easy reference (and come up with a separate & detailed FAQ page if you already haven’t)

Fashion brand ASOS features a separate FAQ page and offers up topics as neat categories for easy self-help:

asos faq ux

✅ Prioritize informational content as much as transactional content to make shoppers feel supported (use popular marketing mediums like email and WhatsApp to convey)

9. Make navigation a joy

No matter where the shopper is in their customer journey, they’ll come back to shop with you time and again only if they experience ease in moving through your storefront. 

And this is why great navigation is a facet of UX you can’t possibly skip out on. 

Lisa Richards, CEO, The Candida Diet speaks about making product categories more navigable

Dan Dillon, CEO & Chairman, CleanItSupply, shares: 

“We constantly update our website to make it user-friendly and intuitive, ensuring ease of navigation and quick access to information. This involves continuously refining features, design, and layout based on customer feedback and behavior analytics.”

Burt’s Bees is an iconic eCommerce brand that takes its navigation seriously—whether it’s about their primary menu being clear to even first-time shoppers or category highlights that target different kinds of shoppers:

Burt's bees navigation ux

Here are a few non-negotiable UX steps you have to incorporate for seamless navigation:

✅ Limit the number of high-level categories in the horizontal navigation panel at the top of the site

✅ Feature easily relatable sub-categories under each category 

✅ Color code any category (like “sale” or “gift guide”) that you want more shoppers to notice & convert from

✅ Feature categories and sub-categories based on user intent (for example, if you’ve seen a fair amount of conversions come from bundles, feature a “bundle & save” option in the primary menu)

✅ Opt for a sidebar menu if you have hundreds of products (combine this with a relevantly labeled hamburger menu)

✅ Bring in high-level categories in a separate section after the first fold (Wayfair, for example, showcases a “shop by department” section, which can attract those who haven’t stopped to explore what’s within the hamburger menu)

✅ Ensure strong visual cues to make navigation easy on the eyes—here’s an example from Chewy: 

chewy navigation ux

10. Prioritize responsive design

Going by research, by 2024, the US alone will have 187 million active mobile shoppers. And this means just one thing: not designing specifically for mobile will make any eCommerce business lose out on a WHOLE LOT. 

In connection to this, Brian Devening, Owner & Founder, Snubbies tells us: 

“We prioritize website speed and ensure it is mobile responsive as most of our customers shop using their phones. Additionally, we utilize Swiftype's site search functionality to provide quick and precise search results, further enhancing the user experience.”

Here’s what Lisa Richards, CEO, The Candida Diet shares with us: 

“Our website was not sufficiently mobile-friendly. We commenced a systematic overhaul--transforming product categories into highly navigable entities – and reformed the checkout process to be encapsulated within a single-page layout.” 

Here are a few responsive design UX principles that will make your website convert better:

✅ Highlight the search bar above the hero image section (keep it centrally aligned and make all other ambient features smaller)

Here’s a great example from Kohl’s mobile site: 

Kohl's responsive design

✅ Offer a visual cue that a section is following the one the shopper is currently looking at

Check how nutrition brand Golde does it by using a different color to alert the shopper:

golde responsive design

✅ Consider using a slideout menu (especially if you have several categories and products; keep an “X” button handy for shoppers to close out the expanded menu whenever necessary)

11.  Use clever visual hierarchy

Why is it that when you visit a UX site you’re drawn to certain areas of the page? It’s because the site uses a visual hierarchy. 

The main reason you should use a visual hierarchy is to make it easy for your visitors to read and understand your web pages. 

Take a look at how odor eliminator brand Poopourri aces visual hierarchy in this example:

poo pourri hierarchy ux

To get your visual hierarchy UX sorted:

✅ Ensure there’s enough contrast between two content blocks

✅ Start any page with the most eye-catching visual or offer

✅ Start your homepage with transactional product information and then move into more non-transactional brand information & imagery

12. Drive authenticity through UGC

When looking for information about a product, 51% of US consumers trust user-generated content more than other information on a company website.

User-generated content, or UGC, is an excellent way to make your site seem genuine and for new visitors to understand how regulars feel about your products.

Rhian Stuart, Head of Digital, Blakely Clothing speaks about the power of letting customers talk about their experiences

Beauty brand Deciem, for example, goes into in-depth reviews (which also concurrently drives the legitimacy of the storefront):

deceim ugc ux

To create the best eCommerce UX through UGC, ensure:

✅ To bring in several relevant filters in the reviews section

✅ Pull up a snippet from a positive review and showcase it in the first fold

✅ Feature a “social wall” right above reviews for shoppers to click & go to your Insta/FB feed

13. Gather feedback (but don’t be intrusive)

Though customer feedback is crucial for business success, only 40% consider leaving reviews for negative experiences as against 67% for positive ones. The antidote? Feature and prioritize user feedback that’s less flattering—it’s one of the evergreen eCommerce UX trends that’ll help you earn customer trust. 

Ilia Mundur, Founder, Hefty Berry talks about seeking feedback from customers through surveys and support interactions

Matt Little, Owner/Founder, Festoon House says:

“Put simplicity and quickness first. Oh, and pay attention to what your consumers have to say—feedback is invaluable. They'll tell you what works and what they don't like.”

Home Depot features a sticky feedback button, which when clicked reveals multiple aspects of UX that a shopper can leave feedback on:

home depot feedback ux

To make the UX around feedback more compelling, consider:

✅ Using a sticky feedback button that can then expand into a form (feature no more than 5 questions to avoid frustration in shoppers)

✅ Feature a feedback pop-up in the order confirmation page (this is immediate so ensure you ask simple questions like “What did you like about shopping with us?” and “What could be better in your shopping experience?” and offer multi-choice answers)

You might also like to read: 20 Solid Ways To Recover BigCommerce Abandoned Carts

14. Live chat that feels (almost) human

By now it’s a known fact that issues resolved on live chat have a 13 times faster resolution rate as compared to emails and online form submissions. 

Lisa Richards, CEO, The Candida Diet elaborates:

“A live chat feature facilitated immediate customer service assistance: a resourceful aid offering swift, direct interaction. Simultaneously, we observed a significant decline in bounce rates; notably, our mobile users—previously at an alarming 76% bounce rate—improved drastically to just 49% within six months of implementing changes.”

Jewelry brand Brilliant Earth collects a message on the requirement, email ID and nature of query before an actual executive begins the chat so that the shopper doesn’t have to repeat these details:

brilliant earth live chat ux

Thinking of optimizing UX through live chat—here are a few steps we’ve seen work for clients:

✅ Don’t just reserve live chat for the product pages (we’ve seen bringing it into the homepage has both improved engagement & conversions for clients)

✅ Feature live chat links in the header and footer (don’t just depend on a floating button to draw attention)

✅ Use a clear label like “Chat with Us” instead of “Ask us Questions” (also when the shopper clicks the live chat button, give them a choice to continue chatting with the bot or transferring their query to a human representative—if there’s a delay in human response, convey that)

15. Quick coupon search for the best deals

Did you know shoppers who use coupons end up spending 24% more than those who don’t? 

So, like it or not, how you do coupons on your storefront has everything to do with UX. 

Oleg Segal, CEO & Co-Founder, Deala says:

“One particular measure we have taken is to simplify the coupon hunting process. We developed an intuitive search function and categorized brands, enabling users to quickly locate their desired coupons, resulting in reduced bounce rates and increased customer retention.”

Wayfair clearly features their discounts, deals and coupon code information for shoppers to get adequate direction:

Wayfair Coupon UX
Warby Parker Search

To ace coupon search UX, here are a few things you could do:

✅ Feature an expandable section labeled “available coupons” or “available promotions” in your mini cart, cart page and checkout page

✅ Open your category page with a category-specific discount code & associated discount %

✅ Use the notification bar to highlight “discount applied at checkout—no code required” deals

5 UX Mistakes That Invariably Impact Conversions 

We’ve come across several UX design mistakes that eCommerce businesses generally make across our free audit sessions, but here are 5 of the most glaring ones:

1. Too many pop-ups

Even if you have the best discounts or gated content, too many pop-ups can become both distracting and annoying. However, if you want shoppers to take note of an offer before they lose interest, using the time delay approach may help. In this case, don’t show a pop-up before 3 to 5 seconds after a shopper has landed on your website. 

2. Lack of navigational breadcrumbs

Without breadcrumbs, your shoppers will have a tough time orienting themselves within your storefront. Showcase path based breadcrumbs across your site to make sure shoppers know where to go back to. 

Notice how Everlane leaves breadcrumbs covering the high-level category and sub-category (“women” and “t-shirts”) for shoppers’ ease. 

Everlane breadcrumbs

3. Lack of or too much product information

The problem of too little or too much is a real one when it comes to UX, especially around product descriptions. 

To avoid this, focus on:

- What the product features as ingredients

- Why it would be good to use it

- How to use it

- What to use it with

4. Poor mobile browsing experience

While a great desktop browsing experience is the ultimate necessity for eCommerce shoppers, it’s a bad idea to forget that a little over 43% sales come from mCommerce. 

So responsive design that features key breakpoints is a good idea—with screen sizes ranging from small to large: 

Small: lesser than 640 px

Medium: 641 px to 1007 px

Large: 1008 px and more

5. Super complicated checkout

Find, buy, get out—that’s how easily shoppers want to checkout. 

But if you’re giving them grief over lack of shipping cost transparency, excruciatingly long forms or even lack of popular payment methods, your conversions are sure to suffer. 

Which leads us to share what some driven eCommerce founders are doing to sort out their website UX scene. 

Crucial UX Parameters For a Successful eCommerce Store

To tailor UX effectively for shoppers to have a superlative experience on your eCommerce store, here are are some parameters you’ll have to look into: 

Convenience

UX begins even before a shopper lands up on your website—so ensuring the keywords or phrases they search for result in pages they want to actually visit is crucial to engagement & conversions. And once they’re on the site, offering them an integrated navigation as well as detailed search functionality will create the best eCommerce UX. 

Aesthetics 

A visually appealing store complete with products getting the highlight and use cases showing up as desirable, is crucial to conversions & repeat customers in eCommerce. 

Simplicity

How easy is it to find bestsellers? How quickly can someone access customer support? How little effort does one need to make to view recently browsed products? The simpler the user experience, the greater the chances for conversions. 

Functionality

How quickly does your site load? How easy is it to view the ongoing offers? How easy is it to understand the text that you’ve displayed across the site? Without functionality, even a gorgeous eCommerce store won’t turn in the conversions. 

Uniqueness

Does the store stand apart in the category it does business in? Will a shopper be able to tell your brand apart from its competitors? Is it distinctly recognizable on social media? To assess the uniqueness component of your eCommerce UX, these are some questions you need to ask. 

Assurance

This parameter is crucial in ensuring shoppers want to continue discovering products on your site and in the best case scenario, converting too. Assurance can come from various angles: product content, social proof, trust signals like popular payment methods etc. 

Options

To make shoppers stay back on your site, you have to subtly convey that you have what they’re looking for, even if they don’t immediately find it—this includes recommendations they’ll likely browse, links to helpful pages like “bundle & save” and “holiday guide,” more ways to view a product (read: 360 view or even a video.)

3 Steps to Create a Customer-First Website Experience

Just optimizing your on-site isn’t enough. You also need to use data, understand how shoppers are responding to your website, and use these insights to improve your site. By continuously optimizing your customer experience, you can increase engagement, increase conversions, and boost repeat purchases. 

Here are 3 steps you can follow to measure, understand, and optimize your customer experience.

Step 1: Tap into analytics to understand areas of improvement

Your analytics has a lot of information about your site. Use it to identify areas of improvement, from drop-off touchpoints to low-selling products. You can also use your heatmaps along with your analytics to track the different metrics important to you. 

Our suite of tools includes click tracking, funnel analytics, and heatmaps, built to help merchants make data-driven decisions easily.

Step 2: Collect feedback from customers post-purchase

You can also understand how customers perceive your e-commerce store by asking them about it. 

Conduct surveys after a customer shops from you to get feedback from them. This feedback will help you understand what works within your site, what's causing frustration for them, and whether they'd recommend your store to others. The purchasing experience will be fresh in your customers' minds and they'd be more honest with their responses. 

You can then collate this feedback and use it to optimize your on-site experience, meeting your customers' needs and expectations better. 

Step 3: Use these insights to optimize your strategy

Use the insights from your analytics and the feedback you've collected to make changes to your site. These insights will be backed by data so the optimizations you make will have a better impact.  You'll be able to see better engagement and conversions through them. 

You can repeat this process every few months to maximize your growth.

Related reading:

18 UX hacks to reduce cognitive load in eCommerce

Product page UX: 22 data-backed secrets for high conversions

Simplify online shopping for senior citizens: 11 UX ideas

GET A FREE UX AUDIT OF YOUR STORE:

98% of visitors who visit an eCommerce site—drop off without buying anything. 

Why: user experience issues that cause friction for visitors. 

And this is the problem Convertcart solves. 

We've helped 500+ eCommerce stores (in the US) improve user experience—and 2X their conversions. 

How we can help you: 

Our conversion experts can audit your site—identify UX issues, and suggest changes to improve conversions. 

X
Conversion rate optimization
x
x
Free Guide 👉 👉

eCommerce CRO Best Practices - From 33 Founders/Industry Experts

DownloadGET A PRODUCT PAGE AUDIT