Pricing Page Design: Layout, Tiers and UK Rules That Convert

  1. Home
  2. »
  3. Blog
  4. »
  5. Pricing Page Design: Layout, Tiers and UK Rules That Convert

A good pricing page answers two questions fast: what will I pay, and what do I get for it? Everything else, from layout to colour to the wording on your buttons, exists to make those two answers easy to find, easy to trust and easy to act on. If you run a service business in the UK, there is a third job: the page has to keep you on the right side of the law.

This guide walks through how to build one, step by step, with the research behind each choice and a few honest notes on where the usual advice falls short for agencies, consultants and other project-based firms.

Kukoocreative
Make Your Pricing Page Clear
Kukoocreative creates logos and websites that build brand recognition, helping your pricing page connect your offer with the people who matter.

Visit Kukoocreative

TL;DR

  • Lead with a short, scannable price block that shows what you pay and what you get. Push detail and FAQs below it.
  • Keep to three or four options, name them in plain English and mark one as recommended.
  • Show the full price. Under UK law, mandatory charges belong in the headline figure, and VAT treatment must be obvious.
  • If your work is bespoke, publish a starting price or a range and explain what moves it, rather than hiding behind “contact us”.
  • Build to WCAG 2.2 AA from the start, and put one clear next step beside every price.

Table of Contents

What a pricing page is really for

Most visitors who reach your pricing page are close to a decision. They have read about your service and now want to know whether it fits their budget. That makes it one of the highest-intent pages on your site, and one of the easiest to get wrong.

User testing summarised by Process Street found that customers want two things: to know what they will pay and what they will get in return. The same write-up warns that overcomplicated pages push people away. It is based on SaaS products and dates from 2016, so treat the numbers as directional. The principle holds for service firms too, and arguably matters more: a buyer choosing a branding or web partner is taking a bigger leap than someone trialling a software tool.

So think of the page as a promise. If it is clear, the reader assumes your work and your communication will be clear. If it is cluttered or evasive, they assume the same of the project.

Start with a layout that answers both questions

The pattern that works most reliably is a simple two-layer structure.

Layer one: the price matrix. This sits at the top. It is a short row of cards or columns, each showing a name, a price, a one-line description of who it suits and a button. Nothing more.

Layer two: the detail. Below the matrix, put the full list of inclusions, a comparison table, examples of past work, testimonials and the FAQ. The Process Street research recommends separating the core pricing matrix from the detailed feature breakdown, because loading everything into the first screen slows the decision.

A simple order for the whole page

  1. A headline that states the offer in plain words, plus one sentence on who it is for.
  2. The price cards.
  3. A short “what’s included” comparison.
  4. Proof: a testimonial, a project example or an award.
  5. Answers to the objections people raise before they enquire: revisions, timescales, payment, VAT.
  6. A closing call to action, repeated from the top.

That last step matters. Someone who scrolled all the way down has read everything and is ready. Do not make them scroll back up to find the button.

How many options to show

The research behind the Process Street piece found SaaS leaders averaged about 3.5 pricing options per page. For a small agency the practical answer is three or four. Fewer than three and visitors have nothing to compare. More than four and you are asking them to do the work of choosing.

If you have a long list of services, do not put them all in one table. Group them. A branding page can carry three tiers; web design, print artwork and automation can each have their own page, linked from a simple overview.

Worked example: three tiers for a logo service

Say you sell logo and identity work. A clean three-column layout might read like this:

Option Who it suits What to show
Polish A business with a logo that needs refreshing Price, what is tidied up, turnaround
Logo only A new or growing business needing a mark Price, number of concepts, files supplied
Visual identity A business that wants a complete look Price, logo plus colours, type and usage rules

That is, in simplified form, how we lay out our own logo design and visual identity page: polish at £150, logo only at £440 and visual identity at £750, each a one-off fee. Each tier answers a different starting point rather than a different level of ambition, which makes the choice easier.

Order the options and highlight one

The usual instinct is to go from cheapest to most expensive, left to right. The CXL research published on Speero tested ordering on a survey-tool pricing page and found that people tend to scan in an “r” shape, spending most attention on the first options. High-to-low ordering occasionally lifted interest in premium plans. It was one experiment on one product, so test it on your own audience before committing.

The follow-up study on highlighting a recommended plan points the same way: marking one option clearly draws attention to it. A “recommended” badge, a stronger border or a slightly different background are all enough. Choose the option that suits most of your clients, not simply the dearest one. If people regularly buy the middle tier, highlight the middle tier.

Two cautions:

  • Highlight one option, not three. If everything is special, nothing is.
  • Be honest about why. “Most popular” must be true. The CMA has also published guidance on urgency and price-reduction claims, warning against claims that are misleading or put unfair pressure on buyers. Fake countdown timers and invented “only two slots left” banners do not belong on a pricing page.

Write the copy in plain English

The same Speero research notes that users prefer plain, benefit-focused language over product-specific jargon. For a service firm this is easy to get wrong, because we are tempted to describe deliverables in trade terms.

Compare:

  • “Brand architecture and asset suite”
  • “Your logo, colours, fonts and a simple guide so everything you produce looks consistent”

The second tells a business owner what they are buying. Use it.

A few habits that help:

  • Name each tier after the job it does (“Fix”, “Scale”), or after the client’s situation, not after metals or planets.
  • Put the outcome first, the deliverable second.
  • State the number of revisions, the turnaround and how payment works. These are the questions people email about, so answer them on the page.
  • Keep button wording specific: “Start a logo brief” beats “Submit”.

What if your work is bespoke?

This is where generic pricing page advice stops being useful. Most examples in the search results are software companies with fixed monthly plans. A web build, a CRM integration or a process automation project is scoped, not subscribed to.

You still have good options, and “price on request” is the weakest of them. Visitors who cannot see any figure tend to assume it is more than they can afford and move on, or send the same vague enquiry to five firms.

Better approaches:

  1. Publish a starting price. Use “from” only when you genuinely do the work at that price.
  2. Show a range and what drives it. Number of pages, integrations, content volume and accessibility requirements are the usual factors. Our guides on UK website costs and agency pricing models show how this can be explained without false precision.
  3. Offer a fixed-price entry point. A small, defined product lets people try you at low risk. Ours is a £25 website speed improvement.
  4. Use plans for ongoing work. Care and support packages suit tiers well, because the scope repeats every month.
  5. Explain how a quote works. Tell visitors what you need from them, how long a quote takes and what it will contain.

If you publish a price for a package that is bespoke in the details, say what is fixed and what is not. A short line such as “Final price confirmed after a free brief” is honest and removes anxiety.

UK rules your pricing page must respect

This is not the exciting part of pricing page design, but in the UK it is part of the design brief. Check anything below that affects you against the linked official guidance, and take advice from a solicitor or your trading standards office if you are unsure about a specific case.

Show the full price up front

The CMA’s price transparency guidance, updated in January 2026, says traders must give total prices up front, and the headline price should include all mandatory charges. Hiding unavoidable fees until late in the process is known as drip pricing. Per the same guidance, penalties can reach 10% of annual turnover or £300,000, whichever is greater.

Upfront total compared with a later added fee

That guidance is written around consumers. If you sell only to other businesses, the consumer rules may apply differently, but showing a clear, complete price is still the right design choice, and it is what business buyers expect.

In practice:

  • If a fee is compulsory, such as a set-up charge or a required hosting package, include it in the headline price or show it right beside it.
  • If you cannot give a final total yet, explain clearly how the buyer can work it out. The CMA’s open letter to online businesses says this.
  • State whether prices include or exclude VAT, in the same place as the price. A small “+ VAT” label in light grey is a design failure.

Show who you are

Trading standards guidance from Kent County Council lists what a business website should display: for a limited company, the registered name, company number, contact telephone number and email address, and VAT number if registered. It also says prices on the website must be clear and easy to understand. Put these details in the footer so they sit on every page, including your pricing page.

Be careful with analytics and cookies

You will want to know whether the page works, so you will measure it. Under PECR, the ICO says analytics cookies need consent that is actively and clearly given. Plan the cookie banner as part of the design, not an afterthought dropped over your price cards.

Design for everyone who might buy

A pricing page is a decision page, and decisions fall apart when people cannot read or operate the page. GOV.UK’s guidance on making a website accessible is written for public sector bodies, but the standard it points to, WCAG 2.2 AA, is a sensible baseline for any business. The Equality Act 2010 also expects service providers to consider reasonable adjustments.

For a pricing page this means:

  • Enough contrast between text and background, especially on the highlighted card.
  • Prices and plan names as real text, not baked into images.
  • Comparison tables built with proper table markup so screen readers can follow them.
  • Buttons you can reach and activate by keyboard, with a visible focus outline.
  • Ticks and crosses that are labelled for assistive technology, not just coloured symbols.
  • Cards that stack cleanly on a phone, with the recommended option not buried at the bottom.

If you want to know what a formal review costs, see our breakdown of UK accessibility audit price bands. We also explain why accessibility matters for UK business success.

Make the price believable

Numbers on their own are cold. Three small additions make them credible.

Explain the fee. The most trusted pricing pages explain where a cost comes from. One example from a different trade shows the principle well: a wedding photographer publishing transparent travel fees in a clear band tells couples what to expect before they ask. The same idea works for design: say what a rush job, an extra round of research or an additional page adds.

Add proof beside the price. A short testimonial or a link to relevant work reassures a buyer at the moment doubt is highest. Our portfolio does this job for us.

Remove the risk. Say what happens if the first direction is wrong. For us, that is unlimited revisions on branding and web system work, which we state next to the price rather than leaving it to the small print.

Make sure people can find the page

A well-designed page helps no one if searchers never reach it. Give it its own URL, a clear title and a short description that mentions the service and the price band. If your site runs on WordPress, a practical guide to using Yoast SEO will help you set titles, descriptions and indexing sensibly. Keep the page text real: search engines and buyers both prefer actual words to a price table pasted in as an image.

A review checklist before you publish

Run your draft through these questions:

  1. Can a stranger tell what they pay and what they get within ten seconds?
  2. Are there three or four options, with one honestly recommended?
  3. Is the full price shown, with VAT status beside it?
  4. Is every tier described in plain English?
  5. Is there one obvious next step next to each price?
  6. Are your company details in the footer?
  7. Does it pass a keyboard-only test and a contrast check?
  8. Does it work on a phone held in one hand?
  9. Have you tested it with someone outside your business?

That last one is the cheapest and most revealing. Five minutes with a friend who has never seen your site will tell you more than a month of guesswork.

Our view: price pages are brand pages

We have spent over a decade helping business owners build brands and websites, and the pricing page is where design and honesty meet. People often treat it as a technical page that sits at the back of the site. We think it is one of the most revealing pieces of your brand.

A tidy, plain-spoken price page says you are organised, that you respect your client’s time and that you will not surprise them later. A vague one says the opposite. That is why we publish prices where we can, such as £150, £440 and £750 for our logo options, and explain the rest rather than hide it.

Our view is also that design and build should not be split. A pricing page that looks beautiful but cannot be edited, measured or made accessible will not last. That is why we work as a single partner covering creative design and technical delivery, through a collaborative four-step process, and why revisions stay unlimited on branding and web system work: we would rather get it right with you than get it signed off.

If you take one idea from this article, make it this: show people exactly what they are buying, and let your design carry the confidence.

— Kukoo

Want a pricing page that does its job?

If your current page is not turning visitors into enquiries, we can help with the look and the build. Start with our web design and development services, or read how we work with Leeds business owners. If your brand needs tidying before your pricing goes live, our visual identity packages are a good place to begin. Get in touch and tell us what you are selling.

FAQ

How many pricing tiers should a service business show?

Three or four is a sound default. SaaS leaders averaged about 3.5 options in the Process Street research, and fewer than three leaves nothing to compare. If you offer more services than that, give each service family its own page.

Should I publish prices if every project is different?

Yes, in some form. Publish a starting price, a range or a fixed-price entry product, and explain what changes the final figure. Buyers who can judge fit before they enquire send better enquiries, and you waste less time on quotes that were never going to work.

Does VAT have to be shown on my pricing page?

The CMA expects prices to be clear and complete, so make it obvious whether a figure includes VAT, next to the price itself. Your accountant or trading standards office can confirm how the rules apply to your customers, particularly if you sell to both consumers and businesses.

Is it better to order plans from cheapest to dearest?

Not always. One CXL experiment found high-to-low ordering sometimes increased interest in premium plans. It was a single test on one product, so run your own comparison if you have the traffic, and keep your recommended plan visually distinct either way.

Sources