Landing page popularity is on rise. MarketingSherpa found that 68% of B2B businesses use landing pages to get new sales leads for future conversion. And the graph below from Google Trends shows just how much interest is growing as we enter into 2016:
But simply creating a landing page doesn’t open up the floodgates to new leads. It’s got to be optimized for conversion.
So…what makes a landing page convert? What is the winning combination of landing page elements that can sway even the most hesitant visitors to cast their vote in your favor?
To answer these questions and make things even more interesting, I’ll demonstrate what makes a great landing page with examples of high converting pages from 2015. Each example in today’s post not only include the right mix of optimized landing page elements, but they also feature trends that have contributed to their conversion success.
1. Write headlines that play to your visitors’ basic needs
Your landing page headline is the first thing your visitor will see and read, so it must make an immediate impact on them. If it fails to make an impact, your visitors will abandon your page faster than it took them to read your headline. An effective headline doesn’t simply explain what your product or service can do, but it naturally tells the visitor why he or she clicked on the page.
For example, anyone looking to answer the question, “how can I manage my company’s social media networks better?” would likely be attracted to this Hootsuite landing page headline, which provides a natural answer to the question. The sub-headline provides further support and assures the visitor he or she has landed on the right page:
2. Use gifs for product demonstration
Demonstrating how your product works is extremely important if you want to demonstrate value to a visitor. In the past, this could be done with graphics or photography, but more and more landing pages are using gifs for product demonstration.
Gifs explain how the product is used in a quicker way than videos. Plus, they play on a loop for the visitor, so they don’t have to click “play” to see the product in action.
Here’s a gif Visual Website Optimizer uses on its landing page:
If you don’t have the time or budget to create a product demonstration video, use gifs instead. Or intersperse them with videos to give visitors a quick, digestible example of your product’s functionality.
3. Use full-screen background videos to tell your story
Videos have the potential to increase landing page conversions by up to 86%, according to anEye View Digital case study.
The use of full-screen video allows you to autoplay it and engage visitors without annoying them. This background effect is an advanced feature using HTML5 video that replaces your page’s hero image.
Joybird furniture’s homepage is a great example of this. It also incorporates storytelling, allowing you to see how the furniture is made:
Or, how about this one from Story & Heart’s homepage:
With full-screen background videos, you have the opportunity to include more than a single image, which can help you tell a more complete and compelling story, and hopefully increase your conversion opportunities.
4. Create a 3D effect with parallax scrolling
With parallax scrolling your landing page background moves at a slower rate than the foreground, so a 3D effect is created as the visitor scrolls down.
The scrolling effect helps you tell a story on your landing pages. It also helps satisfy their desire to gradually learn more about your product or service. When parallax scrolling is used along with effective copy, you create a very professional and persuasive page.
Look how visually appealing and informative Rimmel London’s page is with parallax scrolling:
The Lix Pen page uses parallax design on their landing page to explain their cool 3D printing pen. Their pen follows you as you scroll up and down their page:
Parallax scrolling is an advanced page feature, but it sure portrays a clean and professional look to the visitor.
5. Use hidden menus instead of navigation bars
While there is no need to include navigation links on your pages, sometimes marketers still want to break up a long-form landing page with the help of a top navigation bar.
This is where hidden menus come in. If you must put navigation links on your page, the best way to do this is with hidden menus. That way the links aren’t as big of a distraction and only open up when the the user clicks them.
This Brian Hoff Design page uses a hidden menu button:
6. Spotlight your headline and form by splitting the screen into two columns
By splitting the screen into two columns, you can display two or more page elements with equal prominence. Do you think your landing page form deserves as much attention as your headline and sub-headline? Follow Salesforce’s example:
Instead of placing the form after the fold, Salesforce gives equal importance to all of its page elements. The two columns allow you to highlight specific landing page elements simultaneously without adding clutter to your page.
[By Fahad Muhammad] [From Autopilot]