A website’s landing page is a business card, a call-to-action with the ultimate goal of converting users. Is yours bringing them in, or scaring them off?
Whether you’re fixing a train wreck or starting from scratch, it pays to have a framework for your work.
To that end, we’ve come up with 7 golden rules for designing a landing page, and they’re universal, too — it doesn’t matter what you’re trying to sell or propose.
Let’s find out how to make your users an offer they can’t refuse:
1. First Impressions Matter
You’ve got to hook the user after all. An effective headline and subheading shows visitors who you are, what you’re selling and why it’s relevant to them at a glance. All the rest of your design flows from this leading element, introducing your product purpose and aesthetic, so give it some love.
Squarespace tells you what they’re about immediately.
2. Visualize the Value
It doesn’t matter what you’re selling — visuals appeal to people on a fundamental level. So whether it’s a shiny product image or you need a video to explain a more complex offering, don’t skimp out. They should be a logical extension of the headline, clearly illustrating your proposal.
The product is clearly the star of the show at Lily.
This sequential flow can be achieved by using…
3. Whitespace
Don’t give it to the temptation of cramming everything you want to show into a single space — it’ll work completely against you by making users’ eyes glaze over. The folks over at HubSpot contend that landing pages are storytelling devices — use that whitespace to take your visitors by the hand and walk them through your narrative.
Apple’s minimalistic use of whitespace is one of their trademarks.
4. Manipulate Proximity
As Fernando Florez at Landerapp explains, proximity of certain elements can be critical. Arrange your whitespace and elements so that you drive the behavior you want, like calls to action close to compelling visuals; avoid confusion and misdirection with unrelated or contradictory elements near each other.
Source: http://blog.kudobuzz.com/2015/05/27/why-social-proof-is-important-for-your-e-commerce-business/
Confused yet?
5. Stay Above the Fold
While there are different schools of thought on the subject, one thing is certain: most of your visitors have a tiny attention span. Do you really want to waste your time with content they might never see? Or worse, lose out on a customer because the best part was buried way at the bottom? Find a way to make all your key points as soon as possible, no matter how long your page is.
Unbounce keeps key concepts at the top.
6. Convey Visual Trust Signals
You’d be suspicious of a restaurant that didn’t have its health code rating posted prominently, right? Make sure your landing page inspires confidence by making space for high quality customer logos and certification images. It’s not rocket science — sometimes a simple badge with a satisfaction guarantee works wonders.
A little trust goes a long way!
7. Optimize
We mentioned the significance of user attention spans when keeping content above the fold, but what if everything takes such a long time to load that they just give up? Make your page is as fast as possible and you might even hook that one guy using a 10-year-old laptop on a rural dial-up connection.
There’s no single formula for a perfect landing page, and there will always be successful, unorthodox examples that break some or all of these rules.
But if you don’t understand the design and psychology behind a landing page that hooks, retains and converts users, you won’t be able to determine when and how stray from those conventions for stylistic reasons.
The bottom line is that you’ve usually got one shot to grab their attention. Take your time to do it right by applying these concepts. Don’t forget some essential user testing along the way either. Sometimes you’re too attached to your original concept, or maybe it’s a simple matter of taste. Either way, early and frequent feedback will reveal what users don’t understand or can’t use.
So whip out those wireframes and get to work, because if you build it, they will come. Just make sure they know what “it” is and why they need it!
Have any favorite landing pages? Share them in the comments!
About The Author
Eleanor Hecks is the Editor-in-Chief of Designerly Magazine, an online publication dedicated to providing in-depth content from the design and marketing industries. When she's not designing or writing code, you can find her exploring the outdoors with her husband and dog in their RV, burning calories at a local Zumba class, or curled up with a good book with her cats Gem and Cali.
You can find more of Eleanor's work at www.eleanorhecks.com.