What Is a Landing Page?
A landing page designer's playbook.

What is a landing page?

Landing pages are what I build most. Here's the plain definition, then how I actually think about them when a client's money is on the line.

Technically, any page someone arrives on first is their "landing page" in analytics. But when marketers and designers say landing page, we mean something more deliberate: a page designed for one audience, one message and one next step.

My own definition is simpler: a landing page is a promise kept. An ad, email or post made someone a promise. The landing page has about three seconds to prove they're in the right place, and a minute or two to get them to act on it.

How a landing page works

1. Someone sees a message somewhere: an ad, an email, a post, a search result.
2. They click and arrive on a page that repeats that exact message.
3. The page explains the offer, answers doubts and shows proof.
4. They take one action: fill a form, book, buy or sign up.
5. A thank-you page and follow-up take it from there.

Landing page vs homepage vs website vs sales page vs funnel

These get mixed up constantly, and it's how businesses end up paying for the wrong thing.

"Website landing page" is a common search, and it usually means one of two things: a page on your site built for a campaign, or the page people see first. Both are fine. What matters is whether it has one job and does it.

What a landing page is used for

Every landing page exists to get one thing. Knowing which thing decides almost everything else on the page.

One page, one of these. The moment a page tries to get leads and sign-ups and sales at once, visitors hesitate, and hesitation looks like a low conversion rate.

Types of landing pages

The names vary, but almost every landing page fits one of these patterns.

Don't forget the thank-you page

It's the most ignored landing page and one of the most valuable. The visitor just said yes, so they're at peak attention. Tell them exactly what happens next, set expectations on response time, and offer one small next step, like adding the appointment to their calendar.

When you need a landing page (and when your homepage is enough)

Not every business needs a dozen landing pages. Here's how I decide.

• Running Google or Meta ads: yes, one page per offer, and ideally per audience.
• Launching a promotion or seasonal offer: yes.
• Selling several distinct services: one page per main service helps both ads and search.
• Mostly referral and repeat customers: a strong homepage and contact page may be enough for now.
• Brand-new business with no offer tested: get a simple site live first, then add landing pages as you test offers.

Know the visitor: traffic source, temperature and intent

The same offer needs a different page depending on where the visitor came from and how ready they are.

I write one sentence before designing: "This page is for [who], arriving from [where], who wants [what] and is worried about [what]." If I can't fill it in, the page isn't ready to design.

One page, one goal: choosing the conversion

The single biggest rule in landing page design, and the one people break most.

Choose the action by asking: what's the smallest step that moves this person meaningfully closer to buying? For a roofer, it's an inspection. For a SaaS tool, a free trial. For a dentist, a booking. For a big purchase, maybe just an estimate.

• Remove the main navigation or reduce it to the logo.
• Make every button say and do the same thing.
• Move secondary options (phone, chat) to a quiet line, not a rival button.
• Cut links to blog posts, social profiles and other services.

The offer on the page

Design and copy can only make a good offer easier to say yes to. They can't fix a weak one.

Weak vs strong

Wireframing a landing page

I sketch every landing page as grey boxes before any colour or photo. It keeps the focus on order and message.

The section order I start from

1. Headline, subhead, main action and a key visual (above the fold).
2. Quick trust strip: ratings, licences, years, logos (only real ones).
3. The problem, in the visitor's words.
4. The offer and how it works, in three steps.
5. Proof: photos of real work, reviews, results.
6. Objections: price, timing, risk, answered plainly.
7. FAQ.
8. Final call to action repeating the offer.

What "above the fold" really means

It's what shows before scrolling. On phones, that's small. I design the phone version first and make sure the headline, one line of explanation and the button all fit. Desktop gets more room, not more content.

Anatomy of a high-converting landing page

Here's every section I typically include, top to bottom, and what each one is for.

1. 01
   Hero

   Headline that matches the ad, subhead, main button or form, one strong visual.

2. 02
   Trust strip

   Real ratings, licences, certifications, years in business, client logos.

3. 03
   Problem

   Name the visitor's situation so they feel understood.

4. 04
   Offer & benefits

   What they get and why it matters to them, not features alone.

5. 05
   How it works

   Three simple steps that remove uncertainty.

6. 06
   Proof

   Photos of real work, reviews, results, case studies.

7. 07
   Objections

   Price, time, risk, guarantee, answered directly.

8. 08
   FAQ

   The questions people ask on the phone.

9. 09
   Closing CTA

   Repeat the offer and the same single action.

Headlines, subheads and message match

Most visitors read the headline and decide. Everything else is for the people who stayed.

Headline formulas I actually use

• Outcome + timeframe: "A working AC by tonight, or the visit is free."
• Problem + promise: "Leaking roof? Get a written estimate in 24 hours."
• For who + what: "Bookkeeping for busy restaurant owners, done monthly."
• The question they're asking: "Repair or replace your furnace? Find out in 60 seconds."

Avoid clever. Puns and vague slogans make people think, and thinking costs attention. Your headline should be the thing the visitor would type into Google.

Message match checklist

• Same main phrase in the ad and the headline.
• Same offer and price.
• Same location if the ad targets a city.
• A similar image or colour so it feels continuous.

Landing page design: layout, type, colour, images, mobile first

Good landing page design isn't decoration. It's making the right thing obvious and everything else quiet.

My design rules

1. One accent colour, used only for the action. If everything is bright, nothing is.
2. Body text at least 17 to 18px on phones. Small grey text kills trust.
3. Real photos of the team, the work or the product beat stock every time.
4. One idea per section, with space around it.
5. Design the phone version first.
6. Keep the button in the same style everywhere so people learn it.

Make it look like you, not a template

Visitors have seen thousands of template pages. Generic gradients, stock handshakes and identical layouts read as "another one of these". A distinct type choice, real photos and a colour that fits your industry make the page feel trustworthy and specific.

Forms, buttons and calls to action

This is where the conversion actually happens, so small details have big effects.

Trust and proof (without fake reviews)

People don't believe your claims. They believe evidence. Here's what counts, especially when you're new.

If you don't have reviews yet

• Show your real face and name. People trust people.
• Show your process in detail. Specifics feel credible.
• Offer a guarantee or a no-obligation first step.
• Show real work, even personal or practice projects, labelled honestly.
• Ask your first customers for a review the day the job is done.

Everything in my own demos is clearly labelled as fictional for exactly this reason. They show what a page could look like, not results I'm claiming.

Interactive elements: calculators, quizzes, estimators and sliders

This is my specialty. A good interactive tool turns a page from something you read into something you use.

Speed, mobile and accessibility

A slow page loses people before they read a word, and you've already paid for the click.

• Compress and properly size images; load below-the-fold images lazily.
• Avoid heavy sliders, autoplay video and piles of tracking scripts.
• Test on a real phone over mobile data, not just office wifi.
• Tap targets big enough for thumbs.
• Text contrast strong enough to read in sunlight.
• Every form field has a visible label.

Landing page conversion rate: what it is and what's "good"

This is one of the most searched landing page questions, and one of the most misunderstood.

These numbers are examples to show the maths, not benchmarks. Published averages vary widely between studies and industries. The useful question isn't "am I above average?" but "is this page improving, and is each conversion worth more than it costs?"

What about bounce rate?

On a landing page, a high bounce rate isn't automatically bad. A visitor who reads, calls the phone number and leaves may count as a bounce. Track the actual action (calls, forms, bookings) instead of judging by bounce alone.

Tracking and A/B testing landing pages

If you can't see what's happening, every change is a guess.

What's worth testing

• The offer (free inspection vs discount vs guarantee).
• The headline angle (problem vs outcome).
• Form vs quiz vs calculator as the first step.
• One-step vs two-step form.
• Showing a price vs "get a quote".

Button colours and tiny wording changes rarely matter on small budgets. With low traffic, make bigger, clearer improvements and compare over a few weeks.

SEO landing pages vs ad landing pages

A page built for Google search and a page built for paid ads have the same goal but very different jobs.

Building a good SEO landing page

• One main search phrase per page, used naturally in the title, headline and opening.
• Answer the question fast, then go deeper.
• Local details for local services: area served, real photos, contact info.
• Link to it from your homepage and related pages.
• Give it a clear next step, just like an ad page.

Landing page examples, mistakes, tools and hiring a designer

To wrap up: examples by industry, the mistakes I see most, the tools, and how to choose who builds yours.

Landing page examples by industry

The 10 landing page mistakes I see most

1. Sending ads to the homepage.
2. Headline doesn't match the ad.
3. Several competing goals on one page.
4. Vague offer.
5. Form too long, button says "Submit".
6. No proof, or obviously fake proof.
7. Slow on phones.
8. Main action hidden below the fold on mobile.
9. No thank-you page or follow-up.
10. No tracking, so nobody knows what works.

Tools

Landing pages can be built in dedicated builders (Unbounce, Leadpages, Instapage), funnel platforms (ClickFunnels, GoHighLevel), website builders (Webflow, WordPress, HubSpot), or custom-built. I custom-build mine, which is how I add calculators, quizzes and estimators while keeping pages fast. The tool matters less than the offer, the message and the follow-up.

How to choose a landing page designer

• Ask to click through live pages they've built, on your phone.
• Ask how they'll measure success and what they'll track.
• Check they write or seriously edit the copy.
• Ask about your traffic source and offer before they talk about design.
• Make sure you own the page, domain and data.

My landing page launch checklist

• One audience, one offer, one action
• Headline matches the ad or link that sends traffic
• Headline, subhead and button visible on a phone without scrolling
• Main navigation removed or minimal on ad pages
• Offer is specific and easy to repeat
• Form asks only what's needed; button says the result
• Only real reviews, ratings and logos
• Proof placed near the form
• FAQ answers the top objections
• Loads fast on mobile data
• Labels, contrast and tap targets are accessible
• Thank-you page explains what happens next
• Events tracked: clicks, form starts, submits, calls
• UTM tags on every incoming link
• Tested end to end on a real phone

Landing page terms in plain English

A/B test

Comparing two versions of a page to see which converts better.

Above the fold

What shows on screen before scrolling.

Accent colour

The one colour reserved for buttons and actions.

Bounce rate

Share of visits that leave without another tracked action.

Call to action (CTA)

The button or line telling visitors what to do.

Click-through page

A page that warms visitors up and sends them to checkout or sign-up.

Cold traffic

Visitors who don't know you yet.

Conversion

When a visitor completes the page's goal.

Conversion goal

The single action the page is built for.

Conversion rate

Conversions divided by visitors, as a percentage.

Core Web Vitals

Google's measures of loading, responsiveness and visual stability.

Cost per conversion

Ad spend divided by conversions.

CRO

Conversion rate optimisation: improving the share of visitors who convert.

Estimator

A tool giving visitors a rough price or outcome before contacting you.

FAQ section

Answers to common questions, usually near the end.

Form field

One input in a form, like name or phone.

Hero section

The top area of a page: headline, subhead, action and visual.

Hot traffic

Visitors actively searching or already familiar with you.

Indexing

Google storing a page so it can appear in results.

Landing page

A single page built for one specific goal.

Lazy loading

Loading images only when they're about to appear on screen.

Lead

Someone who shares contact details or shows buying interest.

Lead generation page

A landing page with a form to collect leads.

Lead magnet

A free, useful item offered in exchange for contact details.

Message match

Keeping the page's promise and wording consistent with the ad.

Mobile first

Designing the phone version before the desktop version.

Multi-step form

A form split into short steps.

Noindex

A tag asking search engines not to list a page.

Offer

What the visitor gets for taking action.

Pixel

Code that reports visitor actions to an ad platform.

Risk reversal

Guarantees or terms that lower the buyer's risk.

Sales page

A long landing page that sells a product directly.

SEO landing page

A page built to rank in search for a specific query.

Social proof

Evidence that others trust you: reviews, ratings, logos.

Squeeze page

A very short page focused on capturing an email.

Sticky CTA

A button that stays visible while scrolling.

Subheadline

The line under the headline that adds detail.

Thank-you page

The page shown after a conversion, explaining next steps.

Trust strip

A row of real credentials or ratings near the top.

UTM

Tags added to a link to record where a visitor came from.

Visual hierarchy

Design that shows what matters most first.

Wireframe

A simple box sketch of a page's layout.

Frequently asked questions