30+ principles to a better landing page design

heroimage

After hundreds of landing page optimization projects, we wanted to share few of the lessons we learned when creating a successful landing page. We hope that you will find this article helpful. Also, please consider subscribing to our RSS feed or leaving a comment.

There are four basic components to a successful web page design: Research; Design; Copy and Testing and Modification. It is important to devote adequate resources to each component – they form a chain that is only as strong as the weakest link. For instance, if you fail to properly research your audience, then the greatest design will never be able to save the campaign. But it’s not always that easy to balance each, so we’ve compiled a list of 30 design principles for a better, more successful, web page.

butter-2

1. Know Your visitors: Understanding the visitors you are targeting on a particular landing page is one of the most important elements in its success. The problem with understanding visitors is that many developers, designers and marketers talk about it, but very few actually implement it. You must understand the motivations, desires, fears, and concerns these customers have when it comes to your product or service. Only then, you will be able to create a landing page that focuses in its entirety on converting these visitors to customers. It is typical for us to spend anywhere from two to four weeks on understanding visitors during the initial stage of a conversion optimization project.

2. Getting to the roots of your visitor: Below is a brief excerpt of the marketing questionnaire we submit to clients as we begin any conversion optimization project. Answers to these sorts of questions will focus your attention on the details that are critical to your landing page’s success. (Click on the image to view larger version)

table

The topic of customer research is beyond what we cover in this post. The series on persona creation can serve as an excellent starting point to getting to know your customer.

3. The images: Carefully chosen graphics will enhance the design of your landing page. A basic guideline is to use graphics and colors that are similar to, if not the same as, those used in any other promotional creative relating to your page. Changing the graphic approach and/or the color scheme with which your customer has become acquainted can cause confusion and lead the customer to click away.

hero-2

4. Value proposition: A value proposition is very often, misunderstood to be a single stated statement on a website (such as the tagline). However, successful companies are able to transcend their value proposition in the copy, the elements, the overall design of their landing page and campaign, and even the tagline.

The value proposition will help establish trust and gives a sense of congruency throughout the page.

5. Give visitors what they are looking for: You also need to make sure that customers arrive at the exact information they expect. That it is why it is important that your promotions lead visitors to relevant landing pages, and not the home page of your website. With only seconds to keep their attention, you cannot risk losing your customer’s focus by forcing them to search for the information they need from your home page.

6. Consistent message: A landing page’s design should match the related promotional creative as much as possible. If a user clicks on a PPC ad: “10% off lawn mowing service,” they expect to see the same headline on the landing page. If the user clicks on an ad with a blonde model dressed in a red cashmere shirt, they expect to see that same blonde model as they arrive on the landing page.

lp6

7. Remove distractions: Do not crowd your page – keep it simple. Even the ubiquitous navigation bar, found everywhere else on your site, could undo a conversion by providing a means to click away from your page – consider removing standard navigation bar on your landing page.

8. Don’t ask too much of your visitors: The goal is to make the conversion as easy on the customer as possible. Concerning purchases, this may mean not requiring users to register with you, but allowing them to order as a guest. If there are online forms to complete, they should be as quick and easy to fill out. For example, it helps to have the input cursor jump to the next field in the form on its own. In addition, have the fields auto-populate if possible. Focus only on the absolute essentials. Only request the information that is necessary for your purposes. The less time users must spend on your conversion activity, the less time they have to change their mind.

9. Don’t get carried away: Resist the temptation to use the latest web graphic effects merely because they are the latest. Many times, simple is better. The focus of your page needs to be completely on getting visitors to perform the desired action. Using too much technology will distract them, and your message may be lost. Consider also the increased loading time of a page that is multimedia-heavy. Visitors do not want to wait for a page to load.

lp410. Build their trust: It’s always risky to enter into an online transaction with someone you don’t know. People may fear giving you money or their personal information because they do not know you. How can you get potential customers to trust you without ever meeting them? Trust is established through credibility.

11. Privacy: You need to promise your clients that their privacy will be guarded. Make sure your privacy policy is clear and easy to understand, and be sure to direct your customers to this policy. Let them know that you have taken the time to create safeguards for their information. Place a link to your privacy policy, an icon that shows precautions have been taken or a simple statement such as “Your privacy is important to us”, in close proximity to calls to action.

12. Testimonials: Never underestimate the power of a strong, credible testimonial, but be sure they are concise and on point. When your prospects read testimonials from past customers, they will be more likely to feel at ease doing business with you. User testimonials should speak of the benefits of your services and be relevant to your target audience. For a good testimonial, it is preferable to include a full name, location, or even photo of the customer. Video testimonials are even more successful in converting visitors to customers.

13. Satisfaction guaranteed: Can you reassure potential customers that your product or service come with “Satisfaction Guaranteed”? Give your customers a warranty for products, or trial period for services. For example, you can give 30 days to try your product risk-free, and if not satisfied, they can get a full refund. You may also suggest free consultations for new clients to get a feel for your services without spending any money. This will encourage readers to convert because you will have minimized their risks. Make sure visitors to your site can easily see and understand your warranty or satisfaction policy.

security assurances

3p3

30-PRINCIPLES-TO-BETTER-LANDING-PAGE-DESIGN-coverWould like to read the remaining 16 tips? Download the full article when you subscribe to our weekly RSS feed.

Name:
Email:
 
* We will never sell or share your information

If you enjoyed this post, please consider subscribing to our RSS feed to have future articles delivered to your feed reader.

Or, receive weekly updates by email:

Name
Email

{ 75 comments… read them below or add one }

1 Jay Philips July 28, 2009 at 9:09 am

Great list. I agree that web pages should be clean, easy to navigate and the content should be relevant to the site. I’m not a fan of popups at all.

2 mauco July 28, 2009 at 11:10 am

Great post. This is one of the few post that’s really easy to understand and implement by the average website owner. Thanks for the post.

3 Richard Anderson July 29, 2009 at 4:38 am

Re: point 16 – this seems very out of date on two counts. When was this written? Most stats now show the number of users still on 800×600 is between 1-3% for most sites. 1024×756 is now widely accepted as the resolution to design for. Also, when it comes to scrolling, research has shown that most users WILL scroll on the web. Most sites (even those such as Facebook) require vertical scrolling and users are perfectly used to this and expect it. The key thing is to ensure that it is clear in the design that the page continues below the ‘fold’ and what appears above does not look entirely self contained and complete, especially is key material is then missed.

4 busana muslim July 29, 2009 at 8:14 am

nice post about four basic components to a successful web page design: Research; Design; Copy and Testing and Modification. thanks

5 Nick Stamoulis July 29, 2009 at 10:07 am

I think one of the most important items on this list is knowing your customer and audience. When you know your audience inside and out you the rest comes much easier.

6 Dustin July 29, 2009 at 3:29 pm

Thanks for this post it is definitely the most comprehensive post I have to found to help with landing pages!

7 Web Marketing July 30, 2009 at 10:31 am

Great list – especially like the fact you’re first few points focus on the visitor rather than then webpage or the technology — which in my experience is the most common mistake people make — who think their site’s failure to convert is due to web design, when it’s actually due to badly targetted, unqualified traffic landing there in the first place. Dug!

8 Butch August 1, 2009 at 7:37 am

Thanks Hugh, great list, I’ll refer to it often

9 Jorge August 4, 2009 at 9:24 am

Great list!

There’s one item I’m not so sure about: Screen Resolution. According to several stats I’ve seen before, 640×480 is now completely gone, and 800×600 is around 4%: http://www.w3schools.com/browsers/browsers_display.asp

In my experience, building 1024×768 landing pages has converted better since I can put more elements above the fold.

Keep up with the good work!
Cheers!

10 Tim Piele August 5, 2009 at 4:40 am

Great article. #9 is important – simple, clean and elegant designs will go much further with your visitors than waiting for a flash page to load. Plus, Google cannot catalog flash content. Honest and organic placement of keywords will help with Google, whereas forcing them triggers red flags with the search engine bots. Keep it simple, keep it clean, keep it consistent.

11 James Lamb August 5, 2009 at 2:38 pm

“A good testimonial is preferable to include a full name, location, or even photo of the customer.”
What does this mean please?
“A good testimonial is preferable to including a full name…” or “For a good testimonial it is preferable to include a full name, location, or even photo of the customer.”

12 Andrew Brundle August 5, 2009 at 5:47 pm

The guy who posted just before me makes his point in style.

One of the most important things is that the content is spell-checked and grammatical.

13 khalid August 5, 2009 at 6:29 pm

@James Lamb
thank you for catching this. I will fix it.

14 Andrew Hansen August 6, 2009 at 4:20 pm

That is one heck of a post sir. You could have charged money for that!

There’s too much focus on “generating” traffic in web marketing and not enough of this stuff on how to make sure the traffic turns into revenue.

Glad I found your blog!

Andrew

15 Get Rid of Warts August 11, 2009 at 8:50 pm

This is a very valuable resource that many people can gain profitable results from.

I agree with Andrew that you could have charged for this. However, I am grateful that you did not, as I believe that I will benefit from your timely advice.

Even following just one or two of your suggestions could greatly improve the conversion of a site. Imagine if one followed them all?

Thanks to Andrew for pointing out your blog. I am appreciative of your input.

Kind regards,

Barry

16 Blume August 13, 2009 at 11:24 am

Excellent article, thank you.

17 gentle September 5, 2009 at 2:46 pm

I have to design my first landing pages and this post is very useful. Thanks!

18 Emma September 10, 2009 at 9:12 pm

Thanks for a great article and website, definitely going to follow you!

19 Charlie October 14, 2009 at 8:16 am

Very informative, thank you for posting. It is all pretty basic stuff which we all need to be reminded of every now and then ;)

20 Greg October 14, 2009 at 12:57 pm

Regarding item #16 – please don’t forget the rapidly-growing segment of netbooks which have a typical screen resolution of 1024×600. Additionally, one of my main gripes is how most website designers seem to assume everyone’s got the traditional 4:3 screen ration and therefore “waste” a good portion of the top of the screen with white space. Yes, I realize it can look ‘tres cool’ but most entry-level laptops are sold with the 16:10 ratio now (typically 1280×800) so *vertical* space is at a premium. Bottom-line: DO NOT waste vertical space – the essence of the site should be discernible on a 1280×800 screen (subtracting typical values for the browser and OS widgets) without scrolling.

21 rex de lumban November 19, 2009 at 10:08 pm

This article is very good, lots of people may get ideas from it.

22 Weber | link building services December 13, 2009 at 10:34 pm

The article is impressive. I will add this tips from all those that you’ve given in your previous article. To make your page more accessible to everyone, first you must understand the visitors you are targeting on a particular landing page. It should be the first step, it will be your guide as you go along improving your page.

23 Rick - vinoun.com December 27, 2009 at 12:17 am

This is the kind of article that make you think of the things that you did with your website, especially landing pages. Thanks for providing this list. Really helpful.

24 Murtaza Imran December 27, 2009 at 1:52 am

Amazing read!

These guidelines are not only practical for any landing page but are also pure marketing concepts.

I doubt any landing page would be unsuccessful if they consider having these in them.

25 Russell william February 4, 2010 at 6:25 am

The more text i am reading about landing page design i get more confuse. Some landing page designing company says simple graphics can make a differance some says complex graphics can make a diference of conversion. Are there any hard and fast rules for designing landing pages?

26 Rex Dixon February 11, 2010 at 12:38 pm

Be sure to follow us on twitter @Performable and @abtests – we’d love to hear your feedback(s)!

27 Kristina Allen February 12, 2010 at 4:27 pm

Great list of tips, couldn’t agree more with the principles you chose.

-Kristina, @ion_interactive

28 Kyle February 15, 2010 at 5:08 pm

good stuff thanks!

29 Havi February 24, 2010 at 8:37 am

Great summary! Thank you!

30 Adam March 8, 2010 at 4:19 pm

Not very much of a discovery but a nice reminder indeed:)

31 Immobilien Bremerhaven March 17, 2010 at 2:17 pm

Great Infos! Thank you! Regards from germany!

32 Local SEO Company March 31, 2010 at 11:01 pm

I think the worst thing most websites do is over clutter their landing pages with no call to action.

Great points!

33 Anzum April 18, 2010 at 5:13 am

Really a good piece of writing.
It is very important to consider the homepage so that the visitor finds it interesting and this will certainly increase the time spent and the returning number of visitors

34 MedicareAndMedicaidServices May 21, 2010 at 11:54 am

Great list !! many points worth using especially the “testimonials” point. Thanks for sharing them.

35 machbio May 26, 2010 at 9:07 am

great list.. came from envato site.. thanks

36 webverzeichnis June 3, 2010 at 7:55 am

Interessanter Artikel und nützliche Tipps

37 web design June 6, 2010 at 4:10 am

Thanks for the tips, this comes in handy for me, just got a client asking for landing page design.

38 busana muslim June 8, 2010 at 12:00 am

Good article, landing page the most important if you want sell a product

39 Web Design June 19, 2010 at 7:17 pm

Hiya,
You are definitely a skilled writer. You definitely know how to write to keep the audience engaged.
Cheers

40 UK Sex shop July 6, 2010 at 2:59 pm

Thanks for a great article, will start with landing page advice.

41 Parker Converse July 30, 2010 at 6:09 am

Good article but I’m trying to translate some of the basic points to my situation where the products I sell are very high priced ($5,000 – $30,000). Pricing is not listed on the landing page (I use strong images to capture attention), I employ testimonials site-wide, but as I look back over my site stats I see that the most frequent exit page is the price page. Any ideas for someone in my situation?

42 David August 20, 2010 at 4:02 pm

Nice, useful list. Thanks!

Also, wanted to mention we just launched a gallery for well-designed landing pages and thought your readers might be interested – http://landing-page-gallery.com

Let us know what you think. Would love to hear anyone’s thoughts.

Thanks,
David

43 spirulina November 15, 2010 at 10:25 pm

Great tips, thanks for sharing. Any tips on measuring a good landing page? What I mean is how do we measure how successful is our landing page.

44 L Glutamine Supplement December 6, 2010 at 10:53 pm

Your articles are really good, I bookmarked it on Blogger for you!

45 Isidro Macugay December 15, 2010 at 6:41 am

Thanks for the post. If you don’t mind my asking, what blog theme are you using? Is it available Free or is it a custom design? Thanks.

46 Paulo December 15, 2010 at 6:44 am

Use sharp pics, use a nice call to action button, get your call to action on the left, display info above the fold, don’t go black pages, don;t use flash at least with 1 million fade in fade out effects, when the page load should everything be there…

47 cheap sexy lingerie January 1, 2011 at 11:11 pm

Thanks my friend for this really great information. iam happy to hear about this reality

48 Nick January 13, 2011 at 4:46 pm

Great list. Thanks for sharing it.

49 Busana Muslim January 15, 2011 at 6:46 am

This is my first opportunity to visit this website. I found some interesting things and I will apply to the development of my blog. thanks for sharing useful information

50 Haji Umroh February 18, 2011 at 3:47 am

i like it, useful info, thanks a lot

Leave a Comment

{ 38 trackbacks }

Next post: