UX Principles that Help You Create High Converting Landing Pages
Have you ever tried to pull a door that was meant to be pushed?
Were you embarrassed after the fact?
Well, you shouldn’t have been, because as it turns out, it wasn’t your fault after all. According to Steve Krug’s ‘Don’t Make Me Think’ objects need to be designed keeping in mind the principles of intuitive navigation and information design.
Translation — if you have to think what the right way to open a door is, the door was clearly not designed keeping in mind user experience. When you apply the same principle to landing pages, guiding visitors to the call to action button becomes much simpler.
For your landing pages to successfully convert prospects into users you need to account for UX principles that have the potential to get you that conversion.
But, before we dive into what UX principles you should be using on your landing page — let’s first shed some light on what user experience (UX) is and what role it plays on your landing page.
What is User Experience (UX)?
Laura Klein of Users Know defines user experience as ‘the experience that a user has while interacting with your product.’ She defines UX design as the ‘the process used to determine what the experience will be like when a user interacts with your product.’
So, UX design principles dictate how a prospect feels when they interact with your page elements. If the experience is a good one they stay on the page and complete the goal, whereas if the experience is negative they bounce, and perhaps never come back again.
So, what UX design principles can you use to create high converting landing pages?
UX Principle #1: Create a true landing page
Your landing page must be a true landing page if it has any chance of fulfilling the conversion goal it was created to fulfill. A true landing page is a dedicated(dedicated to the offer in the ad), standalone (it is not connected to your website’s main navigation) page that guides users toward a specific offer.
Because your landing page is meant to promote/advertise/highlight one offer, it shouldn’t include any links that take visitors to another page which is not directly related to your offer. Yes, this includes your about page, your product page, and even your homepage.
Only if you create a dedicated and relevant landing page will user’s have a positive experience on it.
As soon as a user clicks an ad they have certain expectations of what they will get to see next, a true landing page meets these expectations and makes for a good user experience.
For example, when I click an ad claiming to increase shopping campaign ROI, I expect the landing page to deliver on the promise:
The landing page does deliver on the promise, the ad and landing page headlines match, there are no off-page navigation links and the promoted offer is the same:
Meet user expectations and deliver a good user experience by creating a true landing page.
UX Principle #2: Make sure your headline stands out
The landing page headline is the first thing the user should see when they click through to the landing page.
This only happens if the headline is designed in a way that it stands out from the surrounding copy.
This isn’t what you should be doing with your landing page headline:
Instead do what Campaign Monitor does with their headline:
As soon as the page becomes visible to you, the headline is the first thing you see, plus both the dudes on the landing page are staring at the headline which definitely helps get the user to look at it too.
You should use visual cues to direct visitor attention to specific elements on your page.
UX Principle #3: Make your copy readable
Regardless of the amount of copy you place on your page you need to ensure one thing — the copy must be readable.
Readable copy is copy that has been broken down into small distinct units or chunks so that visitors can go through it easily can comprehend its meaning.
Your copy should be surrounded by ample white space so that users can digest it effortlessly.
The Marketo landing page doesn’t feature very readable copy, especially the second paragraph is a bit too much to take in:
That’s too much copy for a single screen, plus it’s not designed in the most ideal way.
The Optimove landing page on the other hand designs their copy in a perfectly readable way:
The copy has more room to breathe, which enables the user to have a good experience with it, plus the visual appeal of the page is far greater than that of Marketo’s page.
Don’t you agree?
UX Principle #4: Add contrast
What’s the last place you want your user’s to look on your landing page?
Yes, that’s right — the CTA button.
Adding a contrasting color to the button helps it pop on the page and attract user attention. It’s important to mention here that there is no one magic CTA button color.
Not every red button will get you conversions just because you read a case study where a red button outperformed a blue one.
Make sure the CTA button color contrasts with the page background and other surrounding elements — that’s the only way you’ll get it to pop.
Which CTA button pops more?
Or this one?
Want your users to have a positive experience with your CTA button, don’t hide it away, make it shine.
Getting users to convert on your landing page is hard.
A conversion only takes place if the page maintains the right balance of conversion psychology, optimization, and UX design. The principles mentioned in the post may seem like a no-brainer to most marketers, but the fact is that most landing pages we see regularly are littered with UX mistakes.
Make use of these 4 UX principles on your landing pages and see the conversions rolling in.
Clap away if you liked what you read. All claps will be hugely appreciated. Follow me on Twitter if you want to read more content like this — because there’s a lot more where this came from.