Avatar
Paul Boag
UX and CRO specialist and expert (@boagworld)
. No Comments

How To Create a Landing Page

Typically a landing page is a standalone webpage explicitly created for a marketing campaign or to target specific search terms. It is where users “land” when they click a link in an ad, email or search results.

The idea of a landing page is that it encourages users to complete a specific call to action such as getting in touch, making a purchase or subscribing to a newsletter.

What makes landing pages more effective compared to your homepage or another page on your website is that they are extremely focused. They are focused on engaging a specific audience and asking that audience to complete a particular action. That often leads to landing pages having a high conversion rate compared to other pages on your site.

In this post, we explore what it takes to create a compelling landing page. That journey begins by carefully planning your approach.

Table of contents:

  1. Planning your approach
  2. Making a wireframe of your landing page
  3. Putting together “content blocks”
  4. Designing your landing page
  5. Run A/B tests and keep improving

Ready to design your first landing page? Let’s get started…

Step #1 Plan Your Approach

When it comes to planning your landing page, there are two questions you need to begin asking yourself; who is your audience, and what do you want them to do?

Identify Your Audience

The best place to start planning your landing page is to consider who your audience is and what they want carefully.

A good starting point is to look at where those users are coming from. For example, if they are coming from pay-per-click ads, what people did you target or what search terms did you ad appear alongside? If people were responding to an email, who did you send that email to and what was it about? If they came from another website, what was the topic of the site and what kind of people visited it?

All of these questions allow you to make an educated guess about the kind of people coming to your landing page. From there, you need to ask yourself some critical questions:

  1. What problem are your users hoping you will be able to help them with? If we can clearly articulate that our product or service can help them with that need, they will be much more likely to act.
  2. What underlying goal are they trying to achieve? For example, somebody interested in a fitness app, might want to lose weight, but why? Is it to be healthier, more attractive or something else? Once again if we understand their goal, we can demonstrate that your product or service can help achieve it.
  3. What objections or concerns might people have when considering acting on your landing page? If we know why people are put off of acting, we can either remove those barriers or mitigate them. For example, if somebody is worried about the cost of delivery, you could offer free delivery or make that cost visible upfront, so they know where they stand.

Of course, to know what somebody’s objections might be to taking action on your landing page, we need to be clear about what exactly you want people to do.

Define Your Objectives

Before you can build a useful landing page, you need to be clear about precisely what you want people to do. If your landing page lacks focus, people will be less likely to act, and you will be less confident about how well it is performing.

The first question you need to ask yourself to gain this focus is “what does success look like?” Are you looking for people to make a purchase, contact you, sign up for a mailing list or something else?

Also, be as specific as possible. For example, if you want people to contact you, is quantity the only important factor to you or does quality matter too? Probably the last thing you want is to have to chase lots of low-quality leads.

Once you are clear about your objective, you then have to ask yourself how you intend to measure success and by extension what kind of call to action you need.

For example, if the idea is to generate leads, do you want to ask people to call you, email you or complete a form. A form allows you to collect more information on people to establish the quality of the lead, but users prefer the simplicity of email or the phone.

After you have defined your calls to action and got a clear picture of your audience, you can start to consider the copy on your landing page.

Step #2. Make a Wireframe of Your Landing Page

One of the biggest mistakes people make when creating a landing page is to spend too much time on the design and not enough on the copy. The design does matter, but the content is what will convince people to act. It cannot be an afterthought. Instead, get the content right first, and then consider the design.

The first step in creating compelling copy is to define what exactly it is you are offering and why people might be interested in that.

Identify Your Value Proposition

To encourage people to act, you need to convince them that they want what you have to offer. To do that you must provide certain information.

First, they want to know that the product or service you are offering is designed to solve whatever their problem is or enable them to achieve the goal they have. That means our copy needs to make it very clear what the product or service is designed to do.

For example, if you sell travel insurance, is it designed for people going on a skiing holiday or won’t it cover that? In other words, will it meet the user’s needs?

Evernote does an excellent job of explaining clearly what its product does and the benefit it provides.

Evernote
Example #1:  “Your Notes Organized. Effortless.”

Second, you need to outline the benefits of your product. We are often very good at explaining what our product or service does, but not so good at explaining how it helps.

Many computer manufacturers used to fall into this trap. They would list the features of the product, such as hard drive space, memory, graphics card, etc. However, they didn’t explain how all of these things benefited people.

Apple, on the other hand, spend a lot of time talking about how light and portable their products are or how the battery will last all day. These are the benefits people care about.

Apple. MacBook Air
Example #2: “Light. Speed.”

That said, you cannot just talk about benefits. You need to explain how you are going to provide those benefits. If you claim your product or service will increase revenue and decrease costs, you have to back that up. That is where talking about features does matter.

Write a list of all your product benefits and features to go alongside what problem they solve, and you will have a good starting point for your content. The next step will be to plan the flow of your content.

Plan the Flow of Your Content

At this stage, you should have an idea of:

  • What value your product or service provides to users in terms of helping them overcome a problem or achieve a goal.
  • What specific benefits your product or service can provide.
  • What the features are that help deliver those benefits.
  • What concerns or questions users might have about your product or service, and in particular, around the action, they are being asked to take.

Now it is time to think about the order you present all of that information.

That is where thinking about what your page will look like on a mobile device might help. Typically, on a mobile device, a landing page is a single column where users start at the top and scroll to the bottom. Let’s take a moment to consider the order of content in a situation like that.

The order of your content should be defined by the questions a user has when viewing your landing page. Although not consciously, people tend to have the same kind of questions about every web page they visit in approximately the same order. These are:

  • What is this page about?
  • How will that help me? (Benefits)
  • How does the offering work? (Features)
  • Why should I trust this page?
  • What should I do next? (Call to Action)

Our content should, therefore, follow this rough order.

We should start with a simple statement about what your offering is. That should clearly articulate what your product or service does and give an overview of its benefit.

From there, you can break down the benefits a bit further if needed before moving onto features and how you are going to deliver on your promises.

If you are offering a service, that list of features will be the deliverables you provide. However, the principle is the same. The user needs to know how you intend to achieve the benefits you promise.

Hopefully outlining how you intend to provide the benefits you offer will convince users of your ability to deliver. However, in most cases, it helps to reassure the user of this fact. Users are typically cynical of the promises made on the website, so it is wise to work hard to build their trust.

One way of doing this is by using social proof. Typically these come in the form of reviews or testimonials. Where possible, try to add social proof that the user can easily see is genuine. You can do this by using independent third party sources or by linking back to the social profiles of those leaving testimonials.

Consider using an independant third party to add credibility to your reviews and testmonials.
Example #3: Testimonials and reviews

Consider using an independent third party to add credibility to your reviews and testimonials.

You can add social proof throughout the landing page. However, it is essential to also closely associate them with your call to action, as this is the moment where the user will feel the most apprehension.

Notice that we’re suggesting the call to action is the last item in our content flow. That is because when it comes to calls to action, you should pick your moment. If users have not had a chance to see what you have to offer, they are considerably less likely to respond.

That said, it does not mean your call to action should only appear at the bottom of the page. It is best practice to have the call to action repeated below each of our major sections (e.g. summary, benefits, features, social proof).

A typical landing page content flow looks something like this.
Example 4: Landing page flow

A typical landing page content flow looks something like this.

Now that you have worked out the flow of the content for your page, it is time to get writing.

Step #3. Put Together “Content Blocks”

The first thing to say about writing compelling copy for a landing page is that nobody will read it! Instead, what people do is scan the page, looking for content that grabs their eye. When they see something that gets their attention, they may pause for a few seconds to review that block of copy in more detail before moving on.

That means we need to think of our content in terms of blocks. Each block is a specific point we want to make. It might be an individual benefit or feature. It could even be a testimonial or a summary of your offering.

These content blocks consist of several elements. These are typically:

  • Headings.
  • Imagery.
  • Video.
  • Paragraphs.
  • Lists.
Pages should be made from small, easy to digest content blocks.
Example #5: Content blocks

Pages should be made from small, easy to digest content blocks.

Because users scan your landing page instead of reading it from top to bottom, imagery is often the best way to communicate. We can process images easier than text and so if you can create or find an image that conveys the message you want to say then go with that.

However, don’t add imagery just to make the page look more appealing. It ends up distracting from what you are trying to communicate. Only use imagery if it adds value to the content.

Video works well for summarising your entire offering and as a result, are often found near the top of your landing page. However, be aware a lot of people will not watch your video and so you cannot rely upon it alone to communicate what you want to say. Yes, video is very compelling, but only if people watch it.

Also, keep your videos short. Anything over about 90 seconds and people tend to give up.

There are two other ways video can prove extremely beneficial. It is excellent for showing the features of your product, and also for video testimonials. Video testimonials tend to be much more compelling than a written version.

Chimp Essentials make excellent use of video testimonials.
Consider adding video

Chimp Essentials make excellent use of video testimonials.

Although imagery and video are both powerful tools, probably the majority of your landing page will be made up of text blocks.

Each text block is typically made up of a heading and the content. The title is what users will scan as they look down the page. If that grabs their attention, they may pause to read the content of the block.

So let’s imagine we are creating a text block that is outlining a benefit of a product. The headline might read:

Boost your online sales today

That is designed to grab people’s attention by being personal (your) and urgent (today). You can then provide a little more context to that statement in the copy below:

Boost your online profits through increased sales, higher average order value and improved customer lifetime value.

Notice that the content is short and to the point. Anything more than a short paragraph and users is unlikely to read it all.

If you do have more information to communicate than a short paragraph, make sure you explain the most crucial points first in case the user gives up or try using a bullet point list instead that a user can quickly scan.

The last piece of advice we would give in regards to the copy for your landing page is to keep it simple. Keep sentences and paragraphs short, avoid jargon and keep the reading level low. A tool like the Hemingway Editor can help ensure you are heading in the right direction.

The Hemingway Editor is a free tool that makes it easy to ensure your copy is easy to digest.
The Hemingway Editor is a free tool that makes it easy to ensure your copy is easy to digest.

By keeping copy simple, you make it easier to scan, easier to understand, and as a result, people are more likely to remember what was written.

Once you have all of your content blocks created and your content flow identified, the next stage is to bring it together into a design.

Step #4. Designing Your Landing Page

If you have got the flow and content correct, the design should prove relatively easy.

We would advise not to get too hung up on design aesthetics. Colors and brand identity are essential, but they are also very subjective. What you find attractive could easily be very different from your customers. Instead, you want to focus on making your design professional, trustworthy and easy to use.

One way to achieve this quickly is to use a template solution.

Should You Use a Landing Page Template?

There are a growing number of landing page builders to help you build a compelling landing page quickly.

These tools range from simple template-driven applications like Leadpages to more powerful services like Unbounce.

Unbounce is one of many tools that allows you to quickly and easily building landing pages.
Unbounce: Landing page builder

Unbounce is one of many tools that allows you to quickly and easily build landing pages.

UPDATE: We made a step-by-step guide for creating a landing page using Unbounce

There are also specialist landing page solutions for specific use cases. For example, Mailchimp provides landing page templates optimized for encouraging people to signup to a mailing list.

These ‘off the shelf solutions’ do come with several advantages.

  • They require no coding skills for the most part. That means you can build a landing page yourself.
  • You can easily connect them to popular services like your mailing list software or eCommerce platform.
  • They are relatively inexpensive compared to building a landing page from scratch.
  • They deal with all of the complexity of hosting.
  • They allow you to get to market faster than a custom build.

That said, they are not the right solution in all situations.

If you already have an existing website, then a service like the ones outlined above are an additional monthly cost, when it might be possible simply to create a new page on your current site.

Second, although these services are customizable, there are limits. That means if you have particular design requirements, you may struggle to realize your vision.

Third, it will take time to customize your landing page to your liking. Also, unless you are an experienced designer, the result will not be as good as a professional.

Although tools like Unbounce are powerful, they will not produce results as good as a professional designer.
Unbounce backend

Although tools like Unbounce are powerful, they will not produce results as good as a professional designer.

Finally, these services may not integrate with any existing systems you have, so check carefully before choosing one.

In short, if you need a quick, inexpensive solution and have relatively simple requirements, then a service like Unbounce will probably be the best way to go. However, if you want something more bespoke and of higher quality, then, you may want to consider hiring a web designer.

In either case, you will have to make some tough decisions to ensure the design is as usable as possible.

How to Ensure Your Design is Simple

One of the biggest design mistakes people make when setting up their landing pages is making them overly complicated.

We have a lot we want to say, and we want the page to be visually appealing. On top of that, in our attempt to convince people, we often repeat ourselves in slightly different ways, further complicating things.

The result is a landing page that is so overwhelming that people give up and leave.

To address this problem, we recommend reviewing your landing page after the initial design to ensure it is as clean and straightforward as possible.

You can do that by looking at every screen element from images and video, to buttons and text. For each, ask yourself three questions in order.

You need to implement a rigorous process for reducing clutter.
Reducing clutter

First, ask yourself if that element could be removed. If you did remove it, what would be the negative impact be? Would it reduce the chance of the user acting and if so would the impact be significant?

If the element is just a ‘nice to have’ and could probably be safely removed, then do so. Every item on the page that isn’t encouraging the user to act is just a distraction.

Yes, a royal endorsement does add credibility to Waitrose, but it also distracts from the site navigation and clutters the interface. It could be removed.

Yes, a royal endorsement does add credibility to Waitrose, but it also distracts from the site navigation and clutters the interface. It could be removed.

Next, if you cannot remove the element, ask yourself if you could hide it in some way. Perhaps it could go under a tab or in an accordion, where it would be less distracting from more important elements.

For example, not every user is interested in reading the detailed manufacturers’ description of a product, so hiding it until somebody wants it makes a lot of sense.

Finally, if the content is too valuable to hide away, ask yourself if you could visually shrink it so that it doesn’t distract from the most critical content on the page.

For example, maybe you would like people to follow up on social media. However, you do not want that distraction from people completing your primary call to action of buying. To solve this problem, you can visually deemphasis that request to follow, ensuring it does not distract. You can do that through the choice of color, size, and position on the page.

Another good example is content that you are obliged to put on the page. For instance, you need to include information about your privacy policy. However, you don’t want that to distract and so you might make it small and add it to the footer.

By reviewing every screen element and asking these three questions, you will be able to ensure everything on your landing page is moving the user towards the goal of taking action.

With that done and the design completed, you are ready to go live. But that is not the end of the project.

Step #5. Test, Track and Improve Your Landing Page

Even if you use a professional copywriter and designer to create your landing page, they will not get it perfect on their first attempt. Any landing page can always be improved.

To make sure your landing page is as useful as it can be, you need to be carrying out an ongoing process of identifying shortcomings, coming up with fixes and testing those fixes.

Finding Problems With Your Landing Page

A good starting point is to install a tool like Hotjar or Fullstory on your website. These are session recording tools. In other words, they create videos of people looking at the landing page that you can watch back.

Fullstory allows you to watch how users interact with your website.

Fullstory allows you to watch how users interact with your website.

In many cases, you will be able to observe a user struggling to do something, such as complete a form. In other cases, you will see them skip over a crucial piece of information or fail to scroll far enough down the page.

In most cases, this will give you a pretty good idea of what the problem might be. However, if you are still struggling, you can resort to simply asking people.

Run a One Question Survey

Often the most straightforward approach to understanding why users are not converting is to ask them. A one-question survey shown to users just as they go to leave a page (known as an exit-intent survey) can be a useful way of getting to the root of the problem.

I typically ask a question such as:

If you decide not to buy today, it would be useful to know why.

And then offer them a multiple-choice list of possible answers as well as a field to enter a reason not listed.

If you are unsure why people are not acting, consider asking them using a one question survey.

If you are unsure why people are not acting, consider asking them to use a one question survey.

Together a survey and session recordings should give you a good sense of what the problem is. The next challenge is coming up with a fix.

Trial Potential Solutions

Coming up with ideas of potential ways of improving conversion once you know the problem is not hard. What is harder is being sure that you have come up with the best fix possible. For that, we have two possible approaches; usability or A/B testing. Which method you adopt depends on the complexity of the improvements.

If you can quickly and easily make the changes (such as changing copy or styling a button differently), then the best approach is to test this with A/B testing.

A/B testing allows you to compare multiple approaches and ensure you pick the best possible solution while avoiding making things worse.

In case you are not familiar with how A/B testing works, you show a percentage of users an alternative version of a page with whatever changes to copy, imagery or styling you have made.

A/B testing shows different users different versions of a page.
A/B testing shows different users different versions of a page

You can compare as many different versions of the page as you want by directing different users to different versions and see which converts the best.

A/B testing can be set up and run using a free tool like Google Optimise, and you can see results in realtime, although to declare a reliable winner will take longer.

Where A/B testing cannot help is when you need to make more substantial changes to a page, like significant layout alterations or modifications to functionality.

In such cases, it would be cost-prohibitive to build multiple versions and test them on the live site.

Instead, in such situations, it is better to prototype the changes and run a usability test.

By carrying out these tests, you will be much more confident that the solution you have developed is correct and will avoid wasting money building something that might ultimately not work.

Once you are confident, you can go ahead and roll out the new update to the landing page. However, once again, that doesn’t mean you have finished.

Repeat the Cycle

The process of optimizing a landing page for the improved conversion is ongoing. Once you make one update, it is time to move on to the next by repeating the above process.

You return to your session recording and survey result seeking out other problems that you could address and go from there.

In this way, you can ensure you have a robust working methodology to improve the effectiveness of your landing page over time.