A landing page is an effective way to drive sales for any business. The majority of websites share a similar range of assets — about us pages, contact pages, etc. But a great landing page is something that takes time to produce.
Landing page designs will vary, depending on the industry that you’re in. However, most effective landing pages have a few key elements in common that make them successful.
1. Negative space is key
Web design: Convo
A cluttered landing page will confuse your client’s message. Sure, a landing page can have tons of information on it, but organize it and break it up into manageable chunks.
2. Page layout and placement of elements
In Woocommerce each section uses a different number of columns to visually break up the content.
It is important to have the most high impact visuals above the fold, or where the viewer can see when they arrive on a landing page. If your client has a video, a few important bullet points, and a direct call to action, place them above the fold. You’ll find this on many effective sales and marketing pages.
Below the fold is a good place to expand on the product or service that is being offered. Just remember to keep the layout consistent and clean. Like in our previous point, too much clutter can clutter the message, too. If they don’t have an easy path from one content section to another to follow, visitors will get frustrated and just leave the site altogether.
Break up long content with variations, such as having a section of bullet points for benefits, and then a section of icons or graphics to keep it interesting. In short, mix it up a little.
Woocommerce is a free e-commerce toolkit for WordPress. Their landing page features a promo video, and a lot of benefits and features are spread out on the page. Nothing is crammed together. The content has room to breathe, and each key point is divided into its own section.
We also like how they shortened what could have been a very long page with circular elements that act as tabs. This makes the site clickable and interactive, and adds an explorative sense to the site. The layout is varied, with each section being a different number of columns to break up a huge amount of content visually.
3. Invest time and/or money in great imagery
Klout’s Website exemplifies the idea “Be known for what you love”
With any web page, especially a landing page, you want to make sure that you use images that grab the visitor’s attention. One of the strongest ways to make a connection with a visitor is to use a powerful, emotional connection with them.
Klout’s landing page features someone walking along the beach with a guitar. The image is beautiful and gives a care-free fun vibe to the site. The concept is to show that you can share great content that you enjoy. The tagline “Be known for what you love” exemplifies this idea.
4. Include a powerful call to action
The WordPress call to action button is bright orange contrasts strongly with the blue background.
People need to be told what actions to take. The landing page itself is meant to inform, and get them hooked.
The call to action is meant to tell them what the next steps are, such as entering their email address, or clicking a button to sign up or learn more. A call to action should always stand out, whether alone on the page, or they are overlaid on top of an image. The text should contrast well with the button or background as well. Clarity is a major factor with any call to action. A client can lose a lot of potential customers by not having clarity on what is wanted from them.
WordPress is one of the most popular blogging platforms out there. Their dot-com site features a grey background, which trustworthy blue stands out against. The only other color on the page is their call to action button, which is the first thing you see because it is bright orange. The orange is a complementary color of the blue they’ve used, creating the most contrast possible.
5. Use practical, trustworthy colors
Freshbooks use a combination of blue and green colors
The psychology of color is important, especially with a landing page. Any time that you are asking something of anyone, they are immediately skeptical. You want to use colors that represent good qualities.
For example, blue is a great landing page color, because it represents things like cleanliness, freshness, and tradition. Green is also another popular color for landing pages. The reason that green works so well, is because it is associated with growth, money, and life. Colors like yellow and red are usually avoided, because of their connections with fear, cowardice, and anger. However, this is all a matter of context as well.
Notice how Freshbooks incorporates a lot of what we have already mentioned, rolled into one site. They use a combination of blue and green colors, dedicated content above the fold, a strong call to action that stands out, and the image shows how Freshbooks is available on all devices, making your accounting accessible from anywhere.
We also like that they have social proof, such as mentioning that 5 million people use the service, and they show at the bottom that they’ve been featured on reputable sources, building trust with viewers. Below the fold is more information, testimonials, and a video.
6. Social proof wins
Hootsuite’s landing page has a good structure above the fold.
Testimonials can make a huge difference when it comes to conversions. When you are trying to convince others to do something for you, whether it is giving you their email address, or signing up for a monthly subscription, it’s tough to build trust.
When you place testimonials from others that talk about how the product or service benefitted them, it gets the reader to place themselves in their shoes. The reader will ask themselves, “Do I have problems like these?” If they do, then they will be more likely to see that it will work for them, too via comparison. Being able to identify with your target market and solve their problems is a great way to get conversions.
Also, psychologically, no one wants to be the first person to do something. If they see that other people in similar circumstances have taken the leap, and it worked for them, then they should see the same results.
One of the last things that you see above the fold for Hootsuite is the testimonial by Pete Cashmore, CEO of Mashable. If your client has got a big name to endorse their product or service, their testimonial can generate instantly credibility. Make it visible! On Hootsuite’s site, it is the last thing you see before having to scroll, and leaves a lasting impression.
Shopify is another great example of a site that uses testimonials.
Shopify is another great example of a site that uses testimonials to promote their products. With two dedicated featured testimonials, one a site owner and another a celebrity figure, this section adds instant credibility to their online store software.
7. Video can be very persuasive
Leadpages: Above the fold is all about ‘what is it?’ questions.
Using a short promotional video can dramatically increase conversions on a landing page. A short, professional video is quicker and easier to watch than read the copy. Some people won’t stick around to read a lot of text. However, if you have a compelling video from your client, it is more likely to draw users in and they are much more likely to stick around and read the text to find out the details.
Video also helps to build a personal connection with visitors. Seeing a face or hearing a pleasant voice is a much nicer experience than reading a long page of sales copy. It also gives them the opportunity to see a product or service in action during the video.
Leadpages is a service for building landing pages. Above the fold, they have a short demo video that combines facts, statistics, and a live demo of their products and services. It shows just how easy it is to build an effective landing page with their products. The text above the video tells a user what to do first, which is to watch the video. After watching the video, they end up reading the text on the right hand side, with a guarantee and a call to action button to go ahead and sign up.
Leadpages: Below the fold the focus switches to ‘Why?’ questions.
Below the fold, Leadpages uses a rotating testimonials section, featuring industry leaders who have used their service and found success with it. Everyone wants to use products that other successful people are using. This immediately establishes the credentials of Leadpages and cements their credibility. Right below it, they show social proof with big brands and successful companies that use their service too.
This article was originally written by James George and published on SitePoint — a site that provides cutting-edge content for web professionals.