UX Best Practices Worth Defending With Data

Why most UX best-practice lists are useless

I stopped reading “UX best practices” roundups years ago. Most of them are one person’s taste formatted like scripture. Round the corners. Add more white space. Make the button pop. None of it comes with a number attached, so none of it can be argued with, and none of it tells you what happens to your conversion rate if you ignore the advice.

I work at Moonb, a creative studio, and we ship landing pages, product screens, and campaign microsites for marketing teams. When a page underperforms, “make the button pop” is not a diagnosis. So I only carry forward the practices I can back with evidence, and the evidence keeps pointing at boring things. Speed. Shorter forms. Real contrast. Clear feedback. Prevented errors. This piece keeps those, throws out the folklore, and shows what each one is actually worth.

Speed is the interface users feel first

Before anyone reads your headline or judges your palette, they feel how long the page took. Speed is the first impression, and it is measurable now that Core Web Vitals exist: Largest Contentful Paint (how fast the main content shows up), Interaction to Next Paint (how fast the page reacts to a tap), and Cumulative Layout Shift (how much things jump around while loading).

The payoff is traceable, not hypothetical. When Renault cut Largest Contentful Paint by one second, bounce rate dropped 14% and conversions rose 13%. Vodafone improved LCP by 31% and saw an 8% lift in sales. Those are named companies with published results, not a multiplier someone invented for a slide.

Here is the part that should motivate a rebuild. Only about 47% of sites pass all three Core Web Vitals. Meeting the thresholds is still a competitive edge rather than table stakes, which means the slow half of the web is handing you an opening.

Here is a worked example from something we inherited. A campaign microsite loaded a 4MB hero image, three web fonts, and an autoplaying background video before the headline rendered. LCP sat near 5 seconds on mobile. We compressed the hero to 180KB, dropped to a single font, and deferred the video until after first paint. LCP came down to 1.9 seconds. Not one pixel of the visual design changed. The page simply stopped making people wait.

Every form field is a tax you charge the user

Every field you add is a small tax on the person trying to finish. Some fields are worth it. Most are added because a stakeholder “wants the data,” not because the user gets anything back.

Baymard Institute has spent years measuring this. The average ecommerce checkout shows 11.3 form elements by default when the workable number is closer to seven or eight, and completion drops roughly 4 to 6% for every field past the eighth. Forced account creation is its own leak: about a quarter of shoppers abandon when made to register, and around 18% walk away because the process felt too long or complicated.

Another worked example. A lead-gen form asked for nine things: name, company, work email, phone, company size, role, price range, timeline, and “how did you hear about us.” Sales acted on three of them. We cut it to four and let the rep gather the rest on the first call. Submissions climbed and the leads were not meaningfully worse. The rule I use now: a field earns its place only if someone will act on it before the first conversation. Everything else can wait.

Contrast and legibility get decided, not decorated

Grey text on a slightly-less-grey background is the most common mistake in web design, and it is not close. The WebAIM Million report checked the top one million home pages and found low-contrast text on 79.1% of them, averaging nearly 30 instances per page. When four out of five of the most-visited sites get this wrong, you are looking at the default failure mode of the web, not a fringe accessibility concern.

The fix is a number, so it settles the argument fast. WCAG AA asks for a contrast ratio of at least 4.5:1 for normal body text. You can check that in seconds with any contrast tool. Designers reach for #999 grey because it looks calm in Figma at 200% zoom. It stops looking calm on a phone in daylight, which is where most of your traffic actually reads it. If you want to go deeper on choosing colors that hold up, I wrote about that in our guide to brand guidelines.

Prevent the error instead of apologizing for it

The best error message is the one that never has to appear. That is heuristic number five of Nielsen Norman Group’s ten usability heuristics, the most tested set of design principles we have. The strongest designs eliminate error-prone conditions or ask for confirmation before someone commits, rather than reporting a failure after the damage is done.

In practice this means a few concrete moves. Validate a form field the moment the user leaves it, not after they hit submit and lose their place. Disable the “pay” button until the required inputs are actually valid, so the click cannot fail. Ask for confirmation before anything destructive, like deleting an account or wiping a draft. And write the error copy in plain language: “Enter a date in the future” beats “Error 422: invalid parameter.” Every one of these turns a dead end into a nudge.

Visual hierarchy is attention management

A screen with ten equally-weighted things on it is a screen with no hierarchy, which means the user has to do the sorting you were supposed to do for them. Visual hierarchy is you deciding what matters most and making the design say so through size, weight, position, and contrast.

The most useful constraint I know: limit each screen to one or two primary actions. A pricing page can have “Start now” as the loud button and “Talk to us” as the soft link. When a page has five buttons all shouting at the same volume, none of them wins, and the eye bounces off. You make the hierarchy before you place a single element, not as a coat of polish at the end, and it is closely tied to how you run the whole design process.

Show system status so nobody wonders if it broke

When someone clicks and nothing visibly happens, they assume it failed, so they click again, and now you have a double submission and a frustrated person. Visibility of system status is the first of Nielsen’s heuristics for a reason. The interface should always tell the user what is going on.

That covers small things and large ones. A button that shows a spinner the instant it is pressed. An upload with a real progress bar instead of a frozen screen. A saved state that says “Saved” rather than leaving the user to guess. Skeleton screens while content loads so the layout does not appear broken. None of this is glamorous work. All of it is the difference between a product that feels alive and one that feels like it hung.

Consistency is what lets people stop thinking

Every time a button changes shape, a label changes wording, or a pattern behaves differently on one screen than another, you force the user to re-learn something they already knew. Consistency is what lets people stop thinking about the interface and get on with their task.

Internal consistency means your own patterns repeat: the same primary button, the same spacing scale, the same words for the same action. External consistency means you respect the conventions people already carry from every other product they use. A cart icon lives top right. A logo top left goes home. Underlined blue text is a link. You can break a convention when you have a strong reason, but the burden of proof sits on the break, not on the norm.

Accessibility is reach, and you are probably failing it

I am not going to frame this as a legal threat. I will frame it as reach. Accessible design is design more people can actually use, and the WebAIM contrast finding above already told you most sites are leaving readers behind at the very first hurdle.

The specifics are not exotic. Use semantic HTML so a screen reader and the browser understand what a button, a heading, and a landmark are. Make sure every interactive element is reachable and operable with a keyboard alone, because plenty of people never touch a mouse. Give images meaningful alt text. Keep body contrast at or above 4.5:1. Most accessibility wins are the same wins that make an interface clearer for everyone, which is why I treat this as core craft rather than a compliance checkbox bolted on at the end.

Run a one-hour evidence-based UX audit this week

You do not need a big research operation to find your worst problems. Block one hour and do this on your highest-traffic page.

First, run it through a Core Web Vitals check (PageSpeed Insights uses real Chrome field data) and note whether LCP, INP, and CLS pass. Second, count the fields in your most important form and cut anything nobody acts on before the first conversation. Third, run a contrast checker over your body text and fix anything under 4.5:1. Fourth, tab through the page with only your keyboard and see if you can reach and trigger every control. Fifth, click your primary action and confirm the interface visibly acknowledges the click within a moment. Five checks, one hour, every one of them tied to a measurable standard rather than a matter of taste. You will almost certainly find at least two things to fix before lunch.

What changes when a creative team owns the details

The reason these practices slip is rarely ignorance. Teams know forms should be shorter and pages should be faster. The details lose because they are nobody’s specific job, so they fall between the marketer who briefs the page, the developer who builds it, and the deadline that ships it half-checked.

At Moonb I treat this layer as part of the craft rather than a QA pass at the end, because a page that loads fast and reads clearly and never traps the user is worth more than a prettier one that does neither. If your own pages keep failing on these details, here is how an embedded team keeps them from slipping. Either way, the practices here stand on their own numbers, and that was the whole point.