Landing page 101

Getting a business up and running can be (to put it lightly) a lot of work. And on top of perfecting your product or service, you have to actually get it in front of your potential customers. But how?

There are a handful of effective ways to reach your prospects, including pay-per-click advertising, social media and content marketing. But once you’ve caught their attention, where do you send them? Your website home page? A checkout page? Sure, if you want to kill your conversions.
Instead, breathe life into your marketing efforts using targeted landing pages for your campaigns.
A landing page as a dedicated web page designed with one specific objective in mind. It has no ties to your website, like global navigation. In essence, it floats alone, only accessible from the link you’re providing in your marketing campaign.
  • homepage example
  • landing page example
You’ll notice the home page has dozens of links going to other pages, and is designed to encourage exploration, whereas the landing page has only two buttons, with the same call to action.

There are two types of landing pages:
  1. Lead generation (commonly referred to as lead gen or lead capture): To capture leads that enable you to market to people in the future. As such, a lead capture page will contain a form along with a description of what the visitor will get in return for submitting their personal data.There are many incentives for a user to give up their personal information, such as an ebook or whitepaper, webinar registration, consultation for professional services, contest entry, coupon, free trial, gift or notification of a future product launch.
  2. Click through: To “warm up” potential customers to the product you are trying to sell to them before sending them further into your sales funnel.

Skeletal system (a.k.a. landing page core elements)

Building out your landing pages doesn’t have to be brain surgery. Simply start with these five must-have core elements:
  1. Your Unique Selling Proposition (USP)
  2. The hero shot (images/video showing context of use)
  3. The benefits of your offering
  4. Social proof (I’ll have what she’s having)
  5. A single conversion goal – your call-to-action (CTA) (with or without a form)
landing page wireframe

1. Your unique selling proposition (USP)

Your USP is what differentiates you from your competitors and describes what makes your product or service beneficial and memorable to customers. A classic example comes from Domino’s Pizza: “You get fresh, hot pizza delivered to your door in 30 minutes or less — or it’s free.”

The USP can be broken down into 4 landing page elements:
a. The main headline
Your headline is the very first thing that people will see and read. It’s critical that it very clearly describes what a visitor will get from the page (its goal) and that the message match is strong enough to show the visitor that they are in the right place.
b. The supporting headline
Keep your headline short and sweet by adding a supporting headline. This can be used in two different ways:
1. As a direct extension of the headline, in such a way that it’s like finishing a sentence.
2. To extend the message by applying an additional persuasive message to support the primary one.

c. The reinforcement statement
There is another page title that you can use to drive home the purpose of your page: the reinforcement statement. It sits about halfway down your page, and serves to add a mid-experience message that you want to communicate to your visitors.
Here is an example:
[Main headline]: The Easiest Way to Build, Publish and Test Landing Pages Without IT
[Reinforcement statement]: Create beautiful landing pages in minutes with no HTML
d. The closing argument
As your landing page comes to a close, you have one final chance to communicate the benefit of your offering. Similar to the reinforcement statement, it backs up your main value proposition. For a click-through page, it should be coupled with a repeat of your call-to-action.
Note: For a very short page, this isn’t always a requirement as your headline will still be visible.
the hero shot aim for the moon

2. The hero shot

The hero shot is the visual representation of your offer and can help people to gain a better understanding of what the product looks like or what they gain.

There are many ways in which to achieve this, including:
  • Photo(s) or Illustrations: Consider an example of a collapsible step ladder. A standard white-background photo of the item would work for the hero shot, but to add extra effect you could provide supplementary photos of someone unfolding it, using it to reach somewhere high, and placing it neatly into a small cupboard afterward.
  • Video: Video is an even more compelling way to showcase your product. Think of the common Shamwow and Slapchop infomercials. While cheesy, they impart a sense of need by illustrating direct benefits to everyday life.

3. Benefits

Following the USP is a more detailed description of your offer’s benefits and features, providing a little more detail to the offer to answer any questions customers may have. Try to focus on answering the question “What will this do for me?”, as this will help you to write copy that speaks directly to your customers questions.

a. Benefit summary bullet points
Don’t get into so much detail that your landing page feels like it’s full of text. Write a brief one paragraph summary and 3-5 bullet points for clarity. Come back to this section many times and edit the copy to remove any bloated or unnecessary verbiage.

An example, for a phone, might be:
[Bad (feature based)]: Our new battery is twice as powerful as the competition’s.
[Better (benefit based)]: Only charge your phone every three days.
b. Detailed benefit and feature descriptions
Extend the bullet point descriptions into more detailed overviews. A good way to approach this is to expand upon the benefits first, and then if needed, add some feature details below.
Only after all of the benefits are clearly laid out do you start to describe features – which are provided for those who require more detail in order to make a decision.

4. Social proof

Social proof is a powerful persuasive concept. Simply put, it’s the use of social signals to illustrate that other people have bought/consumed/read/participated in, what you are offering—the concept being that you are more likely to convert if you see that others before you have, and were glad they did.

Examples of social proof are:
  • Customer testimonials
  • Social signals – how well received is your offering on public networks?
  • A count of how many customers you have
  • Trust seals to establish security of information
  • Awards from reputable organizations
  • Customer reviews – which are very powerful when prospects are comparison shopping

5. Call-to-action (CTA)

Your conversion goal is a term that describes what the purpose of the page is to you. It’s purely a label intended to keep you focused on this page element when designing your page.

To a visitor, this is presented in the form of a call-to-action (CTA), which can either be a standalone button on a click-through page, or as part of a lead gen form.
Your CTA is critical to conversions as it’s the target of your pages’ conversion goal–in other words, it’s what you want people to interact with on your landing page. How you design it, where you place it and what it says are all important considerations.
It’s common—especially in the B2B marketplace—for the main purpose of your landing page to be lead generation. Usually this will involve asking the visitor for their name and email in exchange for a piece of content, such as an ebook. If you are requesting data from your customers, keep the form as short as possible and include a privacy statement near the button or email address field.
Poorly written CTAs are the standard CLICK HERE or SUBMIT. A good example would be “Get your $50 spa coupon,” which clearly articulates what you will be receiving in exchange for your precious click.
Want more on crafting CTA buttons that convert? Check out Michael Aagaard’s post on nothing but the button.
match ads to landing page for best practice

The connective tissues (a.k.a. message match)

Few things can dissuade your prospective customers from converting quite like clicking on an ad for one thing, only to be presented with a completely different product or offer.

This is where message match comes in. It’s the measure of how well your landing page matches the look and feel of the ad or link that brought the visitor there. For PPC marketers, this means matching your ad copy to your landing page headline. Strong message match increases conversions because it reassures people they’ve come to the right place.
It’s imperative that not only your copy matches throughout your campaign, but also your design elements and images. Take the example below. You’ll notice the copy and design are reflected in both the ad and the landing page—Message Match achieved!

The scientific method

Now that you landing page is built, you can sit back and watch the conversions come in, right? Well, not exactly. Now it’s time to start testing.

A/B Testing

A/B testing is the act of running a simultaneous experiment between two or more pages to see which performs or converts the best. Despite the name (A/B testing), the experiment can be conducted with as many pages as desired.
  • creating and testing messaging variants

What should I test on my landing pages?

A/B testing is both an art and a science. It’s also very unpredictable. Most marketing departments, usability specialists, designers and management rely on a mixture of experience, gut instinct and personal opinion when it comes to deciding what will work better for their customers. Be prepared to throw all the boardroom conjecture out the window and start achieving real insight into what works and what doesnʼt—testing, like a camera, never lies.

At the end of the day, it’s your customers and your brand (your brand is what your customers think you are, rather than what you say you are) that will decide what converts the best. With that being said, there are a certain number of landing page elements that you can attack in your testing. The different variations and content that goes into the test is up to you, which one works the best (whether you like it or not) is up to the customers.
Some of the elements you should consider testing are:
  • The main headline. Which contains a succinct rendering of your product/offer/service core value proposition.
  • The call-to-action (CTA). Typically the text on the button that represents your page’s conversion goal.
  • Hero shot. Try a variation of your main photo (if you have one) — preferably showing your product or service being used in context.
  • Button design. Use design principles to accentuate the appearance of your CTA (contrast, whitespace, size). Above all, try making it bigger.
  • Button color. Green for go, blue for link color, orange or red for emotional reaction.
  • Form length. For lead capture and other form usage, you will want to minimize the amount of fields that visitors are required to complete. However, if you have a particularly strong need for data, try running an A|B|C|D|E test with varying amounts of information gathering. This way you can make an informed decision about what abandonment rate is acceptable when weighed against the extra data produced.
  • Long copy vs. short copy. Often shorter is better, but for certain products detail is important in the decision making process.
Still not sure what to test? Check out this detailed guide on pinpointing what to test and why. 

The five-second test

A great way to identify whether your USP is clear enough is to do the 5-second test.

This is where you present test subjects (aka. people) with your landing page for five seconds, then hide it from their view.
At this point you ask the test subjects to explain what the page is about. Refine your USP until people are consistently getting it right.
Alternatively, you can do this online with UsabilityHub’s five-second test tool.

Advanced anatomy

Guess what? You passed! Now you simply need to put all these principles into action by building your very first landing page. And if you’re itching for more landing page anatomy goodness, check out Unbounce’s Resources, featuring totally free ebooks, courses, videos and more!
Unbounce logo
This article provided by Unbounce. Unbounce helps businesses create better marketing experiences by improving what is already the world's fastest and most customizable landing page builder.
Design tips & business trends in your inbox?
Like what you've read? Sign up for our newsletter! 
We'll also send you the occasional marketing email and promotion (which you can opt-out of anytime).
You're in!
You proved us right again. Our newsletter is only for the coolest kids. And you’re one of ‘em. Get ready for amazing stuff in your inbox.