Landing Pages: Basics and Best Practices

Learn the best practices of creating landing pages that convert
Landing Pages: Basics and Best Practices Lesson

A landing page is a special webpage designed to guide visitors toward a specific action, like making a purchase, signing up, or trying a service. A good landing page can convince people to take the action you want. On the flip side, a badly designed landing page can confuse or overwhelm visitors, causing them to leave your website without taking any action. This is why it's important to make sure your landing page is straightforward, easy to understand, and visually appealing so that visitors feel comfortable and confident in taking the next step.

Don't overload the landing page Bad Practice
Don't overload the landing page Best Practice

Cluttering your landing page with too much information has a negative impact on how your visitors interact with your page. Keep users’ focus on the primary information by removing everything on the page that doesn’t directly support that information. That means getting rid of any secondary offers, distracting imagery that doesn’t directly support the content, and even navigation to other parts of your site in some cases.

Moreover, most users read as little as 20% of web copy.[1] To combat this, try limiting your paragraphs to 3-4 lines and add descriptive subheadings for every couple of paragraphs. This makes your content both more readable and scannable.

Use a compelling headline Bad Practice
Use a compelling headline Best Practice

Users form a first impression of your website in 0.05 seconds.[2] That’s all the time you have to catch their attention and get them to stick around.

Headlines are one of the most important elements for grabbing users' attention. Stick to clear, concise headlines that are relevant to the central content and demand attention. Shorter is generally better in this case.

Make the value proposition obvious Bad Practice
Make the value proposition obvious Best Practice

A value proposition is a concise piece of copy—often accompanied by visuals—that sums up why users should choose your product over others. Think of it as your product's elevator pitch, featured prominently on your landing page. A compelling value proposition answers three key questions: What is the product? How does it benefit users? How does it work?

To elevate your landing page, use clear and direct language in the copy and support it with complementary visuals like icons or images. Place it in a noticeable location so it's one of the first things users see. A well-crafted value proposition not only grabs attention but also sets the stage for a meaningful user journey.

Pro Tip! Consider combining a header, description, and image/video on your landing page to best convey your value proposition.

Avoid jargon in your copy Bad Practice
Avoid jargon in your copy Best Practice

If your product is targeted at a specialized group of users, you may use technical terms, but you should explain what they mean first. 

Clarity is key when it comes to landing page copy. By using technical jargon and complex vocabulary to impress readers, you sacrifice readability and credibility.[3]

While your colleagues might know exactly what you're talking about, the average user may not. Use simple language that's familiar to your audience and helps them navigate your product easily.

Pay attention to your CTA button Bad Practice
Pay attention to your CTA button Best Practice

Call-to-action (CTA) buttons are pivotal on landing pages, guiding users towards actions like subscribing, signing up, or making a purchase. Here are some tips to make sure they stand out and do their job:

  • High visibility: Make CTAs stand out with an accent color, potentially even using a contrasting hue from the background for better results.[4]
  • Immediate visibility: Place CTAs prominently without requiring users to scroll. This boosts click-through rates.[5]
  • Strategic placement: On longer pages, sprinkle additional CTAs at intervals to increase conversions.
  • Clear and direct language: Use active verbs and avoid jargon for straightforward instructions. Ensure users understand the action they're taking.
  • Ample size: Employ a larger CTA button for clear visibility and ease of clicking, irrespective of device or screen resolution.
  • Accessibility considerations: Comply with WCAG 2.0 recommendations, providing a minimum touch target of 44x44 CSS pixels, benefiting users with vision or motor disabilities.[6]
Add visual cues to scroll down Bad Practice
Add visual cues to scroll down Best Practice

Don’t mislead visitors to your landing page by hiding content. If there’s content below the cut that isn’t immediately apparent across devices and screen sizes, use a visual indicator like an arrow to let users know it’s there. This helps ensure that users won’t miss critical information.[7]

Pro Tip! Ensure that the CTA, main image, and headline are clearly visible without scrolling. 

Use contextual images Bad Practice
Use contextual images Best Practice

Support your landing page’s content with relevant images that add to the meaning. Use them to convey or reinforce the information elsewhere on your page. A picture is worth a thousand words, so make sure your images assist in conveying information to your visitors, even going so far as to explain elements that are difficult to put into words. For example, on a landing page for Swiss tours, it makes sense to use an image that directly supports the idea of exploring Switzerland’s natural beauty, since the country is widely known for its breathtaking landscapes, including the Alps, serene lakes, and lush valleys.

Increase credibility with social proof Bad Practice
Increase credibility with social proof Best Practice

Most people don’t want to be the first to try something new. They want to know that the decision they’re making has already been vetted by others. In fact, 91% of consumers find a product more trustworthy if they get recommendations from people they know. 70% also trust public comments and opinions about products online.[8] 

Social proof offers strong reassurance for people considering making a purchase. Including reviews, ratings, stats, and other social proof on your landing page can persuade many consumers to make a purchase.

Use brand authority to build trust Bad Practice
Use brand authority to build trust Best Practice

Consumers want to know that they can trust a brand before making a purchase. Showing brands that use the product (or have reviewed it) is an efficient way to ensure purchasers that the offer is trustworthy. 

If major brands use the product being offered, or well-known media outlets have reviewed it or mentioned it, showcasing that can build a lot of consumer trust. Using logos to reference business partners, clients, or media mentions offers strong reassurance to consumers.

Offer perks to users to boost engagement Bad Practice
Offer perks to users to boost engagement Best Practice

People are naturally inclined to return favors. When consumers receive something beneficial from you, like a discount or free shipping, they're more likely to feel a sense of obligation to reciprocate. This principle of reciprocity can effectively encourage users to make a purchase. Special offers and bonuses serve as compelling incentives that leverage this psychological trigger.

People access digital products with an array of devices like tablets, smartphones, desktops, laptops, and even wearable tech like watches. So, it’s vital that your products work well regardless of the screen size and resolution or device type. 

Make sure that your important landing page elements (headlines and CTAs in particular) are displayed properly whether users are accessing it on a desktop or their smartphone.[9] Responsive design techniques create UIs that work on virtually any device. They adjust the layout and other elements of the design to fit the screen being used.

Slow-loading web pages are a major frustration for users. If a page takes more than a few seconds to load — especially on mobile devices — the likelihood of users leaving increases significantly. Google recommends keeping load times under 2.5 seconds to reduce the risk of losing visitors.[10]

Add customer support Bad Practice
Add customer support Best Practice

Regardless of how thorough the information is on your landing page, some users are bound to still have questions, especially on their first visit. Make it easy for users to ask those questions by including a visible chat widget to convert prospects more quickly.

A word of caution here — sticky chat elements should be desktop features only. Due to the luxury of space on the desktop, it's less likely that a small widget will block any essential content. In contrast, mobile users always complain that sticky chats overlay search results, filters, or worse, the Checkout button on e-commerce websites.[11]

Complete the lesson quiz and track your learning progress.
Start
<?xml version="1.0" encoding="utf-8"?>