UX/UI design for websites: what actually counts in 2026

Why the prettiest redesign often changes nothing

A typical redesign starts with a collection of reference sites and ends with a site that looks like the references. The result gets celebrated internally, and nothing happens in the numbers. That is not bad luck, it follows logically from the fact that nobody decided beforehand which decision a visitor is supposed to make on this page.

Design in the UX sense is not the question of how something looks, it is how many obstacles sit between an intention and carrying it out. Every extra decision, every field, every click is an obstacle. Swapping the surface leaves every obstacle exactly where it was and gives it a fresh coat of paint.

The most useful test before any redesign takes a minute: say in one sentence what a visitor is supposed to do on this page. If three things come out, the problem is not the design.

The most important part of the design is load time

There is no good design that nobody sees. A page that takes four seconds on a mobile network loses a substantial share of visitors before the first element appears. Those people never show up meaningfully in a bounce rate, because they never properly arrived.

The biggest brakes are almost always the same: uncompressed images in their original format, a font package with six weights, embedded videos that load immediately, and a handful of scripts for things almost nobody uses. All of that can be measured and removed before anyone talks about colours.

Since a few years ago this has been measured with Google's Core Web Vitals. There are three values, and each one is a design decision even though it sounds technical. What counts is what 75 per cent of real page views achieve, split by mobile and desktop, not the one quick test on the office Wi-Fi.

As an everyday guide this is enough: the first visible render is in place in under two seconds on a normal mobile connection, not on Wi-Fi at your desk. If you only test at your desk, you are testing the conditions under which the page is never critical.

PageSpeed Insights shows real-user values at the top, provided your site has enough visitors, and a lab test below. The real-user values are what counts. The lab test helps you find the cause.

Visual hierarchy: one page, one next step

The most common weakness on company sites is not an ugly button, it is too many equally weighted offers side by side. Book a call, newsletter, download the brochure, request a callback, all the same size and the same volume. For a visitor that is not a choice, it is a task.

What works is one main path that looks and reads the same across the whole page, plus at most one quieter secondary path for people who are not ready yet. Everything else belongs in the footer, not in the main area.

The same rule applies to naming. If the button at the top asks for advice, the one in the middle gets in touch and the one at the bottom offers an intro call, a reader sees three different offers, even when the same form sits behind all three.

Visual hierarchy means the eye moves in the right order without thinking. A few tools are enough, applied consistently:

• A headline that names the outcome: for whom, what, with which benefit. No slogan that needs interpreting first.
• One accent colour reserved for the main path only. If links, icons and notices share that colour, the button loses its signal.
• White space instead of borders: spacing groups content more calmly than lines, boxes and shadows.
• Few type sizes: three to four steps are enough for almost any site. More steps create noise, not order.
• No auto-rotating slider at the top. It hides four out of five messages and costs load time.

Readability is not a detail

A great many sites fail on small things that cost nothing. Body text under 16 pixels on a phone, lines running the full width of the screen, light grey type on white because it looked elegant in the template. Every one of those decisions costs readers, and none of them is noticed by someone who knows the text already.

Workable guide values: body text from 17 pixels, line length between 60 and 80 characters, line height around one and a half, and contrast that still holds up on a phone in sunlight. The WCAG accessibility guidelines require a contrast ratio of at least 4.5 to 1 for normal text and 3 to 1 for large text. These are not questions of taste, they are the conditions under which the text gets read at all.

The test is free: open your own site outdoors on a phone with the brightness at medium. Whatever you cannot read effortlessly there, nobody else reads either.

Mobile first, and actually mean it

Mobile first has been a slogan for years and is rarely the truth in practice. Design happens on a large screen, review happens on a large screen, and the mobile version is produced at the end as an adaptation. It shows.

It becomes visible in the same places every time: tables running off the side, buttons too close together, a menu three levels deep, and captions that are longer on a phone than the section above them. None of it is hard to fix, it simply never gets noticed unless someone looks.

In concrete terms, mobile first mainly means designing for the thumb. Most people operate their phone with one hand, and the top corner opposite the thumb is the hardest to reach. Whatever is used often therefore belongs in the lower half of the screen or the middle, not in the top corner.

• Tap targets: WCAG 2.2 requires, in success criterion 2.5.8, at least 24 by 24 CSS pixels or enough spacing to neighbouring targets. That is the floor. For main buttons, from experience, we plan for 44 to 48 pixels in height.
• Font sizes: body text from 16, better 17 pixels. Input fields at 16 pixels or more, otherwise Safari on the iPhone zooms into the form when it is tapped.
• Navigation: at most one level in the mobile menu, with the main button visible outside the menu.
• Tables and comparisons: on a phone as stacked cards or horizontally scrollable with a visible hint, never cut off.
• Phone number and email as links, so one tap is enough.

We reverse the order. The first draft is made at phone width, and only once it holds up there does it get opened out for the large screen. That sounds like a formality and it changes the result more than any decision about colour.

Accessibility: design quality and, for some, a legal duty

Since 28 June 2025, Germany's Barrierefreiheitsstärkungsgesetz (BFSG), the German implementation of the European Accessibility Act, has applied. It obliges providers of certain services delivered to consumers to make them accessible. For websites the relevant part is mainly e-commerce services, meaning offerings through which consumers conclude a contract online: shops, bookings, subscriptions.

To be honest: many purely B2B websites are not in scope. The law is tied to services for consumers, and an information site with a contact form, through which no contract with private individuals is concluded, is not a BFSG case under the common reading. On top of that there is an explicit exemption for micro-enterprises that provide services: fewer than ten employees and no more than two million euros of annual turnover or balance sheet total. Whether you are in scope in your particular case is a legal question, not a design question. It belongs with a lawyer once rather than in an agency brochure.

Regardless of the obligation, most of it is worth doing anyway because it overlaps with good design. Accessibility is not an extra feature, it is a quality measure of whether a page works under poor conditions: with tired eyes, on a train, with one hand, with reading glasses that happen to be somewhere else.

• Contrast of at least 4.5 to 1 for body text
• Keyboard operability with a visible focus indicator
• Labelled form fields instead of placeholder text only
• Alternative text on images that carry meaning
• A clean heading structure that screen readers and search engines understand too

Forms and booking

The form is where most of the work that went into a page ends. Anyone who has read this far is interested, and still many drop off exactly here. Usually it is not a lack of motivation, it is fields asking for more than the visitor is willing to give at that moment.

• As few fields as possible: name, email, one free-text field. Anything you can ask in the call does not belong in the form.
• Mark required fields clearly and explain errors right at the field, not only after submitting at the top of the page.
• Name the button after the outcome: request a meeting rather than submit.
• Say what happens next: who gets in touch, when, and how long the call takes.

For B2B providers whose next step is a conversation, an embedded calendar often replaces the form altogether. The visitor sees free slots, picks one and is done, without waiting for a reply. What matters is that the calendar loads on your own page instead of redirecting elsewhere, that it works on a phone and that it does not ask twenty extra questions. Two or three short qualifying questions are enough.

Calendar widgets often bring a lot of script. Load them only when the visitor scrolls near the section or taps the button, otherwise you pay for the booking feature with a slower load for everyone.

Trust in B2B: concrete, not shiny

In B2B nobody buys on the first click. Above all, the site has to answer one question: can I trust these people with a meeting, a budget and my name inside my company? Gloss does little for that. What helps is things that can be checked.

• Real faces: photos of the people you will actually talk to, instead of stock images of handshakes.
• References with names: client logos, quotes with a person and company, case studies with a starting point and a result. Anonymous praise tends to have the opposite effect.
• Concrete numbers instead of adjectives: years in business, number of projects, meetings booked. Only what is true and what you can back up.
• Prices, or at least a price range, where possible. If you name nothing, people often assume you are more expensive than you are.
• A complete legal notice (Impressum) and a reachable address. In Germany the Impressum is mandatory anyway, and B2B buyers do actually check it.

Trust signals work best near the main button, not collected on a separate references page that hardly anyone opens.

Where design ends and the offer begins

A well-built page cannot rescue an unclear offer. If after thirty seconds it is not obvious who this is for and what it costs, no layout will help. The most common reason for weak numbers is not the design, it is copy that talks about the company instead of the reader's problem.

How that shows up in the numbers, and how to tell whether the problem sits before or on the page, we wrote down here: conversion rate, why more visitors are rarely the answer.

And once the page stands, findability decides the rest. What AI search is currently shifting about that is in SEO with AI.

Checklist before a redesign

Before anyone designs a new layout, these points should be answered. The order is deliberate: the first points cost almost nothing and often settle whether a redesign is needed at all.

1. Define the one next step per page in a single sentence.
2. Check the current Core Web Vitals with real-user data, split by mobile and desktop.
3. Look in your analytics at where visitors enter and where they drop off.
4. Click through the site on your own phone outdoors, all the way to a submitted form or booked meeting.
5. Hold contrast, type sizes and tap targets against the guide values above.
6. Test the offer: does a stranger understand within thirty seconds who it is for and what it costs?
7. Gather trust signals you can back up and place them next to the main button.
8. Clarify whether the BFSG applies to your offering before the new site is built, not afterwards.
9. Define the measures you will judge success by after the relaunch: enquiries, meetings, load time.

When a redesign is not the answer

A complete rebuild is expensive, takes months and often resets things that worked, for example rankings that grew over time. In many cases targeted optimisation achieves more than a new face.

• When too few visitors arrive: then the problem is reach, not the site. A redesign changes nothing about that.
• When the offer is unclear: then new copy helps more than a new layout.
• When only load time is poor: images, fonts and scripts can usually be fixed without a rebuild.
• When individual pages are weak: then those pages get reworked, not the whole website.

A rebuild does make sense when the system behind it turns every change into a struggle, when the site fundamentally does not work on a phone, or when the offer has changed so much that the old structure no longer fits.

How we build sites

We start from the next step and build the page backwards towards it. Only once it is settled what should happen do structure, copy and design follow, in that order. Images ship compressed, fonts are cut back to what is needed, and anything not required immediately loads later.

Our view of websites comes from sales: since 2023 we have booked more than 2,000 meetings for clients, and in every one of them the prospect lands on a website sooner or later. What that looks like in detail is on our websites page. If you have an existing site and want to know where it snags, we look at it together in the first call.

Frequently asked questions

Sources

1. web.dev (Google): Web Vitals and thresholds
2. web.dev (Google): Interaction to Next Paint (INP)
3. W3C: WCAG 2.2, success criterion 2.5.8 Target Size (Minimum)
4. W3C: WCAG 2.2, success criterion 1.4.3 Contrast (Minimum)
5. Barrierefreiheitsstärkungsgesetz (BFSG), statutory text
6. Directive (EU) 2019/882, European Accessibility Act