Pull to refresh

Designing Converting Landing Pages

Reading time6 min
Views3.8K

It feels like everything about LPs has already been said, however, I still keep seeing the same mistakes being made over and over again both by start-ups and established companies. Here are some tips, backed up by my 10-year experience as a UX/UI Director in agencies and product-led companies. These alone will give a nice increase in your conversion rate, I guarantee. 

Use a descriptive, not a salesy hero header 

Answer the questions “What?” and “For whom?” as early on the page as possible. A very common pattern is the largest copy being an inspirational abstract slogan and below it in smaller font the actual statement about what the product is and what it does. 

Dance — the e-bike subscription service gives us an example. Writing “Flexible e-bike subscription” instead of “Your future is electric” would not make the design look less polished, but would give a lot better communication. Currently, it’s easy to miss the caption and get confused if Dance is a subscription service or actually sells bikes. 

Per my experience replacing the abstract title with a specific one has always given an increase in conversion. There are two approaches here: 

  • Tell what the product is: “Car sharing UK: flexible short-term car hire” (Ubeeqo)

  • Formulate from the customer’s goal perspective: “Instantly book cars near you" (Zipcar)

Place key benefits above the fold

State that your product fixes the biggest concerns of your customer right at the first screen. Starling bank gives a great example: digital banks still struggle with trust issues compared with the traditional ones. Starling anticipates customer tension and releases it right away, saying that they are fully regulated and are always in touch for help. Besides, two things that people hate about traditional banks are the time-consuming opening and management of accounts and the outdated non-intuitive Internet banking. Starling addresses that as well, stating that the registration will take a few minutes and showing their app’s nice UI. 

Buzzbike is another great example of benefits above the fold.

More visuals, less text

Always remember about the goal you set for a landing page when you begin. I bet it’s not to scare your potential customer off with long reads. People do not read when they surf the pages, they scan for relevant information. No designer would replace the app screenshots in the Starling example above with a copy of  “Great mobile application”, it’s pretty obvious that the app must be shown. It gets trickier in a more complex context. 

Let’s take Deliveroo or Flink food & groceries fast delivery services as examples. Even though they both do a great job on their LPs, I believe their imagery could be better. Both show generic images of food in their hero, that could be on an LP of any grocery store. Since I am unfamiliar with the service, I have to read the description to discover its essence. Is it an offline store or a delivery service, is it instant or next-day, does it have an app or is it web-only? Why not show a courier with a branded backpack instead? That is the exact way I learn about delivery apps when I travel — spot couriers in the streets and note the logos on their backpacks. Just one image would tell us that it’s an instant delivery service, no words needed. And we can use the now free space specifying particular benefits & details.

Talk about your customer, not your product

You already have your solid Unique Selling Points (USPs). On the landing page, formulate them from the angle of your target audience. State which pains your product cures and what problems it solves. A potential customer comes to a landing page to find a way of reaching their goal. Make them see how your product can help them do it and be specific with words. 

Beautiful words are an old cliche for the marketing and sales industry. Your customers see them every day and tend to skip them unless they find what they are looking for. Leave out the decorations and get straight to the point at the very beginning of your landing page.

Don’t

A game-changing website constructor

Do

Create animated website videos without coding  in two days

The right example will convert better, since it has a specific time estimate (short for the case), approaches a user’s goal (creating a portfolio), and releases the user's pain (no code required). 

Stick to the “1 block = 1 idea” formula

It’s easy to get carried away by creativity, so try to stay consistent. Every block should contain 1 Unique Selling Point (USP). Don’t try to fit all points in one, otherwise, the visitor might get overwhelmed and not get your point at all.

Use emotional language

Express empathy towards your customers. Make them believe that you know what it feels like to be in their shoes. This will be the first step to building brand loyalty.

Don’t

We create high-quality products for dogs with allergies.

Do

We know it’s hard to choose a food brand when your doggo is allergic. Don’t worry, our vet line is created for the pickiest good boys and girls.

Revolut gives us a nice example as well: “No more unwanted subscriptions” is a more energetic wording, which clearly addresses the pain, than, for example “Manage your subscriptions easily”.

Stay away from internal terminology

Internal slang, even a marketing-approved one, requires a broad awareness. If your business is new or local, try to keep it simple for potential customers. The job-to-be-done has higher importance than a creative name of a regular feature.

Don’t

Our Scooter Professor will give you the best service possible.

Do

A professional mechanic will come to your house and fix your scooter within 2 days.

Provide realistic social proof

The social proof block is common for landing pages, but not every example is a good one. Your customers will sense the fakeness right away if they cannot check the authenticity of feedback. If you are not able to provide any social proof yet, it’s better not to have this section at all. 

Integrate your page with real Trustpilot or Google feedback so the visitors could see that it’s a real one. Another way to justify a social proof is to link to the social media profile of a person giving feedback. Place this block high on the page. 

Dash provides a great example, by placing an interactive Trustpilot widget right above the fold as well as the extended widget with reviews lower on the page.

Keep one clear call to action

A common mistake is to have several goals for one landing page. Stick with the main goal of your LP and try not to overwhelm your audience with additional CTAs. For example, if your goal is to make the audience fill out the contact form, don’t distract them with blog subscription buttons or PDF-download proposals.

Another important CTA-related rule is to come up with precise wording with a benefit inside where applicable. 

Don’t

Join

Do

Join and Get a Discount 

Use CTA’s relatively frequently on the page or make sure CTA is always on the screen, e.g. in the sticky menu bar. Use the same language on each CTA button.

Repeat it

As I said before, your key benefits should be above the fold or as high on the page as possible. But don’t hesitate to sum your benefits up at the bottom, to this point your visitor might have become more convinced and reminding them of what they get may make them convert. Very few websites use this great opportunity. Do not rely on users’ memory!

Buzzbike does a great job repeating the key benefits in the reviews block, even though most of them have already been addressed above.

Be niche-oriented

It’s not rare to have multiple user groups for one product. If it’s your case, don’t hesitate to create different landing pages. This will emphasise the unique value for each target audience group you aim to reach. The more focused your LP is the more people will recognize themselves and their needs, so the more effectively the page will convert. Addressing too many user groups on one page will make the whole proposition vague, as people will be overwhelmed with irrelevant info. For example, taxi apps have landing pages for passengers and drivers, because the proposition and the use cases are different for each user type.

Invest into testing before launch

Conduct testing of your landing page before going live. Your audience should be able to perform the desired action without any difficulties, otherwise, you might lose them. For example, the load time of the page directly influences the bounce rate. A load of 1-3 seconds already increases the probability of the bounce up to 32% (per Google research)! 

A quick checklist for your LP pre-publishing testing:

  • All images are displayed correctly and optimised for the web (always use compression)

  • All text is displayed correctly

  • The LP is adaptable to mobile devices

  • CTA and all links are clickable and lead to the right page

  • Loading time is under 3 seconds

Perform regular conversion testing

Regular testing of your LP is a key to improvement. Thoroughly gather and analyse the stats you get to identify weak points. Pay attention to bounce rate, CTR, average time on the page, and “cold zones” of your landing. Once you know the problem, you can fix it.

The fixing part can be tricky, though. Changing everything at once is a huge temptation, but the results will inevitably get smudged. To avoid blurriness, use an atomic approach to identify the factors that influence conversion. Apply one element change at a time to see the difference between before and after. It’s more time-consuming than bulk redesign, but it will give you more precise results of your improvements.

Final thoughts

There’s no codified rule set for building a perfect LP. I extracted these tips from reviewing hundreds of landing pages and analysing their performance. Have I forgotten anything? Share your best practices in the comments!

 

Tags:
Hubs:
Total votes 6: ↑6 and ↓0+6
Comments11

Articles