Why the beautiful site gets signed off first
2026-10-12
Web designers, UX designers, and what the difference does to conversion
- Ecommerce
- CRO
- UX Design
- Web Design
Web designers, UX designers, and what the difference does to conversion
The meeting where it goes wrong
Anyone who has taken an ecommerce team through a redesign knows the scene. The new product page goes up on the big calibrated monitor in the boardroom. The photography is beautiful, the type is light and elegant, the white space is generous. The trading director likes it, the brand team likes it, and I've caught myself liking it too. It gets approved quickly.
No one in that room is attempting to make a purchase. All of them already know the location of the size guide, the delivery cut-off time and the composition of the fabric since they are the ones who wrote the copy. The purpose of the meeting is to assess a picture of a page, with the evaluation taking place on a 27-inch screen by people who will never have to use it. The curse of knowledge means that the problem is not visible: after you know what the page contains, you are unable to see it as someone who doesn't know.
On top of that sits the aesthetic-usability effect. Masaaki Kurosu and Kaori Kashimura found in 1995 that people judged better-looking cash machine layouts as easier to use. Noam Tractinsky and colleagues repeated the work in 2000 (Interacting with Computers) and found that how attractive the interface was changed how usable people said it was, even after they had used it, while its actual usability made no difference to that rating. Both studies are old, 31 and 26 years respectively, and later work complicates them. In 2012, Alexandre Tuch and colleagues manipulated beauty and usability separately and found the arrow running the other way: a harder-to-use site was rated as less beautiful, while a prettier one wasn't rated as more usable. I read the two together as a description of first impressions, and a sign-off meeting is nothing but first impressions.
Two jobs that share a tool
Figma is a drawing tool, and those who are skilled at it are generally also very good at something that is genuinely valuable. A skilled web designer puts together a page, creates a type scale, manages colour and brand, and ensures that the entire design works well on all screen sizes. Good visual design helps to build trust and yet is poorly paid in most e-commerce teams. The following points are not there in order to minimise its importance.
A UX designer's main output is largely invisible in a static frame. It's the decision about what a page has to do and for whom, and then the evidence that it does it: task analysis, information architecture, the full set of states a component can be in, accessibility, and testing with people from outside the building. Their work is judged by task success, time on task and error rates. Taste plays a part, but taste is judgment from the inside, made by someone who already understands the page, and the best UX people I've worked with distrust their own.
The difference displayed by the size selector on a fashion product page is clearer than any written description. A visual designer will nicely provide both the default and selected states. The UX questions concerning user experience begin at the point where the mockup stops. What occurs when the customer taps 'add to bag' without selecting a size? Is it possible to distinguish between a size that is out of stock and one that is available without relying on colour? What does the screen reader announce? Does the back-in-stock option appear immediately when the customer is disappointed, or only after scrolling three places down? Since concern about fit is greatest at the moment a size is being chosen, where should the size guide be placed in relation to the selector? Each of these answers either increases the rate at which items are added to the basket or affects the return rate, and none of them is visible in a static screen.
On Shopify, which a very large share of UK brands now run on, this matters more. The checkout is largely Shopify's own and only partly yours to change. Most of the UX decisions a retailer can actually make live in the theme: navigation, collection pages, filters, the product page, the cart drawer and every form on the site. Those are exactly the parts most often handed to a visual designer with a moodboard.
What good UX does to the numbers
The system is based on processing fluency: information which is easier to read and locate requires less mental effort and is therefore judged more positively with greater confidence. If the delivery promise, the returns policy and the product details are placed next to the price in clear type, then the customer is able to settle the doubts that would otherwise cause them to go to another tab. The commercial benefits are felt in several areas: there is a higher add-to-basket rate, fewer "is this in stock in my size" enquiries to customer service, and fewer returns from customers who made a guess.
It would be better to be straightforward concerning the evidence. The clearest example of this can be found within companies themselves in the A/B tests which are never published, and the publicly available research is no better than what the conference slides indicate. The largest study most frequently cited is McKinsey's The Business Value of Design (2018), which followed 300 listed companies over a five-year period. Firms in the top quartile of its design index grew revenue 32 percentage points faster than their industry peers and total returns to shareholders 56 percentage points faster, while the differences between the other three quartiles were marginal. The study is eight years old, it is correlational, and the index it uses looks at design leadership and design practice throughout the entire business, not just on the website. I have not come across any independent study of a similar size since. In fact, the straightforward conclusion is that companies which take design seriously tend to grow more quickly, and the cause-and-effect relationship could go in either direction.
The most obvious effects of improving the user experience have appeared in some of the metrics which are not included in a redesign brief, namely, the number of contacts per order, the number of returns broken down by reason code, and the proportion of product page visits that come from navigation. These changes are subtle and continue to occur even after the launch event has been forgotten.
When "worse" UX wins
There are well-documented cases where the less efficient design performs better, and they're worth understanding because they show what good UX is optimising for. The first is the labour illusion. Ryan Buell and Michael Norton (Management Science, 2011) ran five experiments on simulated travel and dating websites and found that people valued a service more, and sometimes preferred a longer wait, when the site showed the work it was doing on their behalf, even when the results were identical. The mechanism is perceived effort, which triggers a sense of reciprocity. The paper is 15 years old; Buell went on to extend it with Tami Kim and Chia-Jung Tsay (Management Science, 2017), and a 2023 study by Robert Bray on Cainiao parcel-tracking data suggests the benefit depends on when in the process the work is shown.
In the field of ecommerce, the best example is any tool that actually provides a service to the customer. A fit finder which compares the customer's measurements with the real dimensions of the garment for a few seconds gains more trust in its suggestion than one that gives a size immediately. It is important that the effort be genuine and noticeable. A fake spinner is no more than a page that takes longer to load.
The other one is the IKEA effect. As Michael Norton, Daniel Mochon and Dan Ariely showed in the Journal of Consumer Psychology in 2012, people tend to place a higher value on things that they have put some effort into making, the effect vanishing when the task is not completed. Marko Sarstedt and his colleagues carried out a conceptual replication of this in 2017 (in the Journal of Marketing Behavior), confirming the effect and attributing it to psychological ownership. Although both studies are more than four years old, they agree with each other. For a retailer, this applies to configurators and build-your-own bundles: so long as the customer actually completes the process, a longer flow with more options than simply having an add-to-basket button can increase both the willingness to pay and the average order value, since every abandoned configuration represents effort that has resulted in nothing.
And there's a deviation that doesn't work. In 2007, Adam Alter and colleagues reported that a hard-to-read font made people think more carefully, and the idea of "useful difficulty" spread quickly through marketing. In 2015, Andrew Meyer, Shane Frederick and colleagues (Journal of Experimental Psychology: General) pooled the original data with 16 replication attempts and found no effect on the results at all. Friction pays when it is visible effort on the customer's behalf, or work the customer completes and owns. Friction for its own sake, including the elegant, faint typography that slows reading down, simply costs you.
How many businesses ignore it, and what it costs
The analysis carried out by WebAIM in February 2026 of the top 1,000,000 home pages represents the most extensive regular examination of one measurable aspect of user experience. 95.9% of the home pages had detectable failures in relation to the WCAG, an increase from 94.8% the year before, with an average of 56.1 errors per page. Shopping sites were among the worst-performing categories: the 95,039 shopping home pages had an average of 71.0 errors, which is 26.6% worse than the overall sample, and only sports sites did worse. Shopify home pages had an average of 75.1, and Magento 75.8. WebAIM is careful to stress that the fact that a platform appears alongside more errors does not mean that the platform is the cause of them, and in practice most of these errors result from choices regarding themes and content.
Baymard Institute's expert benchmarks point the same way for usability in general. In its latest product page benchmark, 51% of leading US and European ecommerce sites score "mediocre" or worse, and its 2025 homepage and category navigation benchmark puts up to 67% of mobile sites in the "mediocre" to "poor" range. These are expert audits against Baymard's tested guidelines, not revenue measurements, but they describe some of the largest and best-funded retailers in the world.
Accessibility is the one part of this where a public survey lets you put a number in pounds, so here's a rough calculation for a UK retailer with £20m of online revenue. The Click-Away Pound survey (Freeney Williams, 2019) estimated that UK internet users with access needs controlled £24.7bn of online spending in 2018, out of £166.6bn in total, so about 14.8% of the market, and that 69% of them leave sites they find hard to use. If a site is hard to use for that group, it loses roughly 14.8% × 69% = 10.2% of its potential online revenue. A retailer taking £20m is then taking about 89.8% of its potential, which puts the potential at £22.3m and the revenue walking away at about £2.3m a year.
Treat that as a ceiling with three caveats. The survey is seven years old and I haven't found a newer edition, so the shares may have moved in either direction. It assumes the barriers are bad enough to make people leave, which won't be true of every error on every site. And it counts only shoppers with access needs, while low-contrast text also fails anyone with ageing eyes reading a phone in the sun, and they don't appear in the calculation at all. The rest of UX neglect can be counted, as Baymard does, but public data doesn't let me price it with any honesty.
Four mistakes I keep finding on good-looking sites
1. Pale, thin text
Half of the premium brands that I have audited use light grey text in a thin font against a white background as their house style. In 2026, WebAIM discovered that 83.9% of home pages had low-contrast text, with an average of 34 instances per page, representing an increase of 15% over the previous year. According to WCAG 2.2, a contrast ratio of at least 4.5:1 is required for text of normal size, and much of the "elegant" product copy falls well below this threshold.
The kind of text that is made to recede is generally the kind that resolves people's doubts, such as regarding composition, care, dimensions, delivery and returns. When the processing fluency is low, people tend to skip over it; the question remains unanswered, and the customer either decides to go elsewhere or buys without knowing. In both cases, there are commercial consequences: in the first instance, there is a lower add-to-basket rate and in the second, a higher return rate.
2. The auto-rotating hero
The rotating banner at the top of the homepage is usually a political compromise: three trading teams each get a slide. Nielsen Norman Group's usability testing, published by Jakob Nielsen in 2013, found people failing to find content that was sitting in a large, prominent auto-forwarding carousel. Two mechanisms do the damage. Because of banner blindness, people consider any item that appears to be an advertisement to be one and, as a result, the automatic action takes over from the person who was still in the middle of reading a slide. Although the NN/g study is 13 years old, WebAIM's 2026 data agrees with it in that pages which make use of the widely used carousel libraries Slick, OWL Carousel and Swiper have 26% to 32% more accessibility errors than average. Again, this only shows an association and does not prove that carousels cause the errors, but it indicates the same direction.
The commercial cost is the most valuable pixels on the site going to a format people skip. In practice, the first slide gets most of the attention, and the campaigns on slides two and three get very little, which means the homepage click-through into categories and the visibility of whatever the trading team is pushing that week are both lower than the layout suggests.
3. Placeholders instead of labels
Making the field name grey and placing the label above it gives the form a neat appearance, and at the same time the instruction vanishes as soon as the customer begins to type. In 2026, WebAIM discovered that 51% of home pages lacked form labels, and one third of the form inputs it examined did not have the correct label; this applies to features such as the newsletter sign-up, account creation, back-in-stock alerts and size quizzes.
The mechanism is working memory. Once the hint has vanished, the customer has to remember what the field asked for, can't check their own entry against it, and has a harder time understanding an error message. NN/g's Katie Sherwin set this out in 2014, and although the article is 12 years old, the cognitive load argument hasn't been challenged. The commercial cost lands in email capture rate, back-in-stock sign-ups and account completions, all of which feed retention.
4. Navigation you have to guess
Menus which have only icons, category names taken from the brand book rather than from the way customers describe the products, and mega menus that only open when the user hovers over them — hovering is not possible on a touchscreen, and an icon conveys meaning only to those who already understand the designer's vocabulary. According to information foraging theory, customers follow what are known as information scents, the signs that indicate they are on the right track; a well-chosen category name or an icon without a label provides very little of this scent.
If the smell is faint, users either abandon the situation or resort to using the search function, thereby wasting time and handing you over the control of what they see first. The fact that Baymard's 2025 navigation benchmark shows up to 67% of mobile sites falling into the mediocre to poor category indicates that this is one of the most frequent mistakes made by big retailers. The commercial impact is reflected in the proportion of sessions that reach a category or product page via navigation, and also in revenue per visitor.
What I look for before signing off now
I've stopped approving designs from a big screen. I ask to see every state of a component: the empty, error, loading and sold-out versions, as well as the hero version, and I ask for a recording of a handful of people from outside the business trying to buy something specific on their own phone. Ten minutes of that footage has ended more debates in my meetings than any number of opinions about white space.
And when I'm hiring for UX, I ask the candidate to walk me through a decision they reversed after watching users. A web designer with great taste will talk about the frame. A UX designer will talk about what the people in the recording did, and what they changed because of it.