What makes a great startup landing page?

Why did every landing page seem to have the same structural elements?

To begin answering this question, I studied up on all 57 company sites and took a design inventory of each. Here are my most noteworthy observations and theories.

For the most part, the landing pages shared the same common elements.

A sketch of a typical landing page
Sketch of a typical landing page

It starts with a Hero section.

I imagine this section is the best opportunity to catch someone’s attention and stay on the page. Everything here needs to be clear, compelling, and engaging because it’s the first thing that someone sees when they open your website.

  1. Clear, concise, and useful copy
  2. Engaging visuals
  3. Call-to-action
Instawork (Series C)
Figma (Series D)
  • Sign-up: Sign up, Get started, Get started free, Start free, Start free trial
  • Demo-related: Sign up for a demo, Watch demo, Get a demo, Try X for free, Schedule a demo, Watch video, Request a demo
  • Other: Join the waitlist, Get early access, Contact us, Learn more, Download
Coda (Series C)

Then segues into the persuasive body.

Sandwiched between the hero section and ending call-to-action is the body. In this section, I noticed each company employs different techniques to eliminate doubt, establish trust, and build initial rapport with prospective users.

1. How it works

Usually in three steps. The main question you’re trying to answer for the user here is how does it work?

Nova Credit (Series B)

2. Features and (most importantly) benefits

What are the key features? What do they do for your target market, and why should they care? Tell it to the world.

Instabase (Series B)

3. Testimonials, Companies and Partners, Data

Principles of persuasion come into play here — so do ethos, logos, and pathos.

  1. Images of friendly, likable people establish liking (Ethos)
  2. Quotes show proof that the product is effective and life-changing (Pathos)
  3. Background info strengthens liking if you share similar backgrounds or roles (Ethos)
Sym (Series A)
Retool (Series B)
Stripe (Series F)

Other notable mentions (not the companies, but the components)

These components aren’t always included, but I figured I’d mention them here in case they may be relevant to some companies and products.

Applied Intuition (Series C)
Vanta (Series B)
Scio (Series B)

And ends with a call-to-action.

You made it to the end of the page, but now what?

  • Sign-up: Sign up, Get started, Get started free, Start free, Start free trial
  • Demo-related: Sign up for a demo, Watch demo, Get a demo, Try X for free, Schedule a demo, Watch video, Request a demo
  • Other: Join the waitlist, Get early access, Contact us, Learn more, Download
Nextdoor (Series F)

This landing page “phenomenon” can be explained by the AIDA Model.

AIDA is a concept used in marketing and advertising that describes the cognitive stages a consumer goes through before making a purchasing decision.

AIDA Model

Now, let’s talk about cheesecake.

To illustrate the theory behind the landing page here’s the AIDA model applied to cheesecake.

1. Attention: What is it?
2. Interest: I like it.
3. Desire: I want it
4. Action: I’m getting it.
  • Buy a whole cheesecake
  • Say something about it
  • Find the recipe and make it yourself
  • Give your compliments to the chef
Summary of the AIDA model, Cheesecake edition

Thank you for the read!

To learn is to do. If you’d like to assemble a landing page yourself, check out this neat Figma Landing page UI Kit.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store