A professionally designed landing page can improve your conversion rates.
This post is all about showcasing awesome landing pages, to give you some inspiration for your next design. It’s worth stating that no page is ever perfect — or conversely, every page can be better. With this in mind, we’ll be offering perspective on what makes each page special or interesting, while providing some insight into what we would try out in an A/B test experiment to optimize for higher conversions.
But what is it that makes a landing page design effective?
There are many factors, but the principle reasons are an adherence to the fundamental rules of conversion centered design:
- Use a clear and concise value statement so visitors understand the purpose of the page immediately
- Focus the whole page on a single message, with a single primary call to action (CTA)
- Use conversion design rules to make your CTA stand out (whitespace, color, contrast, directional cues)
- When using a form to collect data, balance the amount of information requested with the perceived value of the item being given in return (report, eBook etc.)
- And many more that I’ll get into in the examples below…
For this post we’re going to do something different. We’ll have 2 people to critique the pages. Oli Gardner will do some and Carlos Del Rio the others.
- It’s sexy: Predictable response? Yes, absolutely. That’s the whole point.
- Validation: They jump right into showing off the famous publications that have featured their company. From a design perspective, the grey monotone prevents a mishmash of colour creating any visual distraction from the call to action (CTA).
- Value propositions: The main content on the page answers two simple questions: “What is it?” and “Why should I care?”
- Testimonials: The second is one of the funniest I’ve read. Socks as a Service – genius.
- Removal of doubt: The subtext below the CTA lowers the perceived risk, which can improve the click-through-rate (CTR).
- Tagline: To make it more immediately clear what the purpose of the page is, I’d add a succinct tagline beside the logo.
- Main title (core value proposition): There are a couple of ways to use a headline: A) use a very clear statement of what you are offering to enable an understanding of the purpose of your page, or B) entice your visitor to want to keep reading by using a seductive headline. They’ve gone with B here, presumably in an attempt to catch your attention and increase curiosity (or to push a particular button). For a test, I’d try approach A and make it really clear from the get go – what Manpacks is (this would work really well with the tagline to help pass a five second test).
Want even more landing page design inspiration?
The example below shows an alternate page they created, presumably to speak to a different segment or create a different emotional trigger.
- Clear value proposition: The headline is very simple and leaves no doubt about the purpose of the page and the product. And it’s nicely backed up by a well written explanation of some of the core benefits directly below.
- Highlighted testimonial: The brushed highlight of the testimonial gives it a bit of extra design zing and prevents the page from feeling too text heavy.
- Contrast: They chose two nicely contrasting colors to highlight important elements. The free label, and the form CTA.
- Context of use: Their choice of imagery lets you know that the product can produce mobile-ready polls.
- Validation: Like the example above, they provide a strong sense of trust by including a set of logos.
- They’re Canadian! Woot!
- Remove the footer navigation: Any extraneous navigation on a landing page can lead your visitors down the wrong path. I’d recommend removing the footer nav to simplify the available choices.
- Explain the logos: Add a small label (like example #1) to explain that they are client logos (or sites that have featured/written about them).
- Experience: It immediately makes me want to go on holiday and stay in a pimp hotel. The pillows are literally selling me softly.
- Price: Travel is very much about price, and they get that out of the way right off the bat, so you can move on to the finder details after unerstanding if you can afford it or not. #smrt
- Endorsement: The Trip Advisor certificate of excellence let’s you know that a recognized authority has validated the company.
- The form header: Apply now? For what? It’s unclear what you’re applying for – I thought it was a booking site, but apparently I have to apply for something. Make it clear why people are filling out your form.
- Primary value proposition: There’s no clear statement of what the page is for or what you’ll get. I’d try moving the hotel logos from the top and adding in a strong statement that
- Testimonials: The testimonials shown are anonymous which reduces their impact (as they could have been made up). Always ask permission to use a testimonial and include the name of the person providing it for extra trust points.
- Exclusive: There is a mention of an exclusive preview invitation, but it doesn’t explain what you’re being invited to. I’d also make this stand out more if it’s an important selling point – perhaps using some visual cues to draw the viewers eye.
- Consistent CTA’s: the Calls to action on this page are matched in two ways. They have the same message and the same color to let you know which areas to pay attention to. Bonus points for not saying “Submit” on the form button.
- Use of video: There are two videos that help build an honest and open dialog with visitors right off the bat. First you get to hear from the company and then they use real video testimonials from clients – much more effective than written quotes.
- Clarity: No company wants to be contacted about something they don’t do. By listing the services they offer they ensure the right people will get in touch.
Honestly, this page is great – I’d change very little.
- Purpose of contact: I wouldn’t normally advocate making a form longer. But it might be helpful to add a dropdown list containing the purpose of the enqiry. This would help from a reporting angle (letting you gauge the needs of your prospects in a simpler manner).