Built to Convert–Landing Page Design Best Practices

Landing pages are any page that a visitor arrives at after clicking on a marketing call-to-action. This could be a search or display ad, an email, a social media post, or an affiliate link.

Some companies send traffic from those referring sources to their home page; that’s a mistake. Landing pages provide several benefits, including a clearcut offer that aligns with whatever the referring source is. This results in higher conversions than simply sending new visitors to the home page and hoping they figure out how to find what was offered when they clicked.

Designers can create landing pages that convert more effectively by following landing page design best practices like those included here.

Do Highlight the Benefits

Product designers tend to want to focus on features; consumers want to know about the benefits. They want to see how those features impact their experience. A person doesn’t buy a car because of its 300hp; they buy it because that 300hp allows them to go fast. That’s why many car ads mention their 0-60 times instead of just horsepower numbers.

On landing pages, this means using elements like headlines and bulleted lists to highlight the benefits of the product. This is what users want to know first: how does this product benefit my life or business?

Do Use Relevant Images

People are visual creatures. A dearth of images can be unnerving to a person viewing a landing page. Good images add to a sense of trust between the consumer and the company.

There are many types of images that can be used effectively for landing pages. Product images are the most obvious choice.

As users respond better to pictures of real people, images of people using the product are even more compelling. Stock photos of models, on the other hand, don’t necessarily add to the user’s experience.

Landing page designers should aim to use images that create an emotional response in the people visiting a landing page.

Do Test Your CTAs

Arguably the most important part of any landing page is the call-to-action. Because of their importance, designers need to test their CTAs to ensure they’re optimized to get the highest number of positive responses from visitors.

A/B testing is the simplest way to test CTAs. Designers can have two landing pages randomly shown to visitors for a set time, each identical except for differences in the CTA itself. From there, they can continue to refine and test until the CTA gets the desired results.

Designers should consider testing things like the CTA button color, the language surrounding the CTA (and on the button itself), and the placement of the CTA on the page. (Other parts of the landing page can also be A/B tested for better overall results.)

Do Make It Mobile-friendly

Considering how many people browse the web on their mobile devices, it’s a mistake for designers to overlook how their landing pages will look on smaller screens. While creating a design that simply looks okay on mobile is an option, simplifying the landing page so that it’s more effective on mobile is an even better idea.

Mobile-friendliness is especially important for landing pages that social media posts and ads or emails point to. In 2017, 75% of email users reported checking their email on a mobile device (and that number has only risen since). And 42% of people worldwide (not just internet users) use social media sites from their mobile device. Further, in 2018, 40% of Black Friday sales were made from a smartphone or tablet.

People don’t just browse social media and read email on their smartphones. They make purchases, sign up for services, and otherwise complete actions companies want them to make. Designers who overlook this huge percentage of the market are shortsighted at best.

Do Make It Consistent With the Referring Source

When someone clicks on an ad or link in an email, it’s essential that there’s consistency with the landing page they end up on. This can be done in a few different ways, depending on what the referring source is.

For example, if the referring source is a search ad, then using some of the same language between the ad and the landing page the user ends up on provides consistency. If the referring source is an email, then using similar images and color schemes can lend the consistency visitors need.

When designing a landing page, designers should know what the referring source will be to make sure they match up in at least a few ways.

Do Include Social Proof

People want to know that a product they’re considering purchasing has made other customers happy. Social proof is one of the best ways to provide that reassurance.

There are a few ways to provide social proof. One is to include testimonials or reviews prominently on the landing page. Another way is to include social media conversations about the product. Designers should be careful when doing that, however, as automatically displaying all social mentions might end up showing both the good and the bad.

Don’t Make Landing Pages Do More Than One Job

A landing page should only have one job to do, and this should be determined before it is designed. A landing page that asks visitors to purchase something, but also sign up for a newsletter is splitting the attention of that visitor. This makes it less likely they’ll take the most desirable action.

Designers should consider what the call-to-action is and make sure that no other actions are prompted on the landing page. Even things like other navigation elements can draw a visitor’s attention and prevent them from completing the desired action.

Don’t Ask for More Information Than Required

Asking for too much information can be a quick way to make visitors bounce from a landing page. And yet it’s common to see landing pages with forms that ask for not just a name and email address, but a phone number, company name, job title, and more.

Unless a visitor can immediately see the value for providing that information, it greatly increases their chances of bouncing from the page. To decrease a landing page’s bounce rate, designers should only ask for the bare minimum of information in order to complete the offer.

Another key usability issue common on landing page forms is when they’re not optimized for mobile devices. Form fields should be coded in a way that prompts the appropriate keyboard layout for each field.

That means when a user is entering their email address, for example, the keyboard shows the “@” symbol on the main screen; or when a phone number is requested, the keyboard switches to numerical input. This small detail greatly improves UX on mobile devices.

Don’t Include a Navigation Bar

Not including a navigation bar ties directly into the idea of single-purpose landing pages. Navigation is visual clutter on a landing page and can result in users clicking to a different page on the site without completing the desired action.

Eliminating the navigation bar helps keep the visitor on task. If designers are concerned with providing more information to visitors, it should be included on the landing page itself or in links further down the page, preferably after the first call-to-action.

There’s no sense in distracting a user who’s ready to sign up or purchase by giving them other options. Despite this, many landing pages include additional navigation options.

Don’t Clutter the Page

Landing pages should only include the information necessary for the person who landed on that page to complete the desired task. The more investment needed on the part of the visitor, in most cases the more information will be required.

For example, a free trial that doesn’t ask for payment information is a fairly low-risk offer and wouldn’t require as much information to be presented.

A page that’s requesting a user to make a purchase, however, will generally need to provide more information to the user. That amount of information only goes up as the price point increases.

Designers should follow good principles of design in creating landing pages just as they would with any other page. Minimalist and simple designs are generally preferred, as long as they fit the brand in question. White space around the content prevents users from becoming overwhelmed and allows them to focus on what’s important.

Don’t Stray From Established Patterns

People have certain expectations when it comes to landing pages. They want to know about the benefits, they want a clear value proposition, and they want an easy-to-complete call-to-action.

When a designer strays too much from the established landing page patterns, they risk alienating the user and interfering with their completion of the task at hand. Experimental designs are great, but often better suited for other types of pages and websites.

Don’t Be Generic

While sticking to established patterns is a good idea, that doesn’t mean landing pages have to be generic. Designers should consider how including additional details and design elements to a landing page can improve the user experience, grab the user’s attention, and reinforce the value of the offering.

That could include video content, animations, slideshows, or a number of other design elements. What’s appropriate for one product or service won’t necessarily work for another. Designers should feel free to experiment with unconventional content on their landing pages, but be prepared to A/B test against more conventional methods to ensure they aren’t driving visitors away.

Conclusion

Landing pages are a vital component of any online marketing campaign. Their singular purpose helps drive conversions without distracting visitors.

Designers who follow landing page best practices can create more value for the brands they serve by creating pages that convert better than the competition. Keeping landing pages simple, focusing on the CTA, keeping forms short, and other guidelines already mentioned will make landing pages perform more effectively while also improving UX.