The Anatomy of a Perfect Landing Page

http://www.formstack.com/the-anatomy-of-a-perfect-landing-page

by jaybol • 16 years ago

327 56 16 years ago

formstack.com

merraksh• 16 years ago

Is the not-so-impeccable title "Impecabble grammar" there on purpose?

</grammar-nazi>

ph0rque• 16 years ago

They didn't say anything about spelling...

ams6110• 16 years ago

Still qualifies as an example of Bell's Law IYAM

pixelbath• 16 years ago

"...wording should compliment each other." "...for woman and young girls"

Also, they're using two different font weights and different kerning at different points. There is also a superfluous space in one of the bullet points.

The point? Have someone proofread your landing page, too.

ccollins2• 16 years ago

No, this is the anatomy of a perfect landing page:

  <% ab_test('determine_the_best_page_with_numbers_to_back_you_up', ['page1', 'page2']) do |action_name| %>

        render :action => action_name

  <% end %>

(http://www.bingocardcreator.com/abingo)

swombat2• 16 years ago

I don't know why you're being downvoted. This is correct. Landing pages can and should be a/b-tested to the death. If you're gonna a/b-test anything, it's gotta be your landing page!

maxklein• 16 years ago

You know, everyone talks about testing, but I betya almost nobody does it.

ccollins2• 16 years ago

Thanks - maybe downvoted because there is little explanation. So just to clarify:

Many people have an opinion about the perfect landing page based on some narrow experience. See http://www.google.com/search?q=perfect+landing+page for examples. Absorbing these guidelines provides a good starting point for any landing page optimization campaign, but only a starting point.

Claiming you have created a "perfect" landing page is simply wrong. There is no such thing as a perfect landing page. Through rigorous A/B/n & multivariate testing you can identify pages with better conversion rates and discard poor performers. It is also important to note that this optimization is not necessarily transferable to different ad messaging, user segments, products, or conversion goals.

JeffL• 16 years ago

Well, you also have to know what to try. I had a local maximum on my landing page and wasn't getting it any better until I started reading articles like this, and my latest one is 60% better than the old. A/B testing alone isn't always enough.

patio113• 16 years ago

It hadn't occurred to me that A/Bingo could do that. (Swap templates.) Spiffy.

swah2• 16 years ago

I'm confused, aren't you the creator?

limedaring• 16 years ago

Doesn't #10 on the original page mention "Always Be Testing"?

Nothing's wrong with starting out with some great guidelines, and then testing it to death.

tel• 16 years ago

    A short primer in unconstrained, high-dimensional, non-linear 
    global optimization (over time!)

    You can't do it.

So you need more than just testing.

Unconstrained and high-dimensional means that your search space is IMMENSE. Non-linear means that the optimal designs may be arbitrarily twisty, very small, fractaline and chaotic, and, most importantly, unconnected. Temporal dependence means that even if you magically find a good solution, it may fade with time.

Fortunately, we never have to do that because we use an incredible amount of prior design information (craft) to ensure that our search spaces are much smaller. This page provides an overview of that information (and even includes a call to test) which will hopefully put you somewhere in the neighborhood of a useful page and inform you of what direction to go.

If you "just had to test" then there'd be no need for art, science, literature, stock markets, language, thermodynamics, technique, craft, effort. Computers would have already solved everything (not that we would have ever invented them).

My opinion is that testing is vital because it's your only consistent, trust-worthy way to measure your value function (conversion rates). It's how you put a stick in the water to measure depth. That is only one tiny part of a complete solution no matter how important it is.

jcfrei• 16 years ago

A "guideline" to a perfect landing page? That's just wrong. If I could define a perfect landing page, it would be the one which sticks out the most! Crafting it after one guideline just ensures that it will look like all the websites already out there.

pmichaud• 16 years ago

This doesn't make sense. That's a good argument for things that are compared side by side by TV ads, but landing pages don't have to be unique to be effective. The "difference" you're talking about won't be noticed by anyone but other web marketers.

swombat2• 16 years ago

Moreover, this is the anatomy of a landing page. The graphic is there for information, not as a template.

kmfrk• 16 years ago

I thought this was satire, but they sound sincere.

Get a check list to go through and design it however you (and your users) like it. If you're patio11, don't add any social media fluff.

paraschopra2• 16 years ago

I had written a post long back: Landing Page Optimization tips: analysis of 50+ sites to find out what increases sales and conversions http://visualwebsiteoptimizer.com/split-testing-blog/landing...

You may find it a nice complement for the infographic

inovica• 16 years ago

I've just had a read of this and its very good. Thanks for writing it.

jscore• 16 years ago

No, but it's an example of a perfect linkbait.

AndrewWarner• 16 years ago

Unbounce.com has templates that look like that. So does WooThemes.com

qeorge• 16 years ago

Have you had good luck with Unbounce?

I love it in theory, but the interface is kind of janky - specifically, I have lots of trouble with alignment, positioning, and lack of an Undo button.

fbnt• 16 years ago

While I don't think there isn't a single canonical form for a landing page for the obvious reasons, I really appreciated the color-mood pairs at the end of the article.

I'll keep them in mind the next time I'm choosing the colour scheme for a new site.

Plus, now I can see why Facebook is all blueish.

ssharp• 16 years ago

ASK YC: Are there any recommend sites that provide results of A/B tests and maybe show some best practices. There are some good fundamentals here but I'd like to see some concepts backed up by data.

steveklabnik2• 16 years ago

http://www.kalzumeus.com/category/ab-testing/

theycallmemorty• 16 years ago

Its going to be different for every product, market and industry.

joshuacc• 16 years ago

http://www.abtests.com/

Results like these are highly context dependent, so don't expect that if you make the same change you'll necessarily see the same result. But seeing specific examples is great for coming up with test ideas.

paraschopra2• 16 years ago

You can go through our case studies: http://visualwebsiteoptimizer.com/case-studies.php

rmc• 16 years ago

Test everything? :P

phlux• 16 years ago

As an aging user, who has been online every single day for the last 15 years, I disagree.

I think this page is far too cluttered.

I like less and less content on a landing page for anything other than a link aggregation(LA) site (HN/Reddit/etc)

I am at your place (if not said LA site) for a specific reason; get me to that reason asap.

More and more, I have less time and less attention..

pwnguin• 16 years ago

I wonder if their content was determined by A/B testing?

ameyamk• 16 years ago

http://visualwebsiteoptimizer.com/split-testing-blog/landing...

Another great resource to build perfect landing page. Makes great reading to compare these two resources together

chunkbot• 16 years ago

My favorite landing page is the one for Buckyballs (http://www.getbuckyballs.com/). Thanks to it, I'm sure they moved a lot of product on the day Google doodled "buckyball".

bobf• 16 years ago

Aside from the topic of landing pages - BuckyBalls seems like an extremely slimey company. Look up Buckyballs vs. Zen Magnets, or see http://boingboing.net/2010/09/24/buckyballs-magnet-ma.html

PostOnce• 16 years ago

Doesn't seem worse than any other company. I would reserve extremely slimey for companies that fuck their customers over, fucking with your competition is the name of the game ;) Example: http://news.ycombinator.com/item?id=1834976

jsackmann• 16 years ago

Does anyone here have first-hand experience testing w/ the VeriSign seal? The parent link gives an example of a very substantial sales increase thanks to the seal. For $299/year, though, it's a bit beyond the range of "eh, what the hell, I'll give it a try."

vaksel• 16 years ago

add a seal...if it improves conversions pay money...if not you get to save $300

bajsejohannes• 16 years ago

Personally I become more suspicious when I see these images than when they are not there. I only associate it with scammers.

But yeah, probably some real world statistics is better.

You could do the test yourself, and see if people are convinced by the image alone (even though the link only goes to for example the main page of verisign.com). I'm not sure verisign would be too happy about that, though :)

bemmu• 16 years ago

I instantly assumed that improvement quote must be from some study by VeriSign.

kongqiu• 16 years ago

Just a heads-up: Go Daddy sells SSL certs for $50, and they usually throw in a cheap domain: https://www.godaddy.com/ssl/ssl-certificates.aspx

rwhitman• 16 years ago

I don't think its a 'perfect' landing page, but I think its a good framework to start with when designing a new product. And something to point to when working with clients. I'll definitely keep it bookmarked

nico_h• 16 years ago

Interesting basis, but ARGH! I hate these fake infographics.

Why not put the picture just at the top and write their 10 points in html ? They could have linked to their reference in context, the text would be easier to correct, possibly prettier and definitely more accessible. And I could adjust it to a decent font size. Aaaaaaaaaaaargh.

wheaties• 16 years ago

What, no brown? Don't tell me users see that as a big pile of stinky...

Mizza• 16 years ago

Does anybody know where I can buy a template that's similar to this? I've looked on ThemeForest but they all violate some of these rules.

i386• 16 years ago

ThemeForest looks pretty nice. Know of any similar sites?

sgallant• 16 years ago

I find it strange that formstack.com published this but don't use it on their own homepage...maybe they followed item #10 and iterated away from it ;)

swah2• 16 years ago

More like this: an average link but great discussion! How much can the first comments determine the quality of the discussion?

zachinglis• 16 years ago

Apparently Formstack haven't seen this gem entitled "Surprise, surprise! Having no secure icon on a page increased conversions by 400%" http://zachinglis.me/3cpN

noibl• 16 years ago

Maybe if the security badge hadn't been so gigantic and cartoonish, the results would have been different. The conclusion that 'every site is unique and best practices shouldn't be adopted without doing any testing', while intuitively sensible, seems to be a premature reading of the data.

aresant• 16 years ago

You are spot on.

Check this post out - Trust logos almost always provide a lift when used in the proper context / placement ->

http://conversionvoodoo.com/blog/2010/07/proper-placement-of...

JonathanFields• 16 years ago

Solid basic template and core items to focus on. I've also found a lot of value from the free resources and webinar replays on optimization at http://www.marketingexperiments.com/. Lot's of case-studies and examples with specific conversion change percentages.

The Anatomy of a Perfect Landing Page

Related Stories