Why UsWhy UsServicesServicesOur WorkOur WorkBlogBlog
  • UK
    12:12
  • Start your project
Get in touchGet in touch

User-Centered Design Principles for Effective Websites

Written by Solomon Adlam
November 28, 2024
Black linkedin logo
An independent web design and branding agency dedicated to building relationships, drawing on industry expertise, and delivering award-winning work.

"User-centred design" sounds like something that requires a research department. It does not. At its simplest it means designing around what people are actually trying to do on your site, rather than around what you would like to tell them.

That distinction turns out to be most of the difference between a site that generates enquiries and a site that looks nice.

Start with the jobs, not the pages

Most website projects begin with a page list. A better starting point is a list of what people come to do.

For a typical service business that is something like: work out whether you do the thing they need, work out whether you are any good at it, work out roughly what it costs, and find a way to get in touch. Four jobs, in that order, and almost every visitor runs through them.

Once you have that list, the page structure mostly designs itself, and the arguments about whether the About page should come before Services resolve themselves.

Research you can actually afford

You do not need a lab. You need to stop guessing.

  • Talk to five customers. Ask what nearly stopped them buying, and what they looked for before they got in touch. This takes a week and is more useful than any persona exercise.
  • Ask whoever answers the phone. Sales and support know exactly which questions come up constantly. Those questions are your page structure.
  • Read your search data. Search Console shows what people were looking for when they found you, in their words rather than yours.
  • Watch someone use the current site. Give them a task, stay silent, and watch. Three sessions will produce more insight than three months of opinions.

Clarity outranks cleverness

The most common failure on a business website is not ugliness. It is that a visitor cannot tell what the company does within a few seconds.

Your homepage headline should survive the harshest test there is: would someone who has never heard of you understand what you sell? "Transforming ambition into outcomes" does not pass. "Webflow websites for B2B and SaaS companies" does.

The same applies throughout. Name your services what your customers call them, not what you call them internally.

One clear next step per page

Every page should have an obvious primary action, and it should be the one that makes sense at that stage.

A case study page is not the place for a hard sell; the natural next step is another case study or a line about how you work. A pricing page is exactly the place to ask for the enquiry.

When a page offers five equally weighted options, most people take none of them.

Hierarchy, and the discipline of leaving things out

Everything cannot be important. If a page has six things competing for attention, the visitor's eye has nowhere to land, and the usual result is a scroll to the bottom and a bounce.

The hard part of this is organisational rather than visual. Every department wants their thing on the homepage. Someone has to decide, and the decision should be based on what visitors are trying to do rather than internal politics.

Tell people what is happening

Interfaces should respond. A button that has been pressed should look pressed. A form that is submitting should say so. A file that is uploading needs a progress indicator.

The absence of feedback is why people click "Send" three times and you get three enquiries from the same person.

The same applies to errors. "Something went wrong" helps nobody. "That email address is missing an @" is a design decision that saves a completion.

Accessibility is user-centred design

If you are designing around the people using your site, that includes the ones using a keyboard, a screen reader, or a phone in bright sunlight.

The basics cover most of it: proper heading order, labels on form fields, alt text on meaningful images, visible focus states, adequate contrast, and never using colour alone to convey meaning.

It is also, incidentally, good for everyone. Captions get used in open-plan offices. Good contrast helps outdoors.

Test with people, early and cheaply

Five people will find most of the problems worth finding. You do not need a script, a lab, or a statistically valid sample.

Give someone a realistic task — "find out whether they work with businesses like yours and get a quote" — then say nothing and watch where they hesitate. Hesitation is the data.

Do this on the prototype, not after launch. Changes cost almost nothing before the build and are expensive after it.

Keep going after launch

A website is not finished when it goes live. Look at what people actually do: where they land, where they leave, what they search for, which pages produce enquiries.

Then change one thing at a time, so you know which change did what.

Where we start

Every project we take on starts with what the site needs to achieve and who it is for, before anything gets designed. It is also why our first question is usually about your customers rather than your competitors.

Running a usability test for nothing

You need one person, twenty minutes and a screen recording. That is it.

1. Recruit someone outside your business who roughly matches your customers. A friend of a colleague is fine.

2. Give them a realistic task, phrased as a goal: "work out whether this company could help with X, and get in touch."

3. Say nothing. The hardest part. Do not explain, do not rescue them. Silence is where the findings are.

4. Watch for hesitation, backtracking, scrolling past the thing they needed, and any moment they say "I assume…".

5. Ask two questions at the end: what was confusing, and what would you have expected?

Do this with five people and you will have a prioritised list of everything wrong with your site, for the price of five coffees.

Questions we get asked

How do I know if my homepage is clear enough?

Show it to someone for five seconds, then ask what the company does. If they cannot answer, the headline is not working.

Do I need personas?

Rarely for a small business. Two or three sentences about who you serve and what they need is usually more useful than a document nobody reads.

We disagree internally about the structure. How do we settle it?

Test it. Two people arguing from opinion will never resolve it; five customers will.

If you are planning a site and want a second opinion on the structure before anyone starts designing, we are happy to talk it through.

This is some text inside of a div block.
15 min read
Want to work with Pixel Studio
Book a call
Previous Post
No Previous Post!
Browse all blogs
Next Post
No Next Post!
Browse all blogs

Figma Variables and Design Tokens, Explained Simply

5 min read
Branding

Design Systems for Small Teams: Where to Actually Start

5 min read
Branding

Brand Guidelines: What Actually Needs to Be in Them

5 min read
Branding

How to Review a Figma Design (When You’re Not a Designer)

5 min read
Branding

What Makes a SaaS Product Page Convert

5 min read
Branding

Rebrand or Refresh? How to Tell Which One You Need

5 min read
Branding

How to Prepare a Figma File Your Developer Will Thank You For

5 min read
Branding

UI Design Principles That Actually Affect Conversion

5 min read
Branding

How Much Does Branding Cost in the UK in 2026?

5 min read
Branding

Why "Two Pixels"? The Story Behind the Name

8 min read
Branding

What Actually Happens After Your Website Launches?

9 min read
Branding

Do You Still Need a Website If You're on Instagram?

8 min read
Branding

How Long Does It Take to Build a Website? Our Process, Week by Week

9 min read
Branding

What to Prepare Before You Contact a Web Designer

8 min read
Branding

Webflow vs WordPress vs Squarespace: Which Is Right for Your Small Business?

10 min read
Branding

10 Signs Your Website Is Costing You Customers

9 min read
Branding

Express Blinds & Curtains: Building a Website Around a Growing Yorkshire Business

8 min read
Branding

Website Design for Leeds Businesses: What We've Learned

9 min read
Branding

How Much Does a Website Cost in the UK in 2026?

9 min read
Branding

5 Key Benefits of Hiring Freelance Designers for Your Creative Agency

5 min read
Branding

Freelance Web Designers vs In-House: What’s Better for Your Agency?

4 min read
Branding

How Webflow Empowers Designers to Build Without Developers

5 min read
Branding

The Top 10 Webflow Features Every Small Business Should Know

5 min read
Branding

Webflow CMS: What It Is and Why Your Site Needs It

5 min read
Branding

Why Webflow Is the Future of No-Code Website Development

5 min read
Branding

Webflow vs WordPress: Which Platform Is Best for Your Website in 2025?

5 min read
Branding

From Figma to Webflow: A Simple Guide for Designers and Developers

5 min read
Branding

10 Powerful Things You Can Build with Webflow (That You Didn’t Know)

6 min read
Branding

Why Top Creative Agencies Rely on Freelance Web Designers

5 min read
Branding

Why Web Designers Love Taking Figma Projects into Webflow

5 min read
Branding

Top 5 Tips to Seamlessly Convert Figma Designs into Webflow Websites

5 min read
Branding

Why Image Optimization Matters for Your Website's Performance

5 min read
Branding

The Role of Typography in Web Design

6 min read
Branding

Why Content Strategy Matters for Your Website

5 min read
Branding

Making the Web Accessible for Everyone

10 min read
Branding

Looking Ahead in Web Design: The Future Is Bright

12 min read
Branding

User-Centered Design Principles for Effective Websites

6 min read
Branding

Understanding Color Psychology in Web Design

Branding

Boosting your Website with these design tricks

Branding

Web Design Trends to Watch in 2024

Branding

Figma Variables and Design Tokens, Explained Simply

5 min read
Branding

Design Systems for Small Teams: Where to Actually Start

5 min read
Branding

Brand Guidelines: What Actually Needs to Be in Them

5 min read
Branding

How to Review a Figma Design (When You’re Not a Designer)

5 min read
Branding

What Makes a SaaS Product Page Convert

5 min read
Branding

Rebrand or Refresh? How to Tell Which One You Need

5 min read
Branding

How to Prepare a Figma File Your Developer Will Thank You For

5 min read
Branding

UI Design Principles That Actually Affect Conversion

5 min read
Branding

How Much Does Branding Cost in the UK in 2026?

5 min read
Branding

Why "Two Pixels"? The Story Behind the Name

8 min read
Branding

What Actually Happens After Your Website Launches?

9 min read
Branding

Do You Still Need a Website If You're on Instagram?

8 min read
Branding

How Long Does It Take to Build a Website? Our Process, Week by Week

9 min read
Branding

What to Prepare Before You Contact a Web Designer

8 min read
Branding

Webflow vs WordPress vs Squarespace: Which Is Right for Your Small Business?

10 min read
Branding

10 Signs Your Website Is Costing You Customers

9 min read
Branding

Express Blinds & Curtains: Building a Website Around a Growing Yorkshire Business

8 min read
Branding

Website Design for Leeds Businesses: What We've Learned

9 min read
Branding

How Much Does a Website Cost in the UK in 2026?

9 min read
Branding

5 Key Benefits of Hiring Freelance Designers for Your Creative Agency

5 min read
Branding

Freelance Web Designers vs In-House: What’s Better for Your Agency?

4 min read
Branding

How Webflow Empowers Designers to Build Without Developers

5 min read
Branding

The Top 10 Webflow Features Every Small Business Should Know

5 min read
Branding

Webflow CMS: What It Is and Why Your Site Needs It

5 min read
Branding

Why Webflow Is the Future of No-Code Website Development

5 min read
Branding

Webflow vs WordPress: Which Platform Is Best for Your Website in 2025?

5 min read
Branding

From Figma to Webflow: A Simple Guide for Designers and Developers

5 min read
Branding

10 Powerful Things You Can Build with Webflow (That You Didn’t Know)

6 min read
Branding

Why Top Creative Agencies Rely on Freelance Web Designers

5 min read
Branding

Why Web Designers Love Taking Figma Projects into Webflow

5 min read
Branding

Top 5 Tips to Seamlessly Convert Figma Designs into Webflow Websites

5 min read
Branding

Why Image Optimization Matters for Your Website's Performance

5 min read
Branding

The Role of Typography in Web Design

6 min read
Branding

Why Content Strategy Matters for Your Website

5 min read
Branding

Making the Web Accessible for Everyone

10 min read
Branding

Looking Ahead in Web Design: The Future Is Bright

12 min read
Branding

User-Centered Design Principles for Effective Websites

6 min read
Branding

Understanding Color Psychology in Web Design

Branding

Boosting your Website with these design tricks

Branding

Web Design Trends to Watch in 2024

Branding
Got a project in mind?
info@2pixelsagency.com
Start your project
Let's Play
Services
Webflow Agency LeedsWebflow RetainersOur Webflow WorkBrandingShopify
Brand & Creative
Design SystemsBrand StrategyDesign Research
Company
Why UsOur WorkBlogContact Us
Studio Hours
Monday – Friday 9am – 5pm
Saturday - 10am – 3pm
Sunday - Closed
© 2026 Two Pixels
© Certified Webflow Partner, UK
Privacy Policy