What you'll understand by the end of this lesson
- Why context changes perception — the same thing judged differently next to different neighbours
- The specific conversion applications of juxtaposition: pricing, before/after, comparison tables
- What you're placing next to your CTA — and whether that's helping or hurting
- How to audit your pages for juxtaposition opportunities and problems
The principle in plain English
When two things are placed side by side, they're evaluated relative to each other. The presence of one changes how the other is perceived.
This isn't a niche psychological quirk. It's one of the most basic ways the brain handles comparison. We don't evaluate things in absolute terms — we evaluate them relative to what they're adjacent to. A £100 item seems expensive next to a £20 item. The same £100 item seems reasonable next to a £500 item. The item hasn't changed. Its neighbour has.
Juxtaposition is the deliberate use of this mechanism. By choosing what sits next to the thing you want to be evaluated, you influence how it's evaluated — before the visitor has made any conscious comparison.
A simple example
A pricing page has three tiers: Starter at £29/month, Pro at £79/month, and Enterprise at £299/month.
Most visitors arrive thinking about Starter or Pro. But the presence of Enterprise at £299 changes how they evaluate Pro. Next to £299, £79 feels like a reasonable mid-range price. Remove the Enterprise tier and Pro becomes the most expensive option — and is evaluated differently.
The Pro price hasn't changed. What's changed is its neighbour. The juxtaposition with a higher-priced option makes the middle tier feel affordable by comparison.
This is related to anchoring and the decoy effect — but juxtaposition is a broader principle. It applies anywhere that two things are placed next to each other: results, testimonials, images, copy, and CTAs.
Juxtaposition in CRO practice
Pricing tier comparisons
The most explicit use of juxtaposition in conversion design. A high-priced tier placed adjacent to the recommended mid-tier makes the mid-tier feel like a bargain by comparison. The expensive tier's primary job may not be to convert — it may be to make everything else look more reasonably priced.
This also applies within a single tier. A price displayed next to its value — "£79/month — equivalent to one hour of a consultant's time" — uses juxtaposition to reframe the cost against a larger reference point.
Before/after layouts
A before/after comparison is pure juxtaposition. The "before" state makes the "after" state more dramatic. A website screenshot before a redesign, placed beside the redesigned version, allows the improvement to be perceived rather than described. The same redesign shown without the before would be evaluated as a static result. Juxtaposed against the original, it's evaluated as a transformation.
This is why before/after content works in case studies, service pages, and ad creative. The contrast is created by adjacency. Neither image communicates the full story alone — the pairing creates the meaning.
If you're selling a service that produces measurable improvement — CRO, SEO, design, development — your case studies should always lead with the before state. The "after" result is only as impressive as the gap between it and the before. Without the before, visitors evaluate the result as a standalone number. With the before, they evaluate it as a change — which is how transformation is measured.
The problem alongside the solution
A service page that opens with the problem — the client's situation before they engaged, the pain they were experiencing — and then presents the solution creates a juxtaposition between need and resolution. The solution is evaluated against the scale of the problem, not in isolation.
A service page that opens directly with what you do and then lists the outcomes skips this. The visitor evaluates the outcomes without a reference point for why they matter. Juxtaposing the problem with the solution gives outcomes the context they need to feel significant.
Competitor comparison tables
When you place your product next to competitors in a comparison table, you're using juxtaposition deliberately. The choice of which competitors to include — and which features to compare — determines the frame within which your product is evaluated.
A comparison that selects competitors who are weaker on your strongest features juxtaposes your advantages against their gaps. This is standard competitive positioning. The mechanism is juxtaposition: adjacency creates the comparison, and the comparison creates the relative valuation.
What's next to your CTA
The element immediately adjacent to your primary CTA is its juxtaposition context. A CTA placed next to a price ("£97") is evaluated in a price frame. The same CTA placed next to a testimonial ("We recovered £14,000 in a single month") is evaluated against that value. The same CTA placed next to a security badge is evaluated in a safety and trust frame.
None of these change the CTA's label. But each changes what the visitor is thinking about when they decide to click.
Juxtaposition can work against you. A testimonial placed immediately next to a price can make the price feel expensive if the testimonial doesn't reference value clearly. A competitor comparison table that places a strong competitor's logo prominently alongside your brand anchors the visitor's evaluation to that competitor. Before adding any comparison or adjacent content to a conversion-critical area, ask: what does this juxtaposition make the visitor think about my offer? Is that the frame you want?
Showing the problem alongside the CTA
One application that's often missed: placing a short, vivid articulation of the problem the visitor has immediately above or beside the CTA.
Instead of just "Start your free trial," a section that shows:
"Most teams lose 3+ hours a week to manual reporting that should take minutes." Start your free trial
The juxtaposition of the problem and the solution action — in immediate proximity — makes the CTA feel like relief rather than commitment. The visitor clicks from a state of "yes, that's my situation" rather than a neutral evaluation of the offer.
The CRO audit
Look at your key conversion pages and ask:
1. What is immediately adjacent to your pricing?
Is your price sitting next to something that makes it look reasonable (a higher-priced tier, a value equivalence, a result it produces) or something that makes it look like an isolated cost (a feature list with no framing, a plain checkout form)?
2. Do your case studies and testimonials include the before state?
Check your case study and testimonial copy. Does it include the situation before you were engaged — the problem, the metric, the pain? Or does it start with the result? Without the before, the after is just a number. With the before, it's a gap — and gaps are what make results feel significant.
3. What does your primary CTA sit next to?
For every primary CTA on your key pages, note what's immediately above and beside it. Is that content the most persuasive thing on the page — a strong result, a testimonial, a clear value statement? Or is it an unrelated element — a section heading, a decorative divider, a newsletter signup form?
A SaaS pricing page shows two tiers: Basic at £19/month and Pro at £79/month. A/B test adds a third tier — Enterprise at £299/month — without changing Basic or Pro. The Pro tier's conversion rate increases by 22%. What explains this?
You've now covered the 12 principles behind how people see and process information on a page. The next chapter moves into meaning — the principles that shape how users interpret what they're looking at and decide whether to act.