How To Create A High Performing Landing Page Design

Are you struggling with a conversion rate of less than 6% with your landing page design? Are over 30% of your visitors bouncing and are your engagement metrics poor? Well, if that is the case there is a strong likelihood that your page is suffering from one or more of the 8 deadly sins of landing page design.

A landing page of course is any page where a visitor first lands on a site and so for many visitors this is the homepage. Landing pages can have a massive impact on your conversion rate because they are near the beginning of the funnel. If you want to make an impact on your conversion rate it is better to start here than almost anywhere else because you will have the largest number of visitors to influence.

What is a high landing page conversion rate?

A benchmarking study by Unbounce of landing page conversion rates shows how conversion rates vary significantly according to the industry sector. But there are also huge differences within each sector when we break down landing page conversion rates into quartiles.

Source: 2021 Conversion Benchmark Report, Unbounce

Real estate suffers with one of the lowest average landing page conversion rates (7.4%). Whilst catering and restaurants have the highest (18.2%). However, what is most shocking is the massive difference between the average and the median conversion rate for landing pages. The lowest median conversion rate is just 2.4% compared to the highest of 18.2%.

Think about that for a second. That’s a difference of over 7 times for the highest average converting landing page. That could be the difference between success and failure of a business. This study just confirms how important landing page design is. It can make such a huge difference to your conversion rate and your bottom line. So, what causes some landing page designs to perform so poorly?

The 8 deadly sins of landing page design:

Tim Ash, CEO of Sitetuners, outlines seven deadly sins of landing page design in his awesome book Landing Page Optimization. I couldn’t beat this superb list and so I’ve outlined below how each of these deadly sins can be resolved and added an eighth sin of my own.

1. Unclear call-to-actions!

Unclear or ambiguous calls-to-actions create confusion and frustration among users. It should be clear where to click with little need for any consideration. The aim of the page should be clear from a prominent headline at the top of the page. The CTA should be clearly visible in a well-defined block that is visually prominent. The remainder of the page should be plain and visually un-cluttered.

A clear CTA should describe what occurs next and what the user can expect when they arrive on the next page. The text on the CTA should complete the sentence “I want to..” and so you should avoid generic copy such as “Submit” or “Continue”. Never use a hyperlink for a primary CTA as links are less visible and users expect the main CTA to be a button.

2. Give visitors too much choice!

Hick’s Law indicates that the more choices you offer a user, the longer it will take them to come to a decision. This also means that your conversion rate is likely to decline as you increase the number of call-to-actions you display. The aim should be to assist customers in deciding what best meets their needs by directing visitors towards a relevant CTA or desired content.

To assist in this process ensure you avoid clutter on the page, keep detail to a minimum, group related choices into a smaller number of categories and use visual cues to minimise the need to read copy.

This homepage from Comms-Express lacks a clear CTA and offers visitors far too many choices. The page displays ads, social media icons, an auto-slider with a CTA and other conflicting CTAs which distract users. The star rating also partly obscures the primary navigation and the page lacks a clear structure. It is difficult to know where to look first on the page.

Image Source: Comms-Express.com

3. Visual distractions!

Keep your landing page simple and ensure there is a clear visual separation between page content and the page shell (header, navigation and background). Complex backgrounds, animation and auto-play videos automatically draw they eye and can annoy users at a crucial point in the user journey.

Maintain the user’s focus by directing them towards the “happy path” which takes the user to the preferred conversion action.

Other visual effects to avoid include;

• Dark and dramatic colour themes of black or saturated bright colours that create a dark and mysterious atmosphere with a limited appeal.
• Garish text which employs large fonts in high contrast colours and is emphasized by the use of edging effects. Like drop shadows and fades.
• Visual embellishments & flourishes such as containers using drop shadows and other design effects. Page sides that are filled with complex patterns or images distract from the main body of the page where the call-to-action is located. These type of elements break-up eye flow and distract users.
• Banner ads or elements that look like banners can take attention away from your conversion action. It gives the impression that you are more interested in advertising revenues than meeting customer needs.
• Entry pop-ups can be an unwelcome surprise. They can also prevent users from viewing the content that they are looking for.

In this A/B test on Cheeky Bingo a dedicated landing page with a very prominent primary “Join For Free” CTA massively outperformed the existing home page. The homepage had been the main landing page for most new visitors, but it suffered from multiple CTAs, distracting banners and general clutter.

The landing page recorded a 133 percent uplift in clicks on the primary CTA and this resulted in a 27 percent uplift in registrations and a 9 percent uplift in first time deposits.

4. Not keeping promises!

It is essential that the landing page design matches people’s expectations and intent in relation to what they have previously read about your proposition. For example if you mention an offer in your PPC ad or in your organic search entry it is important that it is clearly and consistently displayed on the landing page. Otherwise visitors may feel anxious, confused and frustrated.

The goal gradient effect suggests that people are more motivated by how close they are to their goal rather than how much progress they have made so far. This means you should indicate how close visitors are to achieving their goal (e.g. sign up in less than 60 seconds) to boost their motivation.

5. Visitors don’t read, they scan web pages.

People scan websites and rapidly get lost if there is no clear visual hierarchy or organisational flow to guide them. It is difficult to scan large blocks of text and so dense SEO type copy can harm your landing page design and lead to a low conversion rate.

To assist visitors with scanning your page ensure your landing page design:

• Uses short bullet points rather than sentences.
• Has clear page headings and sub-headings.
• Uses the inverted pyramid style, with the most important copy first & last.
• Be ruthless with editing to keep content to a minimum.
• Place supporting text such as offer terms and conditions on a supporting page or information popovers.

The Spotify homepage below uses bullet points to clearly communicate the benefits of signing up to the music download service. It uses loss aversion to highlight the features customers lose if they don’t sign up for Premium. The design also explodes the myth that a landing page has to be short. For many users subscribing to the service is a major commitment. It is important to allow visitors to explore the nature of the free and subscription services. The design also ensures there is only a single prominent CTA on any individual screen to assist conversion.

Image Source: Spotify.com

This long-form page also sets expectations about Spotify’s free service. Users are less likely to be disappointed if they sign up for the limited free service. This encourages users to consider the benefits of the subscription service rather than getting users to automatically signing up for the free service.

6. Asking for too much information

Social norms apply just as much to online interactions as they do to offline conversations. It is important that we respect a user’s privacy. To benefit from reciprocity we offer as much as we can and ask for as little as possible in return.

When we do request information on a landing page ensure you follow these guidelines (also see post on form design best practice guidelines):

• Have a clear headline that explains the benefit to the user.
• Use concise descriptive labels and tool tips if necessary.
• Organise input fields into logical labelled subgroups.
• Only ask for information that is absolutely necessary to take the visitor to the next step of the user journey.
• Remove all optional fields and collect additional data later on in the process.
• Eliminate repeated data entry by automatically refreshing your CRM or personalisation engine with data from your forms.

When a visitor is on a mobile phone there is even greater pressure to keep information requests to a minimum. Here Skyscanner, the flight ticket comparison site, manages to keep all the input fields and the CTA visible on the screen without the user having to scroll.

Image Source: Skyscanner.net

Skyscanner runs thousands of A/B tests a year and so it is interesting how the page flow focuses on popular destinations immediately below the form (social influence). However, further down the page we see short paragraphs on the benefits of the service and evidence about its reputation. The landing page design combines a long-form design with effective use of white space and simple illustrations to avoid information overload.

7. Lack of trust and credibility:

For people to be comfortable with any transaction it is necessary for both parties to establish a level of trust that allows them to interact without the suspicion that the other’s actions are solely selfish or might be to the disadvantage of one party. We have to extend some trust to completely unknown people to enable small and large transactions to take place.

First impressions count as research indicates that visitors form an impression of a website within 50 milliseconds. This means that a landing page must look professionally designed and clearly communicate key messages to establish trust within a few seconds.

Follow these key rules for your landing page design:

• Be ruthless with clutter to keep content to a minimum in your landing page design.
• Have a clear organisational structure to your page to minimise cognitive load.
• Display risk reducers (e.g. free postage, easy or free returns and money back guarantee) to lower visitor anxiety.
• For visitors who may not have heard of your brand use third party validation (e.g. by displaying partner logos or reviews) as this transfers some of the goodwill from other people or organisations to yours.
• Third party validation communicates that knowledgeable experts or reviewers consider you have a quality product or service. It provides a short-cut to decision-making.

Themathsfactor.com landing page design uses a combination of a celebrity endorsement and strong customer testimonials to establish trust and credibility. The design also caters for visitors at different stages of the buying process by offering multiple CTA. However, it ensures the primary CTA – ‘Get started today’ is the most prominent.

Image Source: Themathsfactor.com

8. Not understanding your markets decision style:

Before you begin thinking about constructing your landing page design it is important to consider the predominant choice style in your market. What is a decision style you say? Well, decision styles is about extensive analysis and research (Bentley, Earls & O’Brien – 2011) to understand the relationships, similarities and differences between different behavioural styles of decision making.

The patterns in the data suggest that in many markets buyer behaviour is strongly influenced by what other people are doing or what we think they are doing. This is characterised by people following experts or trends (e.g. what’s most popular). At the other end of the spectrum there are occasions when we use a more considered rational style of decision making. These two different styles of decision making form the horizontal axis.

Image Source: Copy,Copy,Copy – Mark Earls

The horizontal axis reflects the number of similar options we have to choose from. At the top of the axis people are faced with relatively few similar options and so they can make a judgement call if they possess the knowledge to do so.

But at the other end of the spectrum people are faced with so many choices that it is practically impossible to identify an ideal product or service to meet their needs. Here people have to make an uninformed choice based on either guesswork or popularity (i.e. social proof).

How do you identify which quadrant your market falls into?

You need to study the characteristic of your sector. For instance, if your market follows the 80:20 rule (i.e. long-tail distribution), where a few large brands account for the lion’s share of the sales, this tends reflect strong social influence. When people are more rational and evaluate brands independently you would expect to see many more brands of a similar size.

Image Source: Copy,Copy,Copy – Mark Earls

Once you have identified the quadrant where your market is predominately positioned you can create strategies that are most likely to be effective with your audience.

North West:

If your customers are in the North-West quadrant you need to communicate about real or perceived superiority of your product or service. Dyson’s household appliances and Audi cars are examples of this strategy.

South West:

The South-West quadrant is more about making your product stand out from the crowd as there are so many similar competitors. This could for example involve using celebrity endorsements or loyalty schemes. Insurance and insurance comparison sites fit into this quadrant as most people don’t have the time or knowledge to understand the differences between the many different features and choices available.

Our choices in this quadrant are largely guesswork. As a result cognitive biases and short-cuts such as confirmation bias and loss aversion can be especially influential in these markets.

North East:

If your customers are mainly in the North-East quadrant then they tend to follow the advice of experts or authorities. Endorsements or awards from recognised professional users or bodies can therefore be powerful motivators for visitors as they establish your credibility.

In the 1990’s when IBM still made PCs there was a saying that nobody got fired for buying an IBM. This reflects the importance social influence as a risk reducer and the desire in business not to be seen to make a bad decision. For this reason some SaaS solutions such as A/B testing software fall into this quadrant.

South East:

Being situated in the South-Eastern quadrant is all about popularity and so social proof is king. Strategies here include being seen as the popular choice (e.g. show how many thousands or millions of customers you have), displaying lots of ‘Likes’ and shares or showing positive media mentions from a well-known publication or website. Popular music, fashion and the latest fads (e.g. fidget spinners) fall into this quadrant. Popularity is of course fickle and so these markets are characterised by extreme volatility.

Predominant style:

These quadrants are of course generalisations, and so you might find some of the strategies from other quadrants also work in your market. Indeed, sometimes your market could fall in-between two quadrants. However, the point of the decision style map is to get you to consider the main ways people make decisions and focus on developing marketing strategies that are relevant to the majority of customers.

Conclusion:

Landing page design is crucial to your conversion rate and so make sure you design them with care. Begin with identifying the predominant decision style in your market as this will help you develop appropriate marketing strategies for your proposition.

If you can, send your new visitors to a dedicated landing page that has been designed specifically with conversion in mind. This allows you to eliminate content that is solely for existing customers that is often not at all relevant to new prospects. It also enables you to keep navigation to a minimum and reduces your number of stakeholders to just those responsible for acquisition.

• Ensure you have a clear and compelling call-to-action that stands out from the page.
• Limit the number of choices you offer visitors to make choices simple.
• Keep visual distractions to a minimum by having a minimal visual aesthetic design
• Show how close visitors are to achieving their goal and ensure you match upstream expectations.
• Use bullet points and visual cues to make your page easy to scan.
• Keep requests for information to an absolute minimum and make sure visitors feel they are getting the better deal.
• Finally, ensure your design and content instantly establishes your credibility and professionalism.

If you follow these eight rules of landing page design you will improve engagement and conversion at a crucial step in the user journey. Most brands spend significant sums on driving visitors to their site and so it is crucial that your landing page is fit for purpose and maximises conversion rates.