Creating a landing page is one of the most exciting aspects of online marketing. Your landing page is your opportunity to show your sales skills online, and - more importantly - where you make sales. Sales mean money, which is the lifeblood of any business, so how you design your landing page can literally make or break your business.
As you create your landing page, you get to test your skills in writing headlines and copy, attention grabbing design. You also get to see that what you do has real results - the power of words and design.
In this tutorial, I cover the basics of what makes a good landing page design. It's a bit like we're running a relay together. By showing you what works well in general terms, I'm running the first leg. But to make it work for your business, you've got to take the baton and continue running, until you discover the landing page design that works for your business.
What is a Landing Page?
A landing page is a page on your website where you send visitors to take a specific course of action. This might be to:
- Buy your product.
- Sign up to your email list.
- Enter your contest.
- Like your Facebook page.
Whatever the specific goal of your landing page, the wider goal is the same: To get readers invested in your business. To make what you're doing matter to them so much that they're determined to take action right away.
An effective landing page is made up of three key elements:
- attractive design
- compelling copy
In the most effective landing pages, these elements interact perfectly and reinforce one another. This tutorial focuses on the design of landing pages, but will also touch on the other elements.
Design Matters - Here's Why
Professional design makes a difference, and you don't have to take my word for it. A recent study by Standford University asked participants to comment on what made a website most credible.
If your website looks shabby or cobbled together, then you’ll scare customers away before they even give your offer a chance.
In the comments, design was the most frequently cited criteria participants used to establish a website's credibility. Nearly half (46%) of comments focused on design. This puts design above information structure (29%), information usefulness (15%), information accuracy (14%) name recognition (14%), site functionality (9%) and customer service (6%).
They might say to never judge a book by its cover. But even if you live by this maxim, your customers don't.
If your website looks shabby or cobbled together, then you'll scare customers away before they even give your offer a chance.
In short, a quality design speaks of a quality product
A few years ago, to get a professional design, you had to splash out on a world class designer. These days, with stunning templates available for a steal, there's no excuse for poor design.
Design Fundamentals for Landing Pages
Keep it Clean
When it comes to landing page design, less is more. A minimalist approach to design keeps the focus on your message.
When it comes to copy, effective landing pages can be long or short (the secret here is split testing and seeing what works for your audience). Either way, there should be nothing on the page to distract from your core message. If it doesn't help the reader become more emotionally invested in your business, it shouldn't be there. If it's not selling your product, kick it out. Your aim is to keep the reader completely focused on the product you're offering.
In particular, only include links if they're absolutely necessary, such as the Buy button, or for an in-depth tutorial of your product. Anything that takes the reader away from the landing page is a potential escape route.
There should only be three routes out: finding more about the product, buying the product, or the web browser back button.
If it’s not selling your product, kick it out. Your aim is to keep the reader completely focused on the product you’re offering.
Choose Your Images Carefully
Images can be the best (or only) way of showing off your product. They're very powerful, but you should use them sparingly.
That's because images are eye-candy. On a blog post, including plenty of images can encourage your readers to keep scrolling down the page. But when it comes to a landing page, images are mostly clutter. Images distract the reader from your main point, and increase the load time of your page. Research by the Aberdeen Group found that a one second delay in page load times meant 11% fewer pageviews and 7% fewer conversions.
Leave Space to Breathe
Continuing the theme of minimalism, effective landing pages are spacious -- with plenty of white space.
We've all met sales people who try to force a sale with their machine gun patter. They won't shut up until they've got you to sign on the dotted line or - more likely - chased you out the door to the parking lot. Effective salespeople deliver their pitch, ask relevant questions, and give their client space to think.
Your landing page is your pitch to potential customers. Whitespace in your design allows them space to think, and gives them a sense that your product is going to make their life easier, not more complicated.
The Clickr theme is a good example of a landing page with plenty of whitespace.
In 2013, 15% of online retail sales will come from mobile and tablet devices. By 2017 this will rise to 25% (mobile research here).
Make sure your landing page is responsive so it looks as professional on mobile devices as it does on a monitor. Otherwise, you risk losing a significant proportion of sales.
Show Rather Than Tell
One of the cardinal rules all fiction writers learn is to show rather than tell. That's because giving the details of a story makes it more emotionally compelling than a simple summary.
When it comes to sales, the more you can show what your product does for customers, the stronger your sales message.
For example, if you're selling a web app you could offer a guided tour of product features. Or if you're offering an ebook or ecourse, you can provide a sneak peek inside (just like the eBookie theme does.).
Another way to show rather than tell is through customer testimonials, so ensure your design allows these to stand out. Testimonials with a real name and a picture of the person giving them are seen as more authentic, and video testimonials are the best of all.
Testimonials are a form of social proof, because readers will reason your product has helped others, it can help them too. For easy but high impact testimonials, consider including screenshots of tweets from people who have downloaded your content and found it helpful.
Finally, product demonstration videos can be another fantastic way to show what your product does. However, video can be a potential escape route if it's hosted on a network such as YouTube, so opt for self-hosted videos if possible.
Use What's Familiar to Your Audience
If a particular landing page layout is standard in your industry run with it, unless you've got a very good reason to shake things up. Using what's familiar to your audience helps establish trust and boosts conversions.
Additionally, design your landing page so that it matches with the colors and fonts of your website. If readers are clicking through from your website, the transition from your main site to the landing page should appear seamless.
The Call to Action
Whether it's a buy button or a short form, the call to action is the crucial element of any landing page.
For buy buttons, split tests show that making the button a color that contrasts the rest of the page usually works best, because that way the button stands out (See, for example, the green button on the Promoter theme).
When it comes to forms, it's about making them as simple and no-nonsense as possible. Only ask for information you absolutely need. Typically, the more information you ask for, the lower your conversion rate.
Over to You
In your opinion and experience, what are the fundamentals of an effective landing page? What have you found works? What mistakes have you made before discovering a winning design?
Envato Tuts+ tutorials are translated into other languages by our community members—you can be involved too!Translate this post