How to Design an Effective Landing Page Share: Distillery Date Published 2 May 2019 Categories Blog, Guide Reading Time 11-Minute Read Well-designed landing pages entice users to take action. Our how-to guide outlines the principles, common errors, and basic steps for landing page design. First, let’s get clear on what we’re talking about: A landing page is a web page that encourages a user to do something. Generally speaking, a landing page is useful when a target action can be accomplished by a one-button click. Landing pages are effective only if you know exactly what and to whom you wish to sell. And while an awesome landing page will not necessarily turn visitors into buyers, it will help you find buyers among visitors. To create an effective, high-quality landing page, we’ll talk through three main topics: Understanding the principles of landing pages 8 common landing page mistakes that can impact conversion Steps for creating effective landing pages Understanding the Principles of Landing Pages Here’s the classic landing page scenario: A visitor comes, the visitor understands, and the visitor acts. To make this scenario work, you need two things: Traffic. The landing page is created to attract specific people to it — people who are interested in the proposal being made by the landing page. The content provided about the product depends on the audience you’re trying to attract. Call-to-Action (CTA). The landing page consistently brings you to a specific action. For these purposes, the scenario in which the user reads and remembers something doesn’t work. If there’s no CTA, you don’t have a landing page. The traffic and the CTA are fundamental components of the landing page. But the layout of the page may vary depending on your product and goals. There are several popular formulas for creating a landing page, including: AIDA, or attention, interest, desire, action. Draw attention, gather interest, create desire, and achieve an action. PMPHS, or pain, more pain, hope, solution. Identify the problem, aggravate the problem, show hope, and offer a solution. These formulas help to build the landing page framework, or the scenario that users will follow. The best way to think about it: One page, one offer, one action. It’s that simple. 8 Common Landing Page Mistakes that Can Impact Conversion If you’re making a landing page, your central goal is to drive users to take an action. With that in mind, let’s look at eight common landing page mistakes which could make users leave without taking the target action: Obscure offer. The text on the page does not clearly explain what the user will get. Out-of-sight or hard-to-find CTA button. If the button doesn’t get clicked a lot, it could be that it’s hard for users to see or find. Tediously long read. When half of the users leave without getting to the bottom of the page, you should consider shortening the page. Text and images that are unrelated. If users can’t understand which descriptions are related to which images, you risk losing their attention. Untidy or poor-quality design. Maybe your headers are too large, or too small. Maybe your icons and images are of poor quality. Maybe you’ve used too many colors or fonts, dazzling the eye such that users can’t concentrate. Monotonous content. If there’s too much text and too few pictures, it may be boring to read or look at. Elements that seem clickable but aren’t. If static elements appear clickable, users may click several times, receive no feedback, and leave disappointed. Unmotivating button text. Perhaps the text on the CTA buttons or captions doesn’t motivate users to click. Or maybe users don’t understand what exactly they’ll get by clicking. 5 Steps for Creating Effective Landing Pages For clarity and convenience, we’ve divided the process of creating effective landing pages into several sequential steps: Competitor analysis Target audience analysis Copywriting Prototyping Creating your landing page design Step 1: Competitor Analysis If you sell or offer something useful, you definitely have competitors. People necessarily choose between competing offers. Your task is to make them choose you. To make that choice obvious and clear, you need to stand out from your competitors. How do you do that? Show that your offer is more profitable or convenient. Think about features that help you compare yourself with your competitors. Make a table showcasing those features. Write out the doubts your users may have about each feature. Write out your strengths of each feature from your user’s perspective. Ultimately, those strengths should be highlighted on the landing page. Step 2: Target Audience Analysis For your landing page to be effective, you should have a good understanding of who your audience is and what you want to offer them. It should describe the product to a specific audience. To determine the target audience of your landing page, formulate an exact, targeted offer. Consider these popular methods of analysis used in website development: Method of personas. The “personas” are your typical (though fictional) clients. Each persona’s description reflects demographic characteristics, lifestyle features, and basic needs. To get started with this method: Begin by creating one to four main personas. It is primarily for them that you are designing your landing page. Next, create one or two additional personas. These are people who could become your customers in the future. Describe each persona’s goals and doubts. Pay attention to what may confuse the buyer. Write down any points of controversy that you need to work out on the landing page. Method of “jobs to be done.” Marketers and designers use this method to identify users’ goals on the page. The more goals the landing page helps users achieve, the higher the chances that visitors will become buyers. For this method: Identify goals on the page. Think about how each persona you’ve identified will use the page, and under what conditions they will be able to accept your offer. Select the main and secondary goals on the page. Make sure that the secondary goals help to solve the main one. Step 3: Copywriting Every website tells a story. Think about how you want to tell your story before you decide how to visualize it. There are four main stages of the copywriting process: Come up with a Structure. The structure of the text is a foundation that details will attach to. Text that has a good structure is easy to read and navigate, thus making it easier for users to remember information. By moving from one part of the page to another, users find answers to their questions. Write an Offer. To write an offer, you need to answer two questions: “What is it?” and “Why is that necessary?” An offer is the essence of your landing page. It’s an explanation of the benefits for the user. The offer answers the main questions visitors are likely to have, right here and right now. The most common technique for writing a good offer is the 4U technique. David Ogilvy suggested the formula for the ideal offer back in the 1950s. Essentially, your offer must always be at least one of the following: Useful Unique Ultra-specific Urgent Write the Text. When writing the text, use a clear, informative style of writing. Keep biased opinions out of it, and write about facts. Pose the question, answer it, and give evidence. Think about how you can prove each statement. Optimize It. An optimized site is simply easier to find on the internet. To achieve this, it’s necessary to prepare the site via optimization: Technical optimization is done for search engines. This makes it easier for them to get to the site and index it. The better the site is indexed, the easier it is to find. Text optimization involves the addition of keywords to the text. These are common phrases people use to search for products on the internet. Keywords are more visible to search engines when they appear in titles. Step 4: Prototyping Your prototype is essentially a map of your landing page. It schematically depicts everything that will be inside the page, including its structure, text, images, videos, and links. The prototype solves two problems: It allows you to position content relative to other content. It lets you test the layout of your elements. When creating your prototype, you need to think in terms of screens. One screen = one section = one complete thought. This is how information is perceived most easily by users. Landing pages are made up of a specific set of elements, including: Initial screen. The function of the initial screen is to make the right impression on users. It should inform users about where they’ve gotten. It should also motivate them to stay, and to scroll further down on the page. The story of the project. This element should provide a detailed description of the product or service: how it works, who it’s focused on, how much it costs, etc. You want the story to be impossible to ignore. Before explaining benefits or calling for action, you need to make sure that users understand what you’re offering. Clear benefits. This section explains how you differ from your competitors. In most markets, competition is high, so you need to offer clear, compelling arguments about why people should choose you. Blocks of trust. This group of blocks helps to build trust. Reviews, success stories, guarantees and certificates, partners, and even the phone number and address of your office will help to give your product an appealing face. These blocks help to show that your product is real and it can be trusted. Target action. Businesses need customers, so landing pages should have blocks that generate leads. These may include order forms, subscriptions, feedback forms, or phone numbers. When the prototype is ready, it’s time to remember the list of goals you collected using the “jobs to be done” method. You should verify that your schema helps users successfully complete all scenarios. The result of this step is a complete map of your page. It should be noted that it’s easier to make changes to this page than to the finished page. So it’s important to pay close attention to the prototype. Step 5: Creating Your Landing Page Design Before proceeding to the design of your landing page, I recommend checking out these two helpful resources. They’ll help you make fewer mistakes when creating your design: 10 Common Design Mistakes… and How to Avoid Them Design Tips Many books and lectures are available to tell you all about fonts, color, shape, composition, and other design concepts that are important to understand when creating a design. For now, let’s focus only on the essentials you should pay attention to in order to achieve a harmonious landing page design. Here’s my basic recipe for good landing page design: Page division, semantics, and spacing: The page is clearly divided into semantic sections. There is enough distance between sections, and this distance is consistent. One semantic section is not visually split into two. There is enough free space on the page. There is space around the text and pictures, and they do not interfere with each other. Font sizes: Same-level headers use the same font sizes. Titles are noticeably larger than the main text. Copy: The information provided in the text is not overwhelming. Only the most important information has been kept. In any column, there are no more than two or three lines of text. Center alignment is not used for any text block that has more than three or four lines. Images, icons, and buttons: No stock photos are used. All images support the style of the project, helping to convey information about the product and illustrate the content. All pictures are of good quality. High-quality icons are used to expedite the users’ perception of the content. Icons correspond to the overall style of the site. All icons are from one set. The text in the photos is easy to read. The text is not positioned over the informative part of the image. The button is the most visible element on the page. Menu: The menu has no more than five items. Items consist of short words. Color: The main and accent colors are in the ratio of 90% to 10%. The color corresponds to the offer. Composition: Dynamic composition is used. Animation: Appropriate animation is used The main thing to remember is that all landing page elements must obey a single style that helps to convey the essence of the offer. A thoughtfully designed landing page can make a massive difference for your business or product. To find the buyers you seek, take the time to get it right. Need help designing a landing page that incites action and drives conversion? Let us know!