The process for creating (potentially) high converting landing pages
Instead of designing directly from wireframing to visual design, Start to research, write copy first, create a sales flow that aligns well with the human brain(tell a story), refine, design and refine, publish. (testing will be out of scope for this article).
Why I changed my process (and why change yours)
Here’s my old process: Make a wireframe, Fill it with copy, Make it pretty(visual design).
The problem with this old process is.. well everything. First the copy has to be created after creating the space (section) for it. As I learn from CXL is that copywriting is actually the most important element when designing a landing page. Quite humbling for a designer huh?
So it makes sense for us to create copy then design right? Not only because copywriting is more influential in conversion but also because this how our brain work: we think in stories. Repeat with me: we think in … well, you get it.
But as a UX designer, I didn’t have a process of writing copy. I did for design but not for copy. I started researching and I found some good resources like the guide by Peep Laja on CXL blog. However, that wasn’t enough. It had some best practices but I needed more, a process. Thankfully, there’s the copywriting course on the CXL by Momoko Price. And with the many other courses about the best practices they get from actual tests, and my experience as a designer, now I feel I have a next level process compared to my old one.
The process for creating (potentially) high converting landing pages
1- Research
As boring as this word may sound, it’s a crucial part of this process. You can start with a easier way by researching reviews of your website or similar sites on platforms like TrustPilot. You can also create user polls and surveys and conduct user interviews.
If the landing page already exists, take a look at google analytics. See who your users are, where they’re coming from and what they’re doing. Don’t just look at the landing page as it can’t be taken as a separate element from the whole experience, it’s a step of the funnel. So probably there’s a problem with the checkout (too much friction for example — a lot of inputs).
2- Copy First
Create a sales page flow that looks like a story. Start with a unique selling proposition (USP) matching their motivation. Lay down the benefits they will get from your product using their own words. Match their expectation
3- Wireframe
Here you need to reinforce the hierarchy of your messages. In the previous step, you started by the most important information to the less important one. Here, you also need to reinforce that by making the most important things to say bigger, bolder and stand out with color if seen fit.
3- Visual design
People judge your brand within 50ms. But how? can a human read what we’re selling in 50ms? of course not, so you see where I’m going: Aesthetics matter. Sometimes gly wins they say, but it’s not really true. It’s not the ugly that won but the website with more persuasive copy.
So what about we make our website not only persuasive with copy but also attractive and assuring with visual design. Sometimes when the aesthetics are not done well, you mistrust the website. I did that a lot of time (and even before becoming a designer). For this part, inspire first. gor to landingfolio for example and other beautiful landing pages collection websites.
Make a visual direction, choose the visual style (colors, typeface, images, illustration, icons) that goes well with the emotion you’re trying to evoke. Then start designing.
A template to start with for a good landing page
Every website is different and there’s on one solution that fits all kind of businesses. However, we can start with a template that contains the best practices and adjust from there then test and tweak.
We’ll take an example of a note taking software. This is of course an example so probably we can do more wit more time and research.
1- Header
Unique value proposition (The offer they can’t refuse): Gain clarity and increase your productivity with smart notes
Short description (to detail the offer you’re trying to sell): Create todos, plans, and journals and search them even with your voice
Bullet points (the key specific benefits)
- Make plans and send to colleagues
- Search and take notes with text or voice
- Get organized even Offline
Clear CTA (Call to Action):
Here’s a formula I learned to write the text inside a CTA. If I’m going to click on this, I will (Text here). Make it specific and benefit oriented. Create free account, Start Free Trial, Create my note — Free account(for this example we’re taking)
Hero image: For this example it would be great to make something that shows what the app looks like but with more style focusing on the benefit. This is a designer problem to solve.
2- Social Proof
Here include testimonials and/or logos of businesses who trust you. For the example of the note taking app, we can take testimonials for the target audience. Let’s say this is mainly dedicated for teachers, we can use that. Probably even companies use them as a project management tool (like notion.so) so that would probably change the story we’re telling and the people we take testimonials from.
3- Benefits
It seems like there’s a war between marketers to decide will features or benefits win. I think even for super technical software products, we can always seek the benefit. But anyway, this depends on your context. So in this step, try to list all the features and get the benefit out of it. Remember to use the exact words your users say. But how do I know? .. well, you skipped research didn’t you?
4- Answer their objections
This is not an FAQ. Probably it is, but the best FAQ is the one where you don’t feel that it is. I mean by that, make it into normal sections. Are they worried about losing their notes here? are they worried about not being able to cancel their subscriptions? Answer these questions.
Conclusion/TLDR;
Creating a (hopefully) successful landing page is hard work. It’s not about throwing an image here and there and saying whatever is in our head. We need to learn who our customers are and how they talk when talking about our product a similar one. We need to create a story, answer their questions and make ourselves credible with design and copy.
