How to show a client two versions side by side
How a one-person AI agency presents website design options: two real versions that differ in one way, a side-by-side review, and a record of the choice.
A florist asks for a new homepage. The designer, keen to impress, sends five screenshots in one email: different colours, different layouts, one with a big photo, one with a shop grid. Two days later the reply comes back. She likes the header from the second, the photo from the fourth, and "the green one, but warmer". The designer builds that. The florist looks at it and says it doesn't feel like any of the ones she liked.
Nobody did anything wrong. Five options invited a mix, and a mix is a new design nobody had looked at. When your one-person AI agency's agent can make five options in minutes, that trap is easy to fall into.
Here's the approach that works better. Show two real versions of the same page, side by side, that differ in one clear way. Use the same words and photos in both. Open them on a phone as well as a computer, say which one you'd choose and why, and ask for one choice by a date. Then write down exactly which version they chose.
How should I present website design options?
As working pages, not pictures. A screenshot hides what a small business owner cares about most: whether the booking button is easy to tap, how long the menu takes to find, how the page feels on the phone in their hand. If your agent or your site builder can produce a live page, show that.
Then keep the review small:
- Two versions, labelled with what's different, such as "Version A: booking first" and "Version B: photos first".
- The same content in both. Same headline, same photos, same prices. If the words differ, the client compares the words and not the design.
- One question. "Which of these helps your customers book?" is easier to answer than "What do you think?"
- Your recommendation, with one reason.
- A date for the answer.
Why two versions, not five?
Because every extra option makes the choice slower and less clear. The Nielsen Norman Group, which studies how people use websites, describes Hick's Law: the more choices you present, the longer people take to reach a decision. That's about menus on a web page, but a client choosing between designs works the same way, with the added risk that they'll pick parts from each.
Two versions also keep your own work in check. Building five directions properly takes five times the effort. Building two, and building them well, leaves time to finish the one they choose.
If you have more ideas than that, narrow them yourself first. Choosing is part of the job the client is paying you for.
What should be different between the two?
One thing. Pick the decision that matters most for this page and build the two versions around it.
For a local business homepage, the useful decisions are usually about order: what a customer sees first. A dog groomer might compare "book an appointment" at the top against "see our prices" at the top. A café might compare the menu first against the opening hours first. The small business homepage content your client's customers look for should decide what's on the page; the two versions test the order.
Leave everything else the same. If version B has a different layout, different colours and a different font, and the client prefers it, you won't know which of the three they liked. Colours and fonts can be a second, smaller round once the layout is settled.
How do I set up the side-by-side view?
Give each version its own link, so the client can open both, on their own phone, whenever they like.
Most hosting services for simple sites can do this. Cloudflare Pages, for example, gives a new version its own preview address when you put it on a separate branch (a working copy of the site), so you can share it without changing the live site. Other hosts have similar preview links. Whatever you use, check that:
- each link opens the right version, and the label says which;
- neither link is the live site;
- both work on a phone without logging in.
Then send a short message, not a long one:
| What to include | Example |
|---|---|
| The two links, labelled | Version A: booking first. Version B: photos first |
| What's the same | Same words, photos and prices in both |
| The one question | Which one makes it easier for a customer to book? |
| Your pick and why | I'd choose A: the booking button is on screen as soon as the page opens on a phone |
| What to try | Open each on your phone and try to book a Saturday appointment |
| When you need an answer | By Friday, so the site can go live next week |
The "what to try" line is the one that makes the difference. Asking a client to do a real task on each version turns the choice from taste into something they can feel.
How do I run the review?
In person or on a call if you can, with both versions open. Go through them in the same order each time:
- Open version A on a phone. Let the client try the task.
- Open version B. Same task.
- Ask which one was easier, and why.
- Give your recommendation and the reason.
- Agree the choice, or agree a date for it.
Keep your own opinion until step 4. Clients often defer to the designer, and you want to hear what they felt first.
What if the client wants a mix of both?
Say yes to the idea and no to deciding it on the spot. A mix is a new version. Build it, call it version C, and show it the same way. It often takes less time than you'd think, and it saves the conversation from earlier: "that's not what I liked".
If the mix goes beyond what you quoted, for example it needs a new booking tool, say so and quote it before you build it.
How do I record the client's choice?
Write down which version they chose, not just that they approved "the design". A name and a date are enough: "Version A, booking first, chosen on 12 August". Keep that version as it was when they chose it. Sites change quickly near the end of a project, and if you can't point to the exact version the client approved, a later question turns into a memory contest.
This is approving one exact version in practice. Website revision approval goes into more detail on what to send and what to keep, and the website QA checklist covers what to check before the chosen version goes live. If your agent is the one making the final changes, the same record tells it which version to work from; AI agent website updates explains what else it needs to do that safely.
Where Volant fits
Volant has version history for every website, so you can compare versions and go back to any earlier one. You choose which one goes live. Building, reviewing and delivering client websites shows how two versions look side by side and how the client's choice is kept.