UX Mistakes That Kill Sales: 10 Common Interface Design Errors and How to Fix Them

Most websites do not lose sales on price. They lose them on small moments of friction. I have audited client sites since 2012, and the pattern repeats: ad spend grows, traffic arrives, and then visitors quietly leave at the cart or the form. In this article I list the 10 UX mistakes I see most often in interface design. For each one I explain the impact on sales and the fix, based on published research.

What are UX mistakes and how do they hurt sales?

UX mistakes are design and flow problems that make it harder for a visitor to finish a task on your site. Slow pages, vague menus, hidden costs, long forms and unreadable text all add effort. As a result, the visitor leaves without buying, enquiring or calling, and the sale disappears.

I want to make one distinction clear. An ugly site is not automatically a UX problem. The real problem is any detail that blocks what the customer came to do. For example, a beautiful checkout still loses orders if it reveals the shipping fee only on the last step.

In addition, UX mistakes rarely travel alone. Usually three or four small issues stack up. A visitor tolerates the first one and hesitates at the second. Then the third one makes them close the tab. So read the list below as a whole system, not as ten separate tips.

Why do internal teams miss these issues? Because the people who use the site every day know the flow by heart. A new visitor sees the page for the first time and stops at every unclear point. Therefore I trust real user behaviour far more than the internal verdict that "everything works fine".

Which research shows the cost of these mistakes?

Before I share my own observations, I want solid ground. My two main references here are the Baymard Institute and the Nielsen Norman Group. Baymard has run large-scale usability testing on ecommerce checkouts for many years. NN/g, on the other hand, is the classic reference for usability principles.

Baymard's cart abandonment statistics page puts the average documented cart abandonment rate at 70.22 percent, based on 50 different studies. In other words, seven out of ten shoppers who add a product to the cart never complete the order. Moreover, Baymard reports that better checkout design alone can lift conversion rates by up to 35.26 percent.

That said, do not copy these numbers straight onto your own site. Baymard's data comes mostly from US and European ecommerce. Your market, price point and payment habits may differ. Still, the ranking of abandonment reasons is a very good guide to where you should look first.

The second pillar is NN/g's 10 usability heuristics. Principles such as visibility of system status, error prevention, consistency and minimalist design date back to the 1990s. They still hold today. Almost every mistake below breaks at least one of them.

Mistake 1: How do slow pages hurt sales?

The first mistake is making visitors wait before they can see anything. Someone clicks your ad, stares at a blank screen and hits the back button. In that case you have paid for the click, but the sales opportunity vanished before the page even loaded.

Google measures this experience with Core Web Vitals. According to the official web.dev guidance, good thresholds look like this: Largest Contentful Paint within 2.5 seconds, Interaction to Next Paint under 200 milliseconds and Cumulative Layout Shift below 0.1. Your site should hit these targets for at least 75 percent of page visits.

The most common causes I find are oversized images and too many third-party scripts. For instance, a chat widget, a heatmap tool and several ad pixels loading at once can make a mobile page feel heavy.

First, measure. I walk through the steps in my guide to running a Google Lighthouse performance test. Then convert images to WebP or AVIF, remove unused scripts and prioritise the hero image. I also cover the link between speed and rankings in how site speed affects SEO.

One more point. In paid traffic, a slow page costs you twice. You pay for the click, and then you get nothing from it. Consequently, speed work also improves the return on your ad budget.

Mistake 2: Why does vague navigation lose customers?

The second mistake is a visitor who cannot find what they came for. If the menu shows "Solutions", "Services" and "What We Do" side by side, the user cannot tell which one to click. As a result, they wander between pages and eventually give up.

One of the NN/g heuristics addresses exactly this: favour recognition over recall. In practice, you should write menu labels in the customer's own words. Corporate jargon may make sense inside your team, but for a visitor it often reads like a riddle.

My recommendations are simple:

• Limit the main menu to six or seven items.
• Use the words customers type into search engines.
• In ecommerce, name categories by product type, not by campaign.
• Keep the search box visible on mobile instead of hiding it in the hamburger menu.
• Place the contact or quote link in the same spot on every page.

Navigation also has an SEO side. A clear menu helps search engines understand the hierarchy of your pages. I explain this balance in more detail in how to balance UX and SEO.

Mistake 3: Why do surprise costs at checkout kill the cart?

The third mistake is the most expensive one on the list. Baymard's data shows that once you exclude people who were "just browsing", the top reason for abandonment is extra costs that feel too high. That covers shipping, tax and fees, and it accounts for 40 percent. In addition, 12 percent leave because they could not see or calculate the total cost up front.

The price in the customer's head is the one they saw on the product page. When that number grows at checkout, they feel tricked. So the issue is not only the amount. It is the surprise itself.

Here is what I implement. Show the shipping fee or the free shipping threshold on the product page. Display an estimated total, shipping included, in the cart. List any extra charges clearly from the very beginning.

Moreover, this fix rarely takes more than a day of design work. It is a small change in code but a big win in trust. That is why it is the first thing I check on every store, and it is usually week one of my ecommerce consulting work.

For example, one client showed the shipping fee only on the final step. We moved the free shipping threshold onto product pages and into the cart. I will not share a precise number, because other changes happened in the same period. However, the drop-off at the payment step fell noticeably.

Mistake 4: Why does forced account creation lose orders?

The fourth mistake is asking first-time buyers to create an account. In Baymard's list, 18 percent of shoppers say they abandoned an order because the site required an account. That is like putting a locked door in front of the checkout.

Companies have a reasonable motive: they want customer data and repeat sales. However, there are less damaging ways to reach that goal. For example, you can put guest checkout at the top. Then you can offer account creation with a single click after the order is complete.

A prompt like "Set a password to track your order" on the confirmation page works much better. Because the customer has already bought, they can see a clear benefit in having an account.

B2B sites have a similar issue. Companies that demand a long registration form just to download a catalogue or price list lose prospects at step one. In most cases, asking for an email address alone is enough.

Also, forced accounts create a password problem. A returning customer who forgot their password often gives up while waiting for the reset email. So consider simpler login options, such as a one-time code sent by email.

Mistake 5: How do long, complex forms reduce conversions?

The fifth mistake is forms with more fields than necessary. According to Baymard, the average US checkout contains 14.88 form fields. An ideal flow needs only 7 to 8. Put simply, about half the fields on an average site could go.

Additionally, a long or complicated checkout process is the reason 17 percent of shoppers abandon their cart. Every extra field makes the visitor ask again: how long will this take?

When I simplify forms, I use this checklist:

1. For each field, ask whether the order or quote can move forward without it.
2. Use a single name field and default the billing address to the delivery address.
3. Mark optional fields clearly as optional, or remove them entirely.
4. Trigger the right keyboard on mobile: a number pad for phone and an @ key for email.
5. Auto-fill city and region from the postcode where possible.

I cover specific rules for booking, quote and demo forms in my lead form design guide. I will not repeat them here. The same principle applies there too: fewer fields, clear labels and inline validation.

Mistake 6: Why are small tap targets a problem on mobile?

The sixth mistake is buttons and links that are too small for a finger. A link you can click easily with a mouse leads to mis-taps on a phone. The user lands on the wrong page, goes back and loses patience.

The W3C accessibility standard WCAG 2.2 sets a minimum of 24 by 24 CSS pixels in its target size criterion. That is a floor, not a goal. In practice I recommend larger areas for primary buttons. Apple and Google also suggest bigger targets in their design guidelines.

I see this mistake most often in three places: quantity plus and minus buttons, filter checkboxes and crowded footer links. When these elements sit very close together, the problem doubles.

To fix it, test your site on a real phone, one-handed, with your thumb. Place the main purchase button in the lower part of the screen where the thumb reaches easily. You can read the full approach in what is mobile-first design.

Also, position matters as much as size. For instance, a sticky "Add to cart" bar keeps the button within reach wherever the user scrolls. That way, you do not miss the moment of decision on long product pages.

Mistake 7: Why do low contrast and small text damage trust?

The seventh mistake is text that is hard to read, such as light grey on a light grey background. It may look elegant in a design file. On a phone in bright sunlight, however, it becomes almost invisible.

In its contrast criterion, WCAG 2.2 requires a ratio of at least 4.5:1 for normal text and 3:1 for large text. This ratio helps everyone, not only users with visual impairments. Specifically, key decision text such as price, stock status and delivery details should never fall below it.

Font size matters just as much. If body text on mobile drops below 16 pixels, users have to zoom in. Likewise, very long lines and tight line spacing cause reading fatigue.

When you choose colours, you can compare shades with the HTML color codes tool. To check how clear the copy itself is, try the readability checker. In short, plain and readable text always sells more than decorative text nobody can read.

Mistake 8: How does a lack of trust signals stop a purchase?

The eighth mistake is failing to answer one silent question: can I trust this site with my card details? In Baymard's data, 19 percent of shoppers abandon because they do not trust the site with their credit card information. Another 13 percent leave because the returns policy does not satisfy them.

Trust does not come from a single badge. Users weigh several small signals together. The most important ones are these:

• A clear company name, address and a phone number that someone answers.
• Returns and exchange terms that are easy to find and written in plain language.
• A recognisable payment provider logo and a secure connection on the payment step.
• Real customer reviews; a wall of perfect five-star ratings can backfire.
• A consistent, careful visual style; broken images and typos erode trust fast.

One more thing. Fake countdown timers and invented urgency such as "only 2 left" may work briefly. Once customers notice, however, the damage to trust is lasting. That is why I never recommend these tactics to clients.

Finally, be measured with trust signals. Filling the checkout with dozens of badges can actually raise suspicion. A few clear signals that answer the question the user has at that exact step beat a random row of logos.

Mistake 9: Why do poor error messages make users abandon forms?

The ninth mistake is not telling users what went wrong. A generic "Invalid input" message, or a form that wipes all its data, forces people to start over. Many simply close the form at that point.

Two NN/g heuristics apply here: prevent errors, and help users recognise, diagnose and recover from them. In other words, a good form first tries to stop the error. If one still happens, it states the fix clearly.

In practice I apply a few rules. Show the error message right below the field it concerns. Describe both the problem and the solution, for example "Phone number must have 10 digits". Validate when the user leaves the field, not on every keystroke. Never delete data the user already entered.

In addition, Baymard lists website errors and crashes as the reason for 17 percent of abandonments, and declined cards for 10 percent. When a card fails, a message with the reason and an alternative payment option can still save part of those sales.

Finally, show users where they are in the process. A simple "Step 2 of 3" indicator puts NN/g's visibility of system status into practice. Because users know how long the task will take, they are less likely to quit halfway.

Mistake 10: Why do intrusive pop-ups and cluttered pages hurt?

The tenth mistake is anything that pulls attention away from the main task. A newsletter pop-up the moment the page opens, a cookie banner that covers the screen, autoplay video and several flashing promo bars all tire the user.

NN/g's heuristic on aesthetic and minimalist design is the guide here. Every extra element competes with the important information and makes it less visible. Moreover, people have learned to ignore anything that looks like an ad. So if you design an important offer to look like a banner ad, users may skip it for exactly that reason.

A related problem is several primary buttons with equal weight on one page. When "Buy now", "Request a quote", "Call us" and "Download the catalogue" sit side by side, the user cannot decide. I cover this in depth in CTA button examples that convert.

Instead, pick one primary goal for each page. If you use pop-ups, trigger them after a certain scroll depth or on exit intent, not on page load. On mobile, avoid interstitials that cover the content.

How do these 10 UX mistakes compare?

The table below summarises the ten mistakes by the step they hit hardest, the evidence and the effort to fix. The effort column is a starting estimate based on my field experience, not a guarantee. It will vary with your platform.

The key takeaway: the most expensive UX mistakes are often the cheapest to fix. Therefore, review this list once before you commit to a full redesign.

How can you find UX mistakes on your own site?

Reading a list is easy. Finding which mistakes affect your site takes data. In my audits I combine three sources.

The first is analytics. When you build a funnel report in GA4 for cart, checkout and form steps, you can see where users drop off most. For example, if cart to checkout looks fine but checkout to confirmation is weak, the cause is probably costs, accounts or form design.

The second is session recordings and heatmaps. Rage clicks on one button, long pauses on a field or constant scrolling up and down point to the problem. However, respect privacy and consent rules when you install these tools.

The third, and the most valuable, is real user testing. Give five people a specific task on your site and just watch. UX mistakes your team has not noticed for years often surface within half an hour. If you want to set up funnels properly, conversion-focused web design is a good place to start.

A word of caution. Heatmap and recording tools add scripts to the page. So if you leave them running all the time, you may create the speed problem from mistake one yourself. I usually switch them on for a defined review period and turn them off once I have the data.

In what order should you fix them?

Trying to fix everything at once usually means finishing nothing. So I use a simple priority rule: size of impact, share of traffic affected and cost of the fix.

1. Start with checkout and form issues, because users lost there were already close to buying.
2. Next, tackle mobile experience, since most traffic in most sectors comes from phones.
3. Then solve speed and Core Web Vitals issues, which usually need developer time.
4. Finally, move to broader work such as navigation, copy and visual clean-up.

Record your current conversion rate before each change. After the change, wait at least a few weeks and compare. If you can, run an A/B test. Seasonality and campaigns can easily distort a simple before and after view.

In short, UX improvement is not a one-off project. It is regular maintenance. I review this list with clients every quarter.

Do UX mistakes affect SEO performance too?

Yes, indirectly. Google states that its ranking systems use page experience signals such as Core Web Vitals and mobile usability. At the same time, Google stresses that relevance of content matters far more.

So fixing speed alone will not push you to the top. On the other hand, between two similar pages, experience can make the difference. Also, if a search visitor has a poor experience and bounces straight back, the commercial value of that traffic drops to zero.

That is why I plan SEO and UX work as two parts of one goal, not as separate budgets. SEO brings the ranking, and UX completes the sale. I show examples of this approach in how to balance UX and SEO.

In practice I track ranking and sales performance for each page in the same sheet. A page with growing organic traffic but falling conversions tells me the problem lies in the experience, not the content. As a result, you can decide which team should focus on which page based on data.

How can you avoid these mistakes on a new website?

The cheapest UX fix is not making the mistake at all. When you start a new site or a redesign, discuss these points with your designer or agency from day one.

First, write down the primary goal of the site: sales, quote requests or phone calls. Then judge every page design against that goal. Second, approve designs on a phone prototype, not on a desktop screenshot.

Third, add performance and accessibility criteria to the contract. For instance, a measurable clause such as "key pages will meet Core Web Vitals thresholds on mobile" prevents disputes after launch. Finally, test the checkout and form flow with real people before you go live.

These steps are part of my web design service by default. If you want to know which of these 10 mistakes affect your current site, you can reach me through the contact page.

So where should you start with UX mistakes?

To sum up, UX mistakes are small obstacles that quietly kill the desire to buy. Baymard puts the average cart abandonment rate above 70 percent, and design can solve a large share of the reasons behind it. NN/g's heuristics and the WCAG criteria describe clearly what those fixes should look like.

My advice is simple. Open your site on your phone today and go through a purchase or quote request like a customer would. Keep the 10 points from this article next to you and note every place you get stuck. That way your first improvement list will be ready within half an hour.

Finally, remember that no site is perfect. However, a site that keeps removing obstacles for its customers gets far more out of both its ad budget and its SEO work.