In this post Carlos and myself (Oli) are going to analyze one of our customers – Vinoetic.com – landing pages (after they opted to allow us to get our opinionated hands on it). Our goal is for it to be an educational exercise that can hopefully help improve the page, but let’s have a little fun too, shall we? We’ll be scoring each point in our discussion with + or – points to arrive at a total score and we’ll be arguing on certain points to show that everyone has a different opinion – which shows the importance of testing.

Warning for the creator of the page: There are going to be some criticisms, but our goal is for this to be useful to you so that you can have a more successful campaign in the future.

Let the battle commence!

1. The Main Headline

2. The Call to Action (CTA)

3. Personas (who is this product/service for?)

4. Big Background Image

5. What is the purpose of this page?

6. Explain your benefits

7. What am signing up for?

8. Interaction

9. Privacy Policy

10. Is this a Landing Page or a Microsite?

Oli’s Final Score: -4 I guess I’m more of a hardass.
Carlos’ Final Score: -3

Sorry! We do genuinely hope that the discussion helps you and others when thinking about your landing pages.

Btw. If any readers think we missed something – it would be awesome if you added it to the comments.

– Oli Gardner & Carlos Del Rio

Usually we celebrate the awesomeness of landing page design. But today we’re taking a stroll down scary street to look at some examples of how it shouldn’t be done. I apologize in advance if anyone takes offense – but really, your pages scared me!

Note: The majority of these pages were found by clicking on paid search ads, and most of them should really be using standalone landing pages specific to the promotion, rather than a homepage. I’ll give a couple of quick comments on each below the images. Yikers!! I’ll try not to be mean, but it’s scary out there.

If you do find yourself getting frightened, you can see some good examples of landing pages here.

1. I think my eyes are bleeding

Tips

Hire an effin designer. Stat… You’re business is clearly worth it in a monetary sense, so present yourself accordingly on the web. And please show some before and after examples of hair replacement. We may not believe you, but we certainly expect it.

2. That reset button is what I’d click

Tips

Unlock the potential for what? Living in a cul-de-sac in a Florida gated community? Be a little more specific about what the purpose of the page and offering is.

3. Sugar hermaphrodites?

Tips

I get that the hot women are there to help sell the idea (to the men) of using money to “get what you want”. But still, throw in a few statements of what the “service” provides. You’ll get more conversions if people know what to expect And maybe add a little class. #JustSayin.

4. Get a job!

Tips

Just looks like a curated site of scams. So yeah, my advice is to get a real job. Sorry.

5. The internet makes money for you!

Tips

Building a site that has the potential for someone to become a “member” does zero for your chance at making money. You still need a business plan/idea. The design is all over the place here and rife with cheap stock imagery. If you want people to sign up to build sites through your service, show them some examples/previews to get them excited.

6. Arrrrg navigation!

Tips

Landing pages shouldn’t have navigation on them! If you’re paying for ads then you should be thinking in terms of campaigns and promotions – so keep your landing pages focused on those single objectives. This is lazy advertising. People will just wander all over the place with those 450 links and never achieve your conversion goals.

7. War and Peace

Tips

To quote Steve Krug – “Take your copy, cut it in half and remove 50% of what’s left”. JASON! We need your knife again.

8. Waterproof phones only

Tips

Goggles? Wetsuit? Rake? Scuba gear? That’s all I’ve got.

9. Where’s the value proposition?

Tips

This page looks like Vegas. Waaaaay too much to do! I’ll say it again. Keep it simple, focused and use one landing page for each product. Sales will cometh. Promise.

10. These are not the droids you’re looking for

Tips

This is just dumb. If you don’t “know” that you have something in stock, don’t pay to advertise it!

11. Doctor’s waiting room?

Tips

WTF. This is like a 1996 flash splash page. Just load the site already. Don’t make me wait. Slow sites lower conversions. Don’t believe me? Read abut how faster sites convert better here.

12. Is this for kids making money?

Tips

I hit the back button the moment I saw this site. Then I came back to look at it for this post. It’s beyond confusing. First off, I’d remove the banner looking thing at the top of the page as it looks like an advert which will make people gloss over it. And it has the most important info in it! What the site is actually about.

13. Who eats electronics to lose weight?

Tips

Stop bidding on irrelevant keywords…..

Scared yet? If you’re cowering under a blanket, you might want to check out these great landing page examples for some comfort. And if you’ve seen some shockers on your travels, please share them in the comments – we can all learn something from looking at bad examples.

– Oli Gardner

A professionally designed landing page can improve your conversion rates.

This post is all about showcasing awesome landing pages, to give you some inspiration for your next design. It’s worth stating that no page is ever perfect – or conversely, every page can be better. With this in mind, we’ll be offering perspective on what makes each page special or interesting, while providing some insight into what we would try out in an A/B test experiment to optimize for higher conversions.

But what is it that makes a landing page design effective?

There are many factors, but the principle reasons are an adherence to the fundamental rules of conversion centered design:

• Use a clear and concise value statement so visitors understand the purpose of the page immediately
• Focus the whole page on a single message, with a single primary call to action (CTA)
• Use conversion design rules to make your CTA stand out (whitespace, color, contrast, directional cues)
• When using a form to collect data, balance the amount of information requested with the perceived value of the item being given in return (report, eBook etc.)
• Use modal dialogs for supplementary information (terms & conditions, privacy policy, product details) as opposed to sending them to your website (which removes them from your intended conversion path)
• And many more that I’ll get into in the examples below…

Note: All of these landing pages were built using the Unbounce Landing Page Platform – huzzah! A big thanks to customers that consented to have their pages showcased here. Enjoy!

For this post we’re going to do something different. We’ll have 2 people to critique the pages. Oli Gardner will do some and Carlos Del Rio the others.

1. Manpacks – Seduction Oriented Design

Critiqued by: Oli

What I like

• It’s sexy: Predictable response? Yes, absolutely. That’s the whole point.
• Validation: They jump right into showing off the famous publications that have featured their company. From a design perspective, the grey monotone prevents a mishmash of colour creating any visual distraction from the call to action (CTA).
• Value propositions: The main content on the page answers two simple questions: “What is it?” and “Why should I care?”
• Testimonials: The second is one of the funniest I’ve read. Socks as a Service – genius.
• Removal of doubt: The subtext below the CTA lowers the perceived risk, which can improve the click-through-rate (CTR).

Things I’d change or test

• Tagline: To make it more immediately clear what the purpose of the page is, I’d add a succinct tagline beside the logo.
• Main title (core value proposition): There are a couple of ways to use a headline: A) use a very clear statement of what you are offering to enable an understanding of the purpose of your page, or B) entice your visitor to want to keep reading by using a seductive headline. They’ve gone with B here, presumably in an attempt to catch your attention and increase curiosity (or to push a particular button). For a test, I’d try approach A and make it really clear from the get go – what Manpacks is (this would work really well with the tagline to help pass a five second test).

Site*: www.Manpacks.com

The example below shows an alternate page they created, presumably to speak to a different segment or create a different emotional trigger.

2. FluidSurveys – Kings of Contrast

Critiqued by: Oli

What I like

• Clear value proposition: The headline is very simple and leaves no doubt about the purpose of the page and the product. And it’s nicely backed up by a well written explanation of some of the core benefits directly below.
• Highlighted testimonial: The brushed highlight of the testimonial gives it a bit of extra design zing and prevents the page from feeling too text heavy.
• Contrast: They chose two nicely contrasting colors to highlight important elements. The free label, and the form CTA.
• Context of use: Their choice of imagery lets you know that the product can produce mobile-ready polls.
• Validation: Like the example above, they provide a strong sense of trust by including a set of logos.
• They’re Canadian! Woot!

Things I’d change or test

• Remove the footer navigation: Any extraneous navigation on a landing page can lead your visitors down the wrong path. I’d recommend removing the footer nav to simplify the available choices.
• Explain the logos: Add a small label (like example #1) to explain that they are client logos (or sites that have featured/written about them).

Site*: FluidSurveys.com

3. Golden Sands – Selling Me Softly

Critiqued by: Oli

What I like

• Experience: It immediately makes me want to go on holiday and stay in a pimp hotel. The pillows are literally selling me softly.
• Price: Travel is very much about price, and they get that out of the way right off the bat, so you can move on to the finder details after unerstanding if you can afford it or not. #smrt
• Endorsement: The Trip Advisor certificate of excellence let’s you know that a recognized authority has validated the company.

Things I’d change or test

• The form header: Apply now? For what? It’s unclear what you’re applying for – I thought it was a booking site, but apparently I have to apply for something. Make it clear why people are filling out your form.
• Primary value proposition: There’s no clear statement of what the page is for or what you’ll get. I’d try moving the hotel logos from the top and adding in a strong statement that
• Testimonials: The testimonials shown are anonymous which reduces their impact (as they could have been made up). Always ask permission to use a testimonial and include the name of the person providing it for extra trust points.
• Exclusive: There is a mention of an exclusive preview invitation, but it doesn’t explain what you’re being invited to. I’d also make this stand out more if it’s an important selling point – perhaps using some visual cues to draw the viewers eye.

Site*: GoldenSandsExperience.com

4. The Sharp Firm – A Consistent CTA

Critiqued by: Oli

What I like

• Consistent CTA’s: the Calls to action on this page are matched in two ways. They have the same message and the same color to let you know which areas to pay attention to. Bonus points for not saying “Submit” on the form button.
• Use of video: There are two videos that help build an honest and open dialog with visitors right off the bat. First you get to hear from the company and then they use real video testimonials from clients – much more effective than written quotes.
• Clarity: No company wants to be contacted about something they don’t do. By listing the services they offer they ensure the right people will get in touch.

Things I’d change or test

Honesty, this page is great – I’d change very little.

• Purpose of contact: I wouldn’t normally advocate making a form longer. But it might be helpful to add a dropdown list containing the purpose of the enqiry. This would help from a reporting angle (letting you gauge the needs of your prospects in a simpler manner).

Site*: SharpFirm.com
Designed by: http://www.nuartisan.net

5. GreenLighted – Superfresh

Critiqued by: Oli

What I like

• It looks awesome! Yeah, I know ugly pages convert great too, but the design here makes me want to stare at it and find out what they’re all about.
• Visual chunking: The page is broken up very well vertically, aiding the consumption of information.

Things I’d change or test

• What is it? I get a rough sense of what the purpose of the company is, but I wouldn’t mind a more detailed description. To prevent the extra copy cluttering the page, it could be opened in a lightbox. Better yet, add a video explaining what it is, how it works and why you should register.
• Who’s it for? Make it clearer what the demographic of intended customers is. If I don’t think/know it’s for me I won’t sign up.
• Post conversion social sharing: There’s value in being able to check out the company in it’s social channels – especially when it’s new. However, it would be worth trying moving them to the form confirmation page, so that you’re asking someone who’s already interested in your company, to share your story.

Site*: Greenlighted.com

6. Cheezburger – I Can Has be Funny?

Critiqued by: Oli

What I like

• Cheezburgers!!!!! Actually, I hate real cheeseburgers (can’t eat cheese – waaa waaa waaa). Aside from that, I just think it’s awesome that the Cheezburger family is using Unbounce.
• Content chunking: Like the previous example, the page is broken down vertically in a way that makes it easy to digest. They aid getting you back to the top (as it’s a long page) with the classic ^top links at the end of each section.
• Strong clarity in the value proposition: The headline is simple and inviting and the secondary block of content and CTA explain in simple terms that you can create a free site.
• Repeated CTA: This is a must have for a long landing page. Here they repeat the CTA (the yellow button) in 3 of the sections to keep enticing you to sign up (this is smart as you don’t know which piece of content will trigger the sign-up response and having a CTA right there will aid conversions.

Lolcats!!!!!

Things I’d change or test

Nada.

Site*: Cheezburger.com

7. ReadItForMe – Show me the CTA

Critiqued by: Oli

What I like

• Major endorsements: Having testimonials from a big names like Zappos and top business author Daniel Pink gives you instant credibility.
• Good use of the highlighter: Some old-school sales letters really overdo the yellow highlighter pen – but here it’s really useful at bringing some of their core benefits to your attention.
• Design break: Although a little ways down the page – the extended stripe stops you in your tracks (next to the boot print – yup, that’s a pun) and brings the subscription CTA to your attention. This type of break in the design is an excellent way to increase attraction.

Things I’d change or test

• Move the stripe up: Put the form above the fold.
• Book list: Have a PDF (or other format) with a full list of the currently available books to give people a reason to register – and put it right near the form.

Site*: Get.ReadItFor.me/Launch

8. Smart Rewards – Clean, Fresh & Simple

Critiqued by: Oli

What I like

• Descriptive tagline: The tagline beside the logo makes it very clear what the concept is.
• Clean design: The use of whitespace makes the page very easy to read.
• One very clear CTA: It’s really obvious what you need to do and the use of contrast shows you within a second where it is.

Things I’d change or test

• Privacy policy: You should always include a privacy policy when asking for an email address. Especially when doing Google AdWords as they can sometimes ban your account if you don’t have one. Stick it right next to the email field with an anti-spam statement.
• Bullets: there is a lot of text – try breaking it up with some sub-headers or a few bullet points explaining the core benefits.

Site*: ShareAndTell.com

9. Crikey! – Driven by the Benefits

Critiqued by: Oli

What I like

• Starts with a bang: Crikey is right! The big bold headline tells you right away that you’re getting a free trial, helping to increase the no-risk factor.
• Simplicity: The secondary headline spells out what you’ll get and the 3 bullet benefits are crystal clear.
• Social proof: The testimonials (one from a big name) let you know it’s probably worthwhile.

Things I’d change or test

• Price: One barrier is the lack of a price. If you’re going to hide the cost (after the trial) – I’d throw a trust statement near the sign-up form that states that you can cancel at any time etc.
• Privacy policy: As in the example above, I’d link to a lightbox page containing your privacy policy and place it in the form area.

Site*: Crikey.com.au

10. Echodemic – Selling a Promise

Critiqued by: Oli

What I like

• Opening statement: The opening sentence describes their offering perfectly and succinctly.
• Social proof: The decent sized Facebook following lends credibility to their appeal and the fact that they understand how to build a following which is what they are selling.
• Honesty: It tells you the cost, so you can weigh up the potential value associated with extending your brand reach.
• Clear contact method: The big phone number increases the trust factors by letting you know there are real people to deal with. This will also help with being able to assess the time, number of fans (what demographic they are) and value that you’ll get for your spend.

Things I’d change or test

• Move the form: Stick the form above the brand logos.
• How are the logos connected: Are they just hotel names to help you understand the point of the page? Or are they existing customers? Make this clear with a title if they are customers.

Site*: Echodemic.com

11. H. Bloom – Pro”Fresh”ional Repetition

Critiqued by: Oli

What I like

• Repetition of CTA: Being a long page they are using the smart practice of repeating the CTA throughout.
• Teaser: The low price with free shipping placed next to the CTA is a nice way to encourage a click-through.
• Sectional: Each section of the site is almost like it’s own mini landing page, with titling, a purpose, a CTA and plenty of social proof with customer and press mention logos.

Things I’d change or test

• Short version: I really like the current version, but it would be interesting to see just the top section used on it’s own.

Site*: HBloom.com

12. Wistia – Content Marketing Done Right

Critiqued by: Oli

What I like

• It’s all about the benefits: They do a great job of selling you on the reasons for entering your email.
• The size of the prize: In this case they are giving a ton away in exchange for only one form field – this is a very good deal.

Things I’d change or test

• Clearer headline: The whole point is to receive a guide to video marketing, but with the funky title design, it’s hard to read and the word guide gets kinda lost.
• Privacy policy: If you’ve been reading thus far you know the scoop.
• Preview: Build extra trust and incentive by showing a short preview of one of the videos.

Site*: Wistia.com

13. Zipongo – Fresh Food!

Critiqued by: Oli

What I like

• Freshness: The design (photography, cleanliness and color palette) really exemplify freshness here
• Massive CTA: What should you do on this page? Dead obvious right? As it should be.
• Big clear benefit: The 50-90% off makes it clear why you should care.

Things I’d change or test

• Title: Use the word food! Make it super obvious.
• Unbounce: Send us some free fresh food! :)

Site*: Zipongo.com

14. Tapptics – Emphasizing Design

Critiqued by: Oli

What I like

• Eating your own dog food: The offering here is all about design, and what better way to sell yourself than with a beautiful design.
• Sense of urgency: Using the classic “limited time offer” can increase the feeling of urgency and hence conversions. And everyone loves a deal.
• Full disclosure: The entire contents of the design kit are shown so you know exactly what you’re getting. No smoke ‘n’ mirrors here.
• It’s personal: By including a family photo of the designer it gains a more human feeling which can increase trust.
• Includes a video: (The stick figure). Demoing what you’ll get.
• Live chat: You can chat directly with Jen which is a great way to get questions answered (which can be fed back into an A/B test once you know where confusion/hesitation lies).

Things I’d change or test

• Chat position: I’d put the live chat widget right at the point of conversion – so that anyone hesitant to click to buy, has a support channel right there.

Site*: Tapptics.com

15. Tube Mogul – Start Here

Critiqued by: Oli

What I like

• Directional cues: The use of arrows guides people through how they should interact with your page.
• Trust: Customer logos let you know they have a solid product.
• Showing features: Screenshots help show what you’ll get.

Things I’d change or test

• Video! When offering a video solution, you should really be using a video to demonstrate what your product is about. Tsk, tsk.
• Button copy: Make it very explicit. What exactly are you downloading? The only way to know is to read the small text at the top of the form area. Repeat this clearly on the button

Site*: TubeMogul.com

16. Startup Weekend – Newsletter Signup

Critiqued by: Carlos

What I like

• Clean: This is very easy to read. The white background with orange headers and black body text stands out easily and the action is easy to see.
• Emphasis: Startup Weekend clearly got the memo that bold is a good way to draw attention to important information.
• Proof: Existing companies that started at a Startup Weekend.

Things I’d change or test

• Leverage Lists: Too much of a good thing is a bad thing; the first paragraph has too much bold. That first paragraph is probably better off as a list. If you step back from the content you can see that the bold is overpowering.

Site*: StartupWeekend.org

17. Video Storytelling – eBook Download

Critiqued by: Carlos

What I like

• Straight to The Point: The title is informative and leads directly to the action.
• What’s the Value: It is important to state what your give away is worth. If you are giving something for free people don’t necessarily think about how much it would cost them to buy the thing you are giving.
• Function: About the eBook has a concise description of what the book contains, now the visitor knows what they are going to get.

Things I’d change or test

• Order: I would definitely test having Written by appear directly below the action. That makes the eBook more important than the authors, but still offers up the authors as a trust factor at the action point.
• Benefits: How does this benefit the visitor. Try making Create Video the Right Way more about how to connect to the people watching, or what feelings the non-profit needs to produce. Non-profits in particular rely on emotional and human connections, if you are trying to speak to them you should have some human benefits attached.
• 1-2 Punch: I would test making this page even shorter. Instead of three rows make the second row two columns: one with function, one with benefits.

Site*: Causevox.com

18. Huli Health – Process Explained

Critiqued by: Carlos

What I like

• Count it Off: Good use of numbers. This page makes it very clear what the process looks like.
• Major Media: The references to major media coverage is a powerful trust factor.
• Match Game: Content and images are very well aligned here. Search, Dentists, Scheduling, Traveling, and Review are all clearly expressed.

Things I’d change or test

• Order: I would definitely test having the ordered list above the action.
• Trust and Action: I would also test putting the major media logos directly before asking for the action. Showing the visitor you are trustworthy and legitimate before asking them to do anything is a good way to maximize your response rate.

Site*: HuliHealth.com

19. Blabcake – Setting the Stage

Critiqued by: Carlos

What I like

• Simple: Clear headline telling the reader where they are.
• Good Button: The action is tied to the desire to be notified when the launch happens.
• Support: This is a good second call to action. Usually I avoid second calls, but this is an appropriate use of social out links to let the person decide how they want the notification to come.
• Oli: I just love the visual design of this page – as a coming soon page, the stage curtains opening remind me of my dad’s theatre. I have a lot of respect for companies that begin their journey with a conscious desire to provide excellence through multiple channels (design, UX, usability) – all of which ultimately lead to conversion.

Things I’d change or test

• Text: The sub-headings all beg the question: “How?” Try using some description of the function that accompanies the benefit described in the sub-headings.
• Icons: The magic icon is spot on. The other two are a good chance to test different ways to express your future plans. Try showing characters using the appropriate devices, or acting out things related to using the product.
• Sharing: Test a secondary call to send this page to a friend, or share on Twitter or Facebook, instead of just following (more action oriented than passive).

Site*: BlabCake.com

20. Polytown – A Guided Experience

Critiqued by: Carlos

What I like

• Fast: A pre-order, a deal, and an action all in the first foreground element.
• Time: The deal is time dependent, that adds some urgency.
• To the Point: Each element literally points to the next step.

Things I’d change or test

• Closing: I would try switching the actions so that buying action is at the top and the signup for a Free version is at the bottom – to give more weight to the commerce portion.

Site*: Polytown.co.li

21. Demandforce – Marketing Tour

Critiqued by: Carlos & Oli

What I like

• As see on!: Right at the top is a testimonial that describes a benefit and associates the product with a third-party authority, and then backs it up with a great quote from the cpmpany showing how it made them extra money (who doesn’t like that!?) – donations taken at Unbounce.com/olis-poor/ – They even have an Amazon review :)
• Market share: they already seem to have a 30% market share – invest.
• Demonstrate: Love the images that show what the emails and texts look like.

Things I’d change or test

• Big Form: There are only two required fields, don’t make a visitor feel like they are taking on a long labor to get information. Scale back to just name and phone number. And don’t start the conversation with “Fill in this form. That’s the equivalent of walking into The Gap and being told to try on clothes and then buy them (yeah right, like they fit well).” Seduce, or even coerce, but don’t instruct.
• Call to action: The visitor isn’t really looking to sign up, they probably will respond more to “Request Tour” or “Get Started”.
• Footer: The links in the footer, other than Privacy, are just distractions. Get rid of as many leaks as possible to keep conversion high.

Site*: Demandforce.com

22. Adzerk – Green for Go

Critiqued by: Carlos

What I like

• Classic Presentation: Blue and white is a classic business related color scheme.
• Tell them and tell them again: The page opens and closes with the same challenge (16 second sign-up).
• Iconic: Good use of icons, they help make the content bite sized.

Things I’d change or test

• Important Buttons: the button colors are too similar in color range to the blue. If you want your buttons to pop you need them to contrast with the main theme color.
• Benefits: I was most of the way through the page before I could answer the questions about why I would want this. Try moving your benefits, like 5¢ CPM, up near the first CTA button.

Site*: Adzerk.com

23. Boost Your Search – Free Audit

Critiqued by: Carlos

What I like

• ROBOTS: We like robots.
• Make Something Important: Good visual language on the pricing. There is a clear visual communication of which one is the best option.
• Show me the numbers: Nice use of statistics and clear communication of cost.

Things I’d change or test

• Back it up: Cite the sources (Statistics and Testimonial) show that you didn’t just make them up to get the sale.
• Stick to your guns: Choose one action and stick with it. In cases like this the e-mail lead is not nearly as valuable as the customer.
• Make Two Pages: Differentiate the action Free audit and Paid Plan into separate landing pages so you can segment the traffic from channels like PPC.

24. Knovio – No Talent Required

Critiqued by: Carlos

What I like

• Big Buttons: The buttons are bold.
• Clear Value: The bullets have clear indications of the value.
• Video: The use of video to demonstrate video is spot on and the video title is informative even if you don’t watchit.

Things I’d change or test

• Choose your fight: There are six actions on this page–three social and three button CTAs. There are so many great elements on this page, instead of having the “take a tour” button try having the tour be the video element.
• Keep it Simple: Reduce the number of potential actions. Even though this is a tool built on a more robust software let this page get people into the free version and use other pages to upgrade the user.

Site*: Knovio.com

25. Oil & Gas Investing – Form Focused

Critiqued by: Carlos

What I like

• Right to the Point: The action is right at the top.
• Supporting Action: Supportive secondary call, call us or download. I am usually against secondary calls, but since this is a big ticket item the phone may be more important.
• Scannable: Clear sub-headings make it easy to understand without having to read every piece of text.

Things I’d change or test

• Mis-match: The Oil & Gas Industry block has a visual mis-match; none of those are oil or gas related. Change the images or the headline.
• Close Strong: Test a CTA at the bottom too. Which ever is the primary action, probably the phone number.

Site*: USOilInvestments.info

26. Menucopia – Pre-launch Done Right

Critiqued by: Carlos

What I like

• Iconic: Great icon to start. If that matches your social media avatar you get bonus points.
• Minimalist: Simple open designs give your content room to breathe.
• One and Done: One simple action; I think I love you Menucopia.

Things I’d change or test

• Call to Action: That button needs a more compelling action: Join, Get on the List, Be First. Your call to action should be from the perspective of the user and you should be able to add “I want to” before the button’s text.
• Social Proof: Test social logos in the benefits section. Don’t just tell people you integrate social, show them the logos.
• More Contrast: The blue text should be darker for better readability, and the button text should be bolder.

Site*: Signup.Menucopia.com

27. Eureka Report – With Bonus Gift

Critiqued by: Carlos

What I like

• Red, White & Black: The color scheme is classic and trustworthy; this is clearly business oriented.
• Bam, CTA: The CTA is descriptive, value based, and right at the beginning.
• Images Match: Messaging and imaging are well matched, Time magazine.

Things I’d change or test

• Wait What: The product, Eureka Report, is overpowered by the incentive. Am I getting the Eureka Report or Time Magazine. Fix the hierarchy so it’s clear what the purpose of the page is. Try switching the positioning of the 10 reasons block and the form block.
• Top X: As popular as Top 10s are smaller lists are punchier and more memorable. Try 5 or 7 that will give you a littler more space to play with too!
• Incentive Placement: Test having the “Ends Midnight” next to the form in place of the clock. Remind them right as they are taking action why they are doing it now.

Site*: EurekaReport.com.au

Design Showcase – Digital Telepathy

The remainder of the examples shown have been designed by our premium design partner, Digital Telepathy. First up is the page that showcases their IMPRESS landing page & banner design service and then a series of pages they’ve designed for Unbounce customers.

28. IMPRESS Landing Page Design

Critiqued by: Oli

What I like

• Contemporary design: They mix beautiful modern design with modern navigational interaction. Instead of a microsite, the nav does a scroll further down the page to the next section.
• Separated landing pages: Each section (or internal page) acts like it’s own landing page with a strong title, beautifully designed description of it’s purpose and a call to action.
• Endorsements from big names: Famous names in the industry are used to provide evidence that they are capable of quality work.

Things I’d change or test

• Hard to find the navigation: The navigation to take you to the next section is hidden on the left side of the page and can be easily missed – leaving the visitor not knowing to scroll down. I’d prefer to see a traditional top navigation that does the same smooth scroll effect to each section with a “back to top” link to reconnect to the header area.

Site*: IMPRESS

29. SlideDeck Pro

Critiqued by: Oli

What I like

• The title: Great at describing the demographic – designers. It’s clear if you are a designer, you’re in the right place.
• Descriptive CTA: The button describes what you’ll get and how much it costs you.
• Demo: They have a great modal demo of what a slidebar is to show you in context what you are buying – BIG plus points.
• Features: The page breaks down the feature set really simply
• Customers: An impressive set of customer logos completes the evidence that they are good at what they do.

Things I’d change or test

• What’s a slider: The best slider, but is it a mini burger or a Javascript thingymajig? You decide? (if you clicked the demo button this is moot).

Site*: Slidedeck.com

30. Retargeter

Critiqued by: Oli

What I like

• Headline highlghting: the black background with white text come over as a great exercise in contrast based design to highlight the headline and get the purpose of the page across quickly.
• Choice of contact method: Not everyone is new school – especially larger companies. So phone numbers can be fast effective ways to get in contact with people. they combine the main CTa with the secondary phone CTA well in the header.
• Good testimonials: Photos, names and links add credibility.

Things I’d change or test

• Pick your conversion goal: the main problem with this page is that there is a click-through CTA at the top and a form below. Which is the intended conversion goal? Chances are most will click the button at the top out of curiosity, but this isn’t a true reflection of conversion or real intent. I’d stick the form up top and remove the buttton – or vice versa – test, test, test.

Site*: Retargeter.com

31. PetAmberAlert – Literal Design

Critiqued by: Oli

What I like

• Heartstrings! The title alone cuts you to the bone (pun intended).
• Best CTA of the day: Find your pet now is such a strong call to action to anyone in this situation. Demographic gold.
• Heartstrings #2: “There is a 77% chance that your pet will be seen by someone who received our Pet Amber Alert via:” – come one – convinced yet! This one is all about the copywriting. Awesome.

Things I’d change or test

What? How could I, What a great cause. Honestly though, it’s a good page with good trust factors (logos and testimonials) and a good explanation of what to expect (what’s your pet worth – the pricing table).

• Bottom nav: Take away all the extra links – it’s poor form. That’s my gentle critique.

Site*: PetAmberAlert.com

32. Monsoon – The Value of Association

Critiqued by: Oli

What I like

• Modern tech: Speaks to a very specific modern technology sector (catches the HTML5 nerds is what I’m saying).
• Why?: Strong section on the importance of the company’s technology.
• Nice form container: the form is above the fold and contained nicely although it could use a little more contract and a visual cue to point out that this is what you want the customer to do.

Things I’d change or test

• Mobile Apps: The purpose *appears* to be to build mobile apps but it’s very buried in small text beneath the main imagery – much better to use large test to convey the message and *then* follow it up with “context of use” images where you see apps used on mobile devices.
• Talk to us: Why? What is the benefit of talking to you about your project? Try adding a direct benefit beside the CTA that says “Talk to us about your next project, so that we can a,b,c the hell out of it…!”
• Clients: Put the title above the images so it’s clear why they are there.

Site*: Monsoonco.com

33. Dev Auditions – Chunking & Simple Steps

Critiqued by: Oli

What I like

• Clear value proposition: It’s clearly about hiring better people – focused on dev. But the headline could be clearer (see below).
• Walkthough: The 3-step process paints a simple picture of how the company operates.
• Close with the benefits: I like the start, middle and end of this page. Like a good story it leads you through what you need to know, ending with what you’ll get and a closing CTA. +1.

Things I’d change or test

• Clearer headline: Hire Smarter is generic – if you’re looking at dev hires then make the dev logo bigger or change the main headline into something with greater clarity such as “Hire Smarter Dev Talent”.
• Types of position: As it’s recruiting, I’d include some scope of the types of talent covered as development can be wide ranging. What are your areas of expertise, and geographical boundaries?

Site*: DevAuditions.com

34. Smartr – Smartr Design for Smartr Phones

Critiqued by: Carlos

What I like

• Personal Color: Bold colors that also feel friendly because they are earthy.
• Above the Fold: CTA, Video, and Interface presented above the fold–lovely.
• Show & Tell: Clear visual instruction toward the 10 reasons means the visitor know where to go and what to expect.

Things I’d change or test

• Matching: The screenshots have low connection to their text. You should test some other images for the features that may better illustrate the text.
• 2nd Headline: The second headline loses focus. Is that the benefits or the comparison chart that is being called the best?
• Close Strong: The final action doesn’t look clickable and forces a return to the top of the page. Just restate your CTA instead.

35. Keas – Fresh Design is Healthy

Critiqued by: Oli

What I like

• Image and Words: Light, easily understood background that matches the concept of health.
• Give it Space: An open layout lets people scan. Scanning is very useful for getting to the action at the end of the page.
• Happiness: The big testimonial is about happiness, which connects well with health, good job taking advantage of natural connections.

Things I’d change or test

• Emphasis: There are so many italics and bolds that it is hard to tell what is important.
• Don’t Compete: There are competing CTAs. This page is asking people to Learn More, but one is free (a click) and the other has a cost (e-mail and phone number). If you must have a second action make sure they are cooperative.

Site*: Keas.com

Awesome Stat

People finally seem to be getting the message about being more explanatory and creative with their CTA copy (“No More Submit! No More Submit!” – feel free to chant along). From the selection of “lead gen” landing page examples shown, a whopping 73% are doing it right and describing what will happen when you push their buttons!

*wipes eye in moment of gushing pride*

Got Any Good Landing Page Examples to Share?

If you’ve got or have seen a rocking landing page, please share it in the comments.

– Oli Gardner

A lot of articles entitled “20 best this…” or “50 greatest that…” have a lot in common. The main thing being that they’re all about what works.

So here’s what I’m not going to do. I’m not going to give you 20 landing pages that work – although some do – or 20 pages that don’t work – even though some of them do indeed ‘suck.’ No, I’m going to give you a mix of the good, the bad and the in between.

Because sometimes it’s just as important to know what not do, as what to do.

The criteria

There are three easy criteria against which a landing page can be judged, even for those of you who aren’t landing page gurus:

1. A landing page should clearly articulate what the consumer is going to get
2. A landing page should make it clear how the consumer is going to get it
3. A landing page should make it easy for the consumer to get what they want

Of course, if the landing page wants to do a few more things along the way, that’s fine with me, but these three maxims should form the cornerstone of any well-structured, well-defined landing page.

Landing pages = opportunity

Landing pages give marketers an excellent opportunity to start a conversation with the consumer. Why excellent? Because they’ve already made the effort to click on the advert, email link or QR code to get to your landing page, so they can be considered somewhat prequalified, or inclined toward your brand or product. This is no longer a cold lead, so marketers shouldn’t let that opportunity get away from them. At this point, the effectiveness of the landing page becomes paramount.

So, without any further ado, here are 20 of the best… and the worst… landing pages, I hope you can learn something from the critique. Please jump into the comments to argue or agree.

1. Google Engage

Google Engage is a program to train and support for agencies in the use of Google products, with a focus on Adwords.

What I like

• It has a clear call to action, supported by a clever ‘1-2-3’ call-out box that tells you what to expect next
• Explanation – the main paragraph clearly explains what Google Engage is. The inclusion of a video makes it more effective.
• Bullet Points – the bullet points that provide more information on the product details help to structure the text, making the page easier to scan and highlighting the important details.

Things I’d change or test

• In this case, nothing.

2. IBM DB2

Another big brand, but not quite the same level of quality. IBM’s landing page for its DB2 and Power System campaign suffers from a real lack of direction.

What I like

• Nothing, this is a stinker of a page.

Things I’d change or test

• Call to action – the page hides its CTA’s in the left and right-hand columns. It’s not clear what IBM wants you to or how they want you to do it. It should be much clearer.
• Typography – having a grey headline, but black text, makes the sub-headline recede into the page. Typography should be hierarchical, so that the eye can quickly pick out what elements of the page are most important.
• Colour use – there are a few examples of poor colour use on this page. First, using white text on colours like yellow or green makes it very hard to read when the text size is smaller – this should be avoided. IBM has tried to introduce social media links, but by having all the icons in a pale grey, they are lost on the page and unlikely to be found. Social Media icons are recognizable to a large number of users, the familiarity of the Facebook ‘F’ and the Twitter ‘T’ growing every day, but colour forms a part of that familiarity. If you are going to use these icons, use them in colour for maximum impact.

3. Shopify

Shopify provides its customers with the ability to create online shops, complete with cart and payment options. This landing page is designed to get new users on board with the service.

What I like

• Video – the use of video really strengthens a brand’s proposition. It’s a great way to communicate a lot of information quickly and clearly.
• Positive language – Rather than providing lots of copy to ready through, Shopify has created five bullet points. The language used (and the iconography) is all designed to give the user confidence. Phrases such as ‘Easy to use’, ‘Secure’ and ’20,000+ Store’ breed confidence in the user (as does the tick icon).
• Clear CTA – the CTA is clearly positioned and concise – there are only three fields to complete, lowering barrier to entry and making it more likely that the user will complete sign-up.
• Supporting information – their supporting information is comprehensive, but delineated from the main sign-up area, so as not to cause confusion or draw the user away from the sign-up process.

Things I’d change or test

• Shop URL – the inclusion of the shop URL might cause issues. What is it? What do I enter? There’s no explanation as to what is expected from the user. It may be better to include this field later in the sign-up process.

4. UKFast

UKFast are a hosting company that offers cloud services.

What I like

• Social Media sharing – getting users to share a page they like is good practice, but you have to be careful how you do it. If these links distract users from the process of signing up, you’re damaging the effectiveness of your page.

Things I’d change or test

• Structure – the page contains a lot of information, and all of it is competing for the user’s attention. Simplifying the structure would help the user to understand what they should be reading and in what order.
• Remove navigation – the navigation at the top and bottom of the page is superfluous to requirements. One or both should be removed, so that the user is less distracted.
• Merging Part 1 and Part 2 – the link to sign-up for Part 2 is included at the bottom of the page as an afterthought. If you have more than one thing to offer your user, make it easy for them to select all the ones they want as part of a single sign-up process.

5. PaloAlto

PaloAlto creates hardware firewalls and this landing page allows consumers to download the Gartner Magic Quadrant report for that industry segment.

What I like

• Clarity – the page is structured clearly, with good use of colour to separate the sections and indicate information hierarchy.

Things I’d change or test

• Call to action – although it’s clear what the user has to do, it’s misleading. It appears the report will be immediately available when you click the button, but this is not the case. It may be better to be transparent up front.
• Copy – the copy is clear about what the Gartner report says, but it focused on the company, not the user. Self-serving copy is a turn-off for users. Make sure you tell users how they will benefit to ensure a positive response.

6. Imperva

Imperva provides data protection services for their customers, but this landing page tries its best to stop consumers from knowing it.

What I like

• Nothing hidden – the only good thing about the Imperva landing page is that everything is simple and up-front. Consumers know exactly what they will get and what they have to do to get it.

Things I’d change or test

• Supporting information – if you are offering information on a subject, you have to position yourself as an authority in that area. Although the simplicity of the form is helpful in some ways, there’s nothing here that tells us who Imperva are or what they do. Some supporting information would be useful when making the decision to download the report.
• Mandatory and non-mandatory information – it’s not clear what the minimum requirements are when completing the form. Some companies will not want to give away information such as revenue, so make sure you let them know it’s not a deal-breaker for getting the report. Make sure your mandatory fields are clearly marked.

7. Wix Pages

Wix helps its users create Flash-based websites and Facebook pages easily through template solutions.

What I like

• Process – as with the Google Engage page, Wix has shown the process that follows sign-up. This helps the user to understand what is expected of them.
• Examples – the Wix service is based around templates, so by providing a series of examples, potential customers can see the quality of what to expect.

Things I’d change or test

• Expanded examples – not all customers are the same, having a constantly refreshed set of examples, or the ability for the user to choose to see examples from different industries would help them to understand what the service could offer them.
• Better explanation of additional features – there are ‘tons’ of features, but only six listed. More information here would help the user understand the depth of the service.

8. eMusic

eMusic is in a very competitive area – digital music – so it needs to make an impact up-front to get customers through the door. The key for them is to get users on to a trial plan.

What I like

• Repeated messaging – repeating the 25 songs message leaves the user in no doubt as to what they will receive.

Things I’d change or test

• MP3 players – although users are fairly savvy, there’s a lot of people who equate iTunes with digital music. eMusic could make more of this area of the page, as with eMusic there is no perceived ‘lock-in’.

9. LightCMS

LightCMS is a service that enables users to create online stores and manage the inventory behind them.

What I like

• Multiple Sign-up buttons – having buttons at the top and the bottom of the page means that the CTA is always available, whether the user reads all the supporting information or not. For long landing pages, where the top of the page disappears when you scroll, having multiple buttons is a must.
• Video – as we’ve seen before, video is a killer feature for landing pages right now. LightCMS puts its video top of the page as the main interaction point for new users.

10. Formstack

Formstack allows users to create web forms and surveys and then embed them in their sites.

What I like

• The supporting links next to the second CTA – Formstack have realized that if a user has read all the way to the bottom, they’re still in the process of making a decision (otherwise they would have clicked the first link). To help them make that decision, they’ve added two additional links next to the second CTA. By allowing the user to ‘learn more’ and ‘see examples’, they’re effectively buying a second chance to persuade the user if they’re not sure about proceeding to sign up. By keeping them simple, they’re not distracting the user from the path they actually want them to take.
• Testimonials – testimonials can be dull and boring if they are used in the wrong way. Formstack has placed their testimonials right next to the decision making point of the page to encourage sign-ups. By keeping them simple and personal (no corporates here), they feel more genuine and friendly.

Things I’d change or test

• Pricing – there’s no pricing information – at all – it just mentions ‘paid plans’. It could be misread as having something to hide. I’d test a version with some indicative pricing information to see if it made users more confident in what they were entering into.

11. Squarespace

SquareSpace is an online website creation tool and content management system.

What I like

• The ability to rotate through the product features – landing pages don’t have to be long and unwieldy. By providing these controls they can cram a lot of information into a small space and get the user interacting and exploring the page.
• Copy – this site has great copy. It’s simple – there are only six pieces of information required to get across the essence of the service.

Things I’d change or test

• Auto-rotate – although the rotator is great, it’s static, and although the copy is great, there is more. There are some more great and possibly deal-clinching features hidden away, which could really do with being brought forward in some fashion, so I would test whether the three features shown are the ones in which the users show the most interest.

12. Unum

Unum sell income protection, which is a tough sell. But I’ve got to say that this is one of the best financial services landing pages I’ve seen. Rather than take the numbers route (this % interest, this is what you could earn, etc), they’ve concentrated on being accessible

What I like

• The Call to Action is advice – income protection is a long-sell, so can’t be rushed. By not asking consumers to register Unum is playing the long game. CTAs don’t always have to be direct and data led.
• Social Media links – Unum have understood that the best place for a conversation with consumers isn’t necessarily the corporate website. By pushing consumers to Facebook they’re putting them in a much more relaxed setting. As a result they have over 13,000 likes on their Facebook page, and the demographic information they get from that data will help them to target their follow up marketing.

13. Zoho Invoice

Zoho Invoice is a web-based time-sheeting and invoicing system.

What I like

• Screenshots – the product isn’t the most exciting in the world, but it does do a lot. In this case, a picture really is worth a thousand words, showing a user what’s on offer can be much more effective than talking about it.

Things I’d change or test

• The horrible ‘5 million users’ quote – it looks as if it’s been put there by accident. It’s a different font from the rest of the page and the white on apricot just doesn’t work. If it is important, make something of it. If it isn’t, don’t waste the page space.

14. SiteSpect

SiteSpect specialise in website optimization. This landing page offers a free whitepaper on multivariate testing.

What I like

• Simple and structured – not everyone is going to know what multivariate testing is, so it breaks it down into three easy stages, without getting overly heavy on the copy. First it tells you what you what the whitepaper is about, then it tells you what the benefit of optimizing your website is, and then finally it goes into detail.

Things I’d change or test

• Sample content preview – Making more of the content of the whitepaper, by using imagery or sample copy, would help the users to gauge the usefulness and make the page more engaging.

15. Ion Interactive

Editor’s Note (Oli): I’m jumping in on this one.

What I like

• Contrast: The action area used the design principle of encapsulation to make it really stand out.
• Form heading: The form header clearly states what you’ll get and has subtext that offers a complete bonus library which helps to balance the “size of the prize” with the request for information strongly in the users favour.
• Trust factors: The customer logos provide a strong sense of endorsement which helps establish Ion as a thought leader.

Things I’d change or test

• Copy – the heading doesn’t really talk about the purpose of the white paper – which is to use content marketing to increase conversions. This could be made clearer.
• Preview – If your content is worth having – show this by offering a “try before you buy” option in the form of a preview (first 3 pages or Chapter 1 etc). This lets people see how smart you are and make you appear more trustworthy.

16. Marketo

Marketo provide B2B marketing services. As a result, they really should know better; once again, landing page experts have let themselves down.

Things I’d change or test

• Removing the up-front registration – this is a real issue for me. Why should a consumer give you their details without knowing what they are getting return, it’s madness. Much better to allow the user to browse the available content, then ask them for their details at the point of transaction. Being overly aggressive about your data collection makes users uncomfortable.

17. Red Rocket Media

Red Rocket Media are a content marketing firm.

What I like

• The contact details – but only because you will need them after reading this page.

Things I’d change or test

• Single CTA – there’s too much going on with this page. Be clear about what you want your user to do. In this case is the white paper download or the free consultation?
• Tabs and Buttons – the ‘Build an audience’ bar looks like a button, but isn’t. If something isn’t serving a purpose, it should be removed. In this case there is also overlap in the styling of the tabs and buttons – styling page elements in a similar fashion leads the user to believe that they behave in the same way. If they then don’t, it’s confusing.

18. ESPN

ESPN is a sports broadcaster, this is the sign-up page for their newsletter.

What I like

• Opt-out option – it takes guts to have the ‘No thanks’ button top right, it’s one of the first things the user sees. But by having it there, it also puts the user at ease. Unlike the Marketo example, this has a less aggressive edge.
• Simplicity – two fields is all that is asked for. The simpler the sign-up form, the more likely it is that it will be completed.

Things I’d change or test

• Imagery – a simple page like this gives the opportunity to play with the imagery. By rotating different images from different sports (a baseball changing room or an American football changing room) the reaction from users may be different. Changing the image dependent on the location of the user might also help, as different sports are popular around the world.

19. American Airlines – The Individual

American Airlines’ The Individual is an attempt to differentiate the airline.

What I like

• Branding – although it’s an American Airlines landing page, the focus is on the campaign identity, not the brand. Using copy in this way hammers home the message of individuality, from the repeated ‘The Individual’ phrase to the quote.

Things I’d change or test

• Call to Action – although we’ve seen that landing pages aren’t all about collecting data, they do still have to be clear. Unum gave the user two clear and differentiated choices; here there are five choices and it’s not clear if they are pages or videos. The answer: some of them are videos, some are just the same page with a different image and copy and one of them is a different page. In actual fact, the ‘Travel Options’ link is the actual CTA, taking the user to a booking page, but it really isn’t clear. I’d test a version with a clearer CTA that doesn’t look as if it was part of the bottom navigation.

20. Adobe Business Catalyst

Adobe Business Catalyst allows users to create and deploy web forms with a full database backend.

What I like

• Clear pricing – the table of prices at the bottom makes sure that the user has all the information they need to make an informed choice. Adobe is a big corporate, so challenging pre-conceptions on price is important.
• Good use of imagery to make sections distinct – Adobe has used three images to be representative of the copy in each section. Using images to introduce section makes it easy for the user to scan the page.

Not all landing pages are created equal

So, there you have it, a real mixed bag of landing pages. Big companies, small companies, different industries and different offers. Have you got a favorite landing page? Or one that has made you throw your hands up in despair?

Share them with us in the comments.

– James Gardner

Now that video production is affordable to all business sizes, we’re beginning to see companies use video on landing pages and not just their homepages.

Spinning off of Oli’s Your Landing Page Sucks! Here are 10 Examples That Don’t… I wanted to take a look at some great landing pages that incorporate video. Great landing pages explain exactly what you do in a brief amount of time, and video is a great asset for accomplishing such a task.

Here are 10 examples of pages that are crushing it with video.

1. Intuit

What better way to sell a product than to show it in action? The Intuit video itself does a great job of relating to potential customers, showcasing its benefits and explaining how easy it is to use.

What I like

• They include customer testimonial videos allowing visitors to see what others are saying about the product.
• Easy to read. The top section tells me everything I need to know about the product and how I can get started.

Things I’d change or test

• Remove all navigation at the top.
• From a design perspective, I’d have the “Start Now” section span the width of the page to add some depth to the page. See Zopim.com for an example.

2. Google

I like Google’s approach here. Give the user two main colors and keep the rest plain and simple. Immediately, the coupon and CTA button jump out at the page.

What I like

• The use of a coupon. Give something away for free to get your users into the door. We all can’t do it, but if you can it can really help conversions.
• Noncommittal copy. Users fear long-term contracts more than death and public speaking. Google’s copy includes “Request a free trial” instead of “Start your free trial”.

Things I’d change or test

• Headline for the video. For those not in online marketing, AdWords can be a complex system, so I’d put more of an emphasis on getting users to watch the video.

3. Path

Not only is Path a beautifully designed mobile app, but their homepage incorporates video right upon landing one it.

What I like

• Emotional connections. Rather than showing you the features (ie sharing with close friends), Path uses a more emotional connection by showing a husband and wife actively sharing photos of the family.
• Very little distraction. The copy is focused and there’s not much auxiliary content.

Things I’d change or test

• Add the number of app downloads or the number of captured moments.

4. UPS

Social Proof is one of the six “weapons of influence” in Robert Cialdini book Yes! 50 Scientifically Proven Ways to be Persuasive. He states that people will do things that they see other people doing. UPS uses Zappos to show the value of their services and how they help Zappos be the consumer friendly brand that we all know and love.

What I like

• Success stories. Using a well-known and well-liked brand such as Zappos will lead to increased conversions.
• Use of repeat shopper statistics. UPS has a hand to helping Zappos achieve 75% repeat customers. The implicit message is well done.

Things I’d change or test

• Minimize the amount of text. There is a lot to read through on the page and would like to see what happens if UPS remove the right side of the page.
• Dim the background. Changing the alpha setting on the warehouse image will make the main section stand out more.

5. Optimizely

Optimizely uses the video to show the simplicity of the application and lives up to its headline of “A/B Testing you’ll actually use”.

What I like

• No signup required. Allowing users to test drive your service with little or no barriers can lead to increased conversions. Even if a user does not sign up you may end up with a brand evangelist who can speak to the simplicity and value of your application.

Things I’d change or test

• Shorten the video. The video runs close to 4 minutes and gives you the full scope of the application. I’d test a 30-60 second video that gives viewers just a small taste of the functions. I think the product sells itself when you test drive it.

6. Zoho Books

Rather than making users read through all the features, Zoho Books shows you everything you can do in a quick 60 second video.

What I like

• Big video image. According to a recent Kelsey Group study, 21% of video viewers make a purchase. No wonder Zoho Books made the video so big.

Things I’d change or test

• Embed the video. Rather than using a modal, I’d embed the video, so users can sign up while watching the video.

7. Groupon

Groupon is known for being a little quirky. Example 1 and example 2. But the use of video to get unsubcribers to re-subscribe is utterly genius.

What I like

• Everything. From using video to having a call to action that says “Punish Derrick”, this is great execution on a page that most marketers ignore.

8. Animoto

I’m a big fan and a paying customer of Animoto. The design of this page is amazing and uses a unified tone of turning photos into amazing, theatrical movies.

What I like

• Video thumbnail includes a CTA. Most companies use a thumbnail that is a random scene in the video, but Animoto uses a call-to-action as their thumbnail which can dramatically increase views.
• Award design. The awards are very similar to the way awards are presented in motion pictures. Animoto does a great job of sticking with an overall message of the page.

Things I’d change or test

• Change the CTA Text. I would change the “Learn More” button to “See Pricing”. The user is already learning about the product in the video and the link takes the user to the pricing page.

9. VisibleGains

According to VisibleGains, they received a 51% conversion rate on this landing page. That’s pretty impressive and a big part of that success can be attributed to the video preview of the webinar.

What I like

• Huge focus on video. The video occupies a majority of the landing page and gives you a taste of the webinar.

Things I’d change or test

• Move the sign up form. The sign up form is a little far from the video for my tastes. I might try putting it a little bit closer to the video.
• Sign up form on the right. I wonder if having the sign up form on the right would increase conversions even more. My eye immediately goes to the video then my natural response is to look to the right of the video for the form.

10. Dropbox

Here’s a company that is fully invested in video. One of my favorite web apps out there, Dropbox has two options on this page – watch a video or download the app.

What I like

• Video thumbnail. The video thumbnail is beautifully designed and is incorporated with the logo itself.

Things I’d change or test

• Add a tag line. It might be interesting to test a tag line in case folks don’t want to watch the video and want to learn more the product. It may even lead to more video views.

Further Reading

• [Case Study] Using Video to Lift Landing Page Conversion Rate by 100%

Your Turn: What do you think?

Love ‘em? Hate ‘em? Got examples of how video has helped you to convert better?

– Steve young

Your landing pages should be this awesome! (Image source)

Fact: in the world of landing pages, there are far more misses than hits. If you’re skeptical of that statement, do some quick research by clicking on some paid search or display ads.

Here’s what you’ll find: over-the-top cheesy stock photos that evoke strange emotions, sketchy testimonials from seemingly non-existent customers, blast-from-the-past color combos with too much orange, green, bright blue and flashing red (think of a 1990s music video), displaced enthusiasm and more information than the user could possibly digest. Hopefully, you’ll be able to reopen your browser after the surprise audio feature crashes it.

When you finally do find a stellar landing page, you may want to jump out of your seat and high-five it. It will be conversion-centric, trust-inspiring, energetic and straightforward all at once.

There is no recipe for the perfect landing page design, but your favorites may look a bit like these:

1. Salesforce: Social CRM Service Cloud

Type: Lead generation
How I found it: LinkedIn display ad

This landing page promotes Salesforce.com’s Social Service Cloud platform, which helps client-focused brands and agencies engage with customers on social platforms.

Why the Page Rocks

With video and downloadable e-books, the page is packed with learning resources that visitors will find useful (plus, there is strong evidence that videos enhance conversions).

With testimonials from professionals like senior social media directors, the service projects an instant sense of credibility. Through videos, prospective leads are able to connect with industry experts as people rather than names in chunks of text or quotes.

Suggested Improvements

When you are asked to register, the benefit reason is related to the “Service Cloud”. However, the rest of the page fails to explain what the Service Cloud actually is or reconnect with this idea. While offering teasers to its value from industry leaders and experts, there is no to-the-point description for audiences who would benefit from more details.

Editor’s note: When you do click on the resources, expectation quickly turns to frustration by requiring that you register before even watching a video – this is a massive old-school #FAIL in my mind – sometimes you really have to give content for free and not only think about lead gen – at least let people watch the videos! Conceptually the page is really strong – just too much of an instant barrier.

2. UserTesting.com: On-Site Usability Testing

Type: Click-Through
How I Found It: Google AdWords campaign

UserTesting is a service that allows website owners to quickly collect inexpensive feedback to inform product usability and improvements.

Why the Page Rocks

With a straightforward headline, quick call to action button, and clear testimonials, this landing page excels as a trust-building communication tool. Within 30 seconds, I can quickly see what UserTesting.com provides, who is using it and what users have to say about it.

If you want to learn more, there is plenty of information to walk you through the process and help me make an informed decision. I even have a general idea of how much it costs, and I’m even more inclined to buy with the advertised money back guarantee.

Editor’s note: There is strong social proof shown with the list of existing customers, which can be a big conversion tipping point.

Suggested Improvements

Above the fold, the page is a little too text-heavy with language that could be streamlined into a couple of high-impact statements or bullet points.

3. Inbound Writer: Social Writing Applications

Type: Lead-Gen/Registration
How I Found It: Display ad on Problogger

Inbound Writer provides real-time social intelligence to writers for content optimization.

Why the Page Rocks

It’s short, simple, and straightforward. All important information falls concisely above the fold. Instantly, a compelling headline capture’s my attention, and the layout provides all important information that speaks to any content marketer’s values. A product that’ll help me improve reach and engagement? Where do I sign up? From a trust factor there is the all important “I won’t be spammed” statement, places correctly right beneath the email address field.

Editor’s note: After the simple sign-up, you are provided with a nice modal explanation of what to do next. Smart!

Suggested Improvements

The page feels a little impersonal and could benefit from a testimonial beyond a list of companies that are already using the product. As is, the dashboard screenshots are small and tough to follow: strategic image-cropping would help with a much-needed face lift, or some nice modal popup screenshots (lightbox style) would provide a deeper preview).

4. Blog Talk Radio: Create Your Own Radio Show

Type: Click-Through
How I Found It: LinkedIn display ad

Blog Talk Radio is a platform for people to create and broadcast talk radio shows online.

Why the Page Rocks

This landing page is an example that shows how photos can be an elegant and effective marketing tools. It builds a personal rapport with the audiences by incorporating pictures of real users. The images rotate through three different individuals — one male and two female– to appeal to a variety of demographics. The layout is simplistic, focusing on trust and usability as a key emphasis with real customer quotes and images that put faces to the name.

Editors note: A few other plusses:

• The CTA is really obvious and states exactly what will you will get when you click it.
• The benefits are laid out in a simple and easy to read manner beneath the main banner.
• It offers some free content/advice to teach you how starting a radio show can be good for you (the link at the bottom). Helpful, insightful and FREE advice will position you as a thought leader and make people remember and trust you.

Suggested Improvements

The landing page could benefit from a clearer description of the service. As-is, the emphasis is on the people who use the product rather than the product itself. A quick way to address this issue is to design a layout with an attention-grabbing headline that says something like “Create Your Own Talk Radio Show.”

5. Fidelity: iPad App

Type: Click-Through
How I Found It: Google AdWords campaign

Fidelity provides investment and asset management services to consumers through products such as IRAs and 401(k) plans.

Why the Page Rocks

This landing page leverages a layout that makes sense by keeping pertinent information above the fold and orienting the audience with a compelling headline and dominant visual element that shows a strong sense of content of use. The Apple gift card promotion is a strong incentive tool and added bonus for the campaign to help drive conversions. While the landing page is designed for desktop and laptop viewers, there is a QR code for people to get the app on their mobile devices.

Editors note: There is a video in the bottom-left to aid understanding for interested parties and help boost conversions. But I can’t help feeling that it should have been embedded inside the iPad iself – or at least have an enlargeable lightbox screenshot that can be opened from the iPad image. I feel like they missed the perfect spot for a product demo.

Suggested Improvements

Editor’s notes: The call to action button might be better as a double lined button which would have the affect of increasing it’s size/dominance – and separating the action and benefit. Another option would be to include the details about the $500 Apple gift card promotion would be better-placed beneath the call to action. Something to try as part of an A/B test.

When you click through, you are faced with a second landing page with terms and conditions (and unnecessary frustration). It would be much better to have the t&c be launched into a modal window from the first page so you can read it if you want and not be interrupted by it.

What about these landing pages caught your eye?

Please share your comments, good and bad. What did you learn from these landing pages? How would you change them?

– Ritika Puri

Since then, startups have hopefully learned the lesson that they, too, can unexpectedly be thrust into the spotlight – and it’s best to be prepared. Now the question is – are you?

Here are five ways you can not only help spread the word about your launch, but reel in the kinds of customers you want to reach.

1. Be Brief about Benefits

You (generally) only have limited screen space in which to convince people to sign up. That means your most important benefits need to be above the fold (the first 1/3rd to 1/2 of the user’s screen space). The simpler and more direct the design and call-to-action are, the more likely you’ll entice visitors to take that action. I think just about anyone who sees the screenshot for Briefly (below) will remember the giant pair of underwear staring them in the face.

Why This Approach Works

In addition to its unconventional attention-getting graphic, Briefy also fits everything into one screen space, so there’s no need to scroll. It also posts its three most important benefits right below the main statement for easy reading. Signing up for notifications only requires an email address, which presents less of a barrier to cautious subscribers who are worried about spam.

2. How Soon is Coming Soon?

It’s no longer enough just to tell visitors that you’ll “add them to the notification list” when you launch. In this “always-on” day and age, we have on-demand expectations. Even if you’re not 100% certain when you’ll launch, giving users an approximate timeframe, such as Summer or even a countdown will help keep them interested. In Forkly’s case above, they even went so far as to detail their progress on their Tumblr blog, including how they had to quickly create a viral sharing script after the early deluge of traffic.

They’ve even posted a visual graph and their conversion stats a few months after this blog entry to let readers know how well it worked.

Why This Approach Works

Not only are you helping to keep customers “in the loop” while you’re putting the finishing touches on your new project, but you’re also building your subscriber list exponentially. For those early adopters who don’t want to wait, simply sharing an invite with three or more friends can instantly propel them to the front of the line. And early adopters are pivotal people to reach – particularly if your product has a tech slant.

3. Make it Easy and Rewarding to Share

Forkly did a great job adding in a social touch with their Private Beta launch. But then they went a step further by allowing people to jump to the front of the virtual line by inviting three of their friends. On top of that, the more they invited, the sooner they could start using the app.

Put your own twist on this idea. Can you give subscribers who share your invite link a behind-the-scenes look at the “making of” your launch? Even better – what can they contribute to it while it’s still in the early stages? A brilliant example of this is in the book Viral Loop. Not only can you read about companies that employ this same kind of strategy – you can also contribute to their stories.

Some Coming Soon landing pages try to persuade you to share by making it into a contest.

However, this can get costly depending on the types of products you’re awarding the winners (think something like an iPad 2 if you really want to build up steam). Using the Viral Loop method is inexpensive and hints at the early adopters’ deep-rooted need to “be the first”. A win-win for everyone.

Why This Approach Works

Using the Viral Loop method is inexpensive and hints at the early adopters’ deep-rooted need to “be the first”: A win-win for everyone. These are the vocal people who can be either evangelists or critics of your product, and you need both in order to succeed.

4. Make a Plan for After the Signup

Once you’ve got their name and email address – what’s the next step? If you haven’t thought this through, you won’t be able to spur many people into action after signup. A well-written autoresponder can take over here by encouraging the subscriber community to get involved. Ask for their feedback as you develop your product. Find out what they like and hate about competing products on the market. You may get some excellent suggestions and features worth incorporating.

Why This Approach Works

You can get directions to your nearest Yogolicious by using their Coming Soon page. But this page could likely perform even better if they allowed people to sign up for special offers by email, such as a free coupon, or notification of their next donation/yogurt social.

5. Tell a Story to Bring Personality to Your Page

Why are you launching this new product or service? People want to connect with the brains behind the enterprise, and chances are, your mission or goal will –in some small part- become theirs too. Thank them for taking the time to sign up, and introduce them to your virtual world. Being secretive and stealthy will only make people reluctant and discourage sign-ups (no matter how cool it may look).

Social cataloguing app Evertale did a mesmerizing job of this with their Coming Soon landing page, which took readers on a short, whirlwind tale about capturing and reliving daily memories. It was exciting, motivating and inspiring – just as it should be.

Why This Approach Works

When put together, short benefits, a launch timeframe, an injection of personality and a rewarding way to share and stay informed create the ultimate formula for a landing page that not only compels you to act, but also gets you enthusiastic about the brand and its future.

– Sherice Jacob

Note: I’m bringing this post back from the archives. A) because it’s timeless, B) because it’s awesome and C) as a teaser to an upcoming landing page examples post.

A real-world style landing experience
Imagine walking into a restaurant, and finding that the decor is gross, the music is too loud, the staff look sketchy, the menu has 400 options on it, they have an award on the wall for “Best meatloaf in Idaho, 1995″ and to top it all off, the place is empty. What would you do? I know I’d be getting the hell out of Dodge.

And online…
And that’s exactly what your visitors do when your design sucks, you have a video auto-playing with no mute button, there are no indicators of trust or security, the form has a million fields and the testimonials look like you wrote them yourself.

Excuse me waiter, could I just get the back button please?

Soooooooo, today we’re going to take a trip down to the Top-Notch Landing Page Store and see if we can rustle up something to inspire your next design.

Each of the following pages exhibits excellent qualities of conversion centered design, but most of them also do a couple of things wrong.

1. WebTrends Analytics – “lead”ing the way

I’ll admit it right off the bat – I have a crush on Webtrends landing pages. If you’re looking anywhere for design inspiration for lead capture forms, this is a good place to start.

What I like

• The hierarchy of page elements and information is well structured and focuses on the basics: a logo, a hero shot that combines a clear headline, a short description of the reason for and benefits of the product/service (in this case a webinar) and a lead capture form to gather visitor data. And… importantly… nothing else.
• The call to action (CTA) of lead gen forms almost always falls below the fold. To get around this they’ve placed a directional cue (arrow) at the top of the form to point the way to the action area below.

Things I’d change or test

• A tighter relationship between the directional cue and the CTA. Specifically, I’d make the button blue to match the form header – it blends into the gray background a bit too much right now.
• Change the CTA to describe what you’ll get when you click it. It should say “Register for webinar” rather than the undescriptive “Submit”. Sorry Webtrends, as much as I love you, this is a rookie mistake that should never be repeated.

Site*: Webtrends

2. UPS – using modal windows to keep visitors on the page

Even with a clean and conversion oriented design, many pages still commit the cardinal sin of providing outbound links that aren’t part of the conversion funnel. UPS have done a good job at avoiding this.

What I like

• The “More” links for the speakers all launch modal dialogs (using a Lightbox style). This keeps visitors on the landing page instead of wandering off onto another page – and away from your conversion goal.
• They have a video. Good! Video is a proven conversion enhancement mechanism. Studies from eyeviewdigital.com report up to 80% improvements in conversion. Video marketing specialists Turn Here highlight good conversion improvement numbers and the side benefit that properly optimized video can be 53 times more likely to reach the front page of Google search results. Tip: you can often re-use your video by placing it on YouTube.

Things I’d change or test

• The links at the bottom of the page still go to external microsites (click the image to see the full screenshot). Microsite’s still offer a more focused experience than your homepage so it’s not a big negative, however, a better “All In” move would be to embed them in Lightbox windows like they did with the speaker bios.
• The call to action would be better if it read “Get updates on future webcasts” rather than the generic and intimidating “Sign Up”. (The words might not seem intimidating to wily online veterans like yourself, but it expresses no benefit or gain – making it a negative interaction reinforcement statement).

Site*: UPS

3. The Future of Marketing – socially proven

Social proof in the context of landing pages refers to the idea that your visitors will be influenced positively (although there can be negative effects) by showing evidence of others participating in the use of your product or service. This can be presented via counters showing your social followers (Twitter, Facebook etc.), and testimonials that describe the emotional reaction to your offering from real world customers.

What I like

• Social proof is off the charts here. Instead of showing people following or registered for the conference, they are showing the photos and names of a huge collection of famous players in the marketing industry. Endorsements create credibility, which leads to conversions. Even if you don’t know who the organizer is (ThoughtLead in this case), the fact that it’s sponsored by IBM and has speakers such as Guy Kawasaki will do the selling for you.
• The call to action describes perfectly what you get. Free registration. (Note that this screenshot was taken after the conference so the messaging is related to a replay of the audio rather than registering for the conference itself).
• Contrast: The bright pink CTA stands out from the monotone background.
• Repeated CTA: On long landing pages (click the image for a full view), it’s important to repeat the CTA to remind people of the goal of your page if they’ve been scrolling for 10 screens. Here it’s placed at the top – above the fold, and at the end – for those who’ve finished exploring the whole page.
• Secondary CTA: In today’s social world, WOMM (Word of Mouth Marketing) is key. Here, they’ve added a Twitter sharing button to help visitors spread the word on their behalf.
• Confirmation CTA: Once you complete the form, you’re again presented with an opportunity to spread the word via Twitter. This is great use of thank-you page real estate.

Site*: Future of Marketing

4. Clearvale: No Jive Talkin’ – a seductive single CTA

If you were in a car driving down this highway, you’d have 2 choices: left or right. On this landing page, there’s only one thing to do, click on the sign. This is what’s known as a “click through” landing page. Other names include jump page or the beautifully named “romance page” – as the purpose of the page is to enhance the interest level of the visitor to a point where they are ready to move to second base. (I’ll give credit for the term “romance page” to Scott Brinker).

What I like

• The simplicity and seduction. It makes you want to click on the sign for two reasons: first because it’s your only option, and secondly because the copy on the sign implies some kind of controversial point of view.

Things I’d change or test

• I was a little underwhelmed when the next page was a blog, rather than a continuation of a marketing experience, so I’d do something more engaging at that point. But there’s no denying that the click through rate of this landing page would be very high.
• I don’t really get the connection of the visuals to the copy on the sign, but I suspect this is part of the allure, that you don’t really know what’s coming.

Site*: Clearvale

5. Groupon – beautifully simplistic flow

Here’s a great example of a simple guided landing experience from Groupon.

What I like

• They have used geo-targeted segmentation to set up my location, and are presenting a big bold value proposition statement (50%-90% off) to get me interested.
• Colorful with good action area contrast. The bright bold color is seductive and makes the action area (form) very clear.
• Usability. The progress indicator below the form lets you know that there are 3 steps and where you are in the process.
• Simple forms: In step 2 (the lead gen portion), they ask for your email address only, reducing the barrier to entry to a bare minimum.

Things I’d change or test

• If you don’t know who Groupon are (and despite their size, they haven’t reached everyone yet), there’s nothing to really tell you what you might be saving 50%-90% on. The imagery indicates alcohol which might be why I agreed to enter my email, but some qualification of the offer details would be good.

Site*: Groupon

6. Oprah – sweepstakes for lead gen

It’s Oprah. This stuff will generally sell itself, but it’s not all good. Read on.

What I like

• Focused on the benefits: By leading with the vacation prize they are tapping into people’s desires right away. The branding is so powerful in this case that it can be safely relegated to the bottom of the page.
• Branding: Oprah’s brand is her selling point, her face is on everything associated with her and here she evokes the feeling of being on vacation to entice her loyal following to win a little piece of the Oprah lifestyle.
• Sweepstakes are a very popular lead gen mechanism, and here they are using the free prize giveaway as an add-on to a “no risk” magazine subscription.

Things I’d change or test

• The privacy policy and rules links open up new windows which is a bit messy. A better solution is to use a modal lightbox like the UPS example above. You can see what I’m talking about on one of the Unbounce contest landing pages (click the contest rules link near the bottom to see the modal window).
• It pains me to repeat the same thing over and over, but the call to action on your buttons is REALLY IMPORTANT. Any doubt in the visitors mind as to what will happen can lead to little leaks in confidence. Spell it out clearly so people know what to expect. Here it could use a double lined CTA that starts with a primary first line: “Enter the contest”, then a second line “and start your trial subscription”.

Site*: Oprah Magazine

7. Verisign – shaping trust

This landing page is all about building Verisign’s central brand promise – trust.

What I like

• It tells a simple story: As a click through page, it provides enough information and interest to warm up visitors and encourage them to continue down the intended conversion path.
• Benefit based CTA’s: Each call to action is based on a real business benefit, encouraging a click to find out how Verisign can improve trust and what effect that can have.

Things I’d change or test

• CTA contrast: I’d prefer to see the CTA’s presented with more contrast to the rest of the page.

Site*: Verisign

8. CameraPlus – the ultimate long product sales page

This is the modern apple-esque equivalent of the old-school long sales letter landing page. You’ve probably seen the less trustworthy ones before, where the writer uses reams of ultra persuasive copy to convince you that, despite being an average Joe, they have managed to build an online internet business that prints money.

While it borrows the concept of a long page that piles on the features until you’re ready to buy, that’s where the comparison ends.

This is a very good landing page.

What I like

• The design matches the desires and expectations of the buyer. The target customer already has an iPhone, so they are used to seeing beautiful design with apps placed in context with their intended use.
• Context of use: This is an IMPORTANT concept. The primary iPhone image plays a video showing the app being used. This is pretty much all you need to be sold on the app’s cool factor. You can then explore the big feature list below to reinforce your purchasing decision.
• The price and call to action to buy the app are nicely positioned above the fold, leaving you to explore the page knowing how to interact when you are ready.
• Celebrity endorsement: Including celebrity photographer Lisa Bettany – who for the record (and gossip factor) is dating Mashable founder Pete Cashmore – is a clever device to help convince visitors that it’s worth buying. Professional photographers that just want a cool app for their phone will find this convincing.
• Proof of concept: The photo gallery at the end caps it off nicely by showing that you can take great photos with this app.
• The reviews beneath the phone are highlighted in red, making them the most important visual aspect of the first screen. While I would normally recommend the CTA get this level of attention, it really pushes you towards what is often the swing vote in a purchase – what other people say.

Things I’d change or test

• I’d be really interested to A/B test a short version of the page, letting the video do the selling instead of 10 pages of scrolling content.

Site*: http://campl.us/

9. SEOmoz – choices with the info to make an informed one

Despite how much this looks like a standalone landing page, it’s actually their main pricing page. They’ve taken conversion design principles and applied them directly to the most important page on the site. I like this approach a lot. It’s becoming increasingly common (for good reason) to include testimonials on pricing pages.

What I like

• Trust and credibility: The Verisign symbol is placed next to the purchase button and the grouping of worldwide brand names directly below helps to reinforce the value of the product.
• Succinct headline.
• Subtle mention of the customer count: Beneath the big brand customer logos is a nice little addition – “and thousands more” – adding to the trust element.
• Attention to different reading styles: There is a nice mix of bullet points, coupled with detailed descriptions for those who need to dig deeper.
• REAL testimonials: The photos look like they are taken from social profiles. Coupled with the name and company name, you’d be able to verify that these are real business people quite easily.

Things I’d change or test

• Call to action: The CTA here uses a nice soft word – “TRY”. Which gives off the sense of a low commitment offer. However, the only mention of the no-risk element, is the “30-day money back guarantee” at the top of the page. This should be restated at the point of conversion (i.e. beneath the CTA).
• Would love to know how this converts in comparison to a similar page that had the regular global navigation and footer distractions.

Site*: SEOmoz pricing page

10. Times Reader – showing context of use

As one of the world’s biggest newspapers, they clearly need to keep up with the times when it comes to marketing. (Trying desperately hard for a pun there).

Let’s dissect the final landing page of this collection…

What I like

• Lifestyle. The level to which they demonstrate the modernization of news consumption is impressive. Using a beautiful Macbook Pro and an inline video displays excellent “context of use”, and lets you imagine the new reading experience they are selling.
• It’s a great video that really demonstrates the power that video has to tell a story. Especially poignant given the product.

Things I’d change or test

• Like the SEOmoz page, I’d like to see the safety message (in this case – 2 weeks free), repeated beside the CTA.

Watch the video

Like I said at the start, I don’t want to link to the campaign page, to prevent skewing the stats just for editorial purposes. However, the video from this landing page is freely available on YouTube, which as I mentioned earlier, is a great re-use of campaign content to help your organic rankings.

Click here to view the embedded video.

If you have other great examples of landing pages or have any questions, please jump into the comments.

Cheers,

– Oli Gardner

* Note: links are provided to the associated brands homepage as a way of saying thank you for using their screenshots. I don’t typically link to campaign based landing pages (unless I’ve asked for permission) as that can mess with people’s stats.

Other note: “You suck” image source (from the blog index page)

Below, you’ll find 22 examples of landing pages that cover classic lead capture, product pre-launch/beta pages, ecommerce “buy now” or click-through pages and even a few microsites – and I’m stoked to say that they were all built using the Unbounce landing page platform. As usual, I’ve given them a mini critique to explain why I like them, and a couple of ideas they could use to optimize and test their pages for higher conversions.

Let us know what you think – provide your own critique in the comments

Because many of these companies are either new or small, I think it would be great if the community could dig in and provide their own critiques in the comments at the bottom. Conversion specialists, designers, usability, copywriters and marketers – perhaps you can make a name for yourself by lending a hand?!?!?

Note: If you do comment, include the # of the page you are critiquing for easy reference.

A discussion about conversion optimization

My goal here is to provide suggestions that might help others to solve similar issues on their pages. But more than anything, I wanted to show some of the diversity that’s being created in online marketing.

They’re not perfect (what page is), but they all show something interesting and worthy of discussion (hint hint – comments please!).

See if you can spot any trends…

Click-Through Landing Pages

Click-through pages are exactly as they sound. An intermediary page where the purpose is to persuade visitors to click through to a subsequent page. They are sometimes called jump pages or even romance pages.

Ecommerce Click-Through

A common use of click-through pages is to warm up prospective customers for an ecommerce transaction. The funnel conversion goal is the purchase of an item (perhaps a book or a mobile app) which will occur on the payment or cart page following the click-through page. As a result, the goal of your ecomm click-through pages is to convince people to “click a button” to buy your item – which will carry them on to the transaction page.

To be successful, ecommerce landing pages need to have enough information to allow the visitor to make an informed purchasing decision.

Key content includes:

• Product shots and videos shown in context
• Feature descriptions
• Testimonials
• Clear pricing
• Special offers (discounts)
• Time sensitivity – to create urgency
• Trust indicators: badges, accreditation’s and money back guarantees

These are some of the things I’ll be looking for along with the classic design techniques I referred to in “Designing for Conversion – 8 Visual Design Techniques to Focus Attention on Your Landing Pages“.

1. Mobile App Design Toolkit

Details

Source: A Clever Twist – iPhone & iPad Design and Development

What I like

First off, it’s a beautiful design (I’d expect nothing less from Jen Gordon) – which incidentally is designing a new iPhone App landing page template for Unbounce (releasing next week) so you can look forward to that.

Let’s break it down and look at what’s working on this page:

• An emotive headline: The main title describes an end goal that matches people’s desires.
• Point of conversion interaction: You’ll notice in several places that Jen has placed live chat widgets – most critically, right next to the CTA, to be able to intercept questions from anyone unsure about their purchasing decision. (Note to Jen: would love to hear if you’ve had any interesting conversations with customers using this).
• It has video: There’s a lovely video that describes in detail what you get and how to use it.
• Comes with an eBook: This is a great value add for those who don’t know how to create an app but want t design one.
• Relevant testimonials: The testimonials are targeted towards both target markets (developers and designers). Smart.
• A nice 3 section split: The top section is essentially a landing page in it’s own right, but then you can navigate (or scroll down) for explicit detail about what you’ll get in the kit. This is important for an item priced over a few dollars. The final section adds a nice human touch, showing a nice photo of the designer and family, and a list of previous apps for credibility.
• Price: This is one of the most critical elements. Discount psychology accomplishes 2 things:
  1. $199 sets a higher perceived value and quality for your product
  2. The discount makes it seem like people are getting a good deal
• Payment options: The methods of payment are clearly shown beside the price which immediately answers a common question that every ecommerce transaction brings up.

Things I’d change or test

I’ve already worked with Jen a bit on this page, but I’ll point out a few things that might tip conversions in the right way:

• Product branding: Black bars at the top of a page can be easily overlooked (they blend in with the browser and the contrast from the page makes you start below them). So I would recommend making a bigger deal of the brand (and possibly a logo) for the product itself. In my mind I want to know what it is first, then read the benefit statement (the rockstar title) second.
• A nice big [Play] button: I’d add one on the video to make sure people know that it’s a video and are enticed to watch it.
• Discount urgency: Try putting a time limited statement (til March 5th) or a numerical limit (the first 200) etc. to provide a sense of urgency

2. Franklin Mint – Kate Middleton Royal Doll

Details

Source: The Franklin Mint

What I like

• Timeliness: It’s always a good idea to take advantage of trends or events as the momentum builds. Tip: this is why being able to create landing pages easily and quickly is a great idea – you can jump on hot topics.
• Directional cue: The giant arrow directs you to the interaction/purchase zone.
• Video: Video can help landing page convert better. Aside from that, it also adds an emotional and human connection to the products being sold.
• Teaser: They include a special “coming soon” teaser offer which could make you bookmark the page and come back at a later date.
• Consistent CTA color: Simple rule, keep your call to action buttons the same color (people still break this for some reason). It lets people know what they can/should click. Usability 101.
• Secondary cross sell: Not a strategy I generally like as landing pages should perform better when focused on one thing only. However, each situation is unique, and if you know anything about the demographic that would buy this type of item you’ll know that they are quite obsessed by the royal family and Dianna in particular (even more so given that she was William’s mother).
• Limited Edition: Increases the sense of urgency and makes it feel like your item will be more special. Especially for those seeking to get the very first edition.

Things I’d change or test

• Invite Obama: For a start, if I were Wills or Kate, I’d probably change the wedding invite to include President Obama. Apparently he’s nonplussed about being left off the list :)
• Remove escape routes: I’m going to throw this old standard in because I really can’t find much else wrong with the page. The website at the top is a link (doesn’t need to be), and could cause people to stray – as could the footer navigation. Why is this bad? They will head to the main site where they may become overwhelmed by the selection and leave – or they might by something else. Rendering what could otherwise have been a successful campaign a failure from a metrics and conversion perspective. (i.e. someone or something else will get the purchase credit for your marketing efforts).
• Directional cue contrast: I might try bringing the arrow out a bit by increasing it’s contrast. This could be achieved by changing the color to differentiate it from the rest of the page, by giving it extra whitespace to make it super obvious, or by breaking a visual design plane (e.g. extend the left side of the arrow outside of the page boundary on the left). This visual change would catch your eyes and push them to the important part of the page.

3. Unshaken – The Book

Details

Source: Dan Woolley (author)

What I like

• Emotional video: Compelling content will always increase engagement. And the longer someone listens to you, the higher the chance they’ll buy into what you’re saying.
• Suggested uses: This might not be the type of book you typically buy, but the author cleverly points out that it would make a good gift for person a/b/c.
• Testimonials: Testimonials and association with famous people/shows are included for instant credibility.
• Simple headline: Spells out the drama of what happened and what the book is about. Very simple.

Things I’d change or test

• Testimonials: I’d put a photo of Bear Grylis (the adventure guy from Man vs. Wild) for extra validation (and to break up a text heavy page). I’d also include a Today show, CNN logo and a Larry King photo to show that it’s an important book that’s had a lot of coverage. (Rather than some poorly printed pet project).
• Price: The price is scored out suggesting that there is a better deal if you buy it now. This should be more prominent and positioned beside the button – right now it’s buried next to the small book cover.
• Charity: A portion of the proceeds will go to Haiti. Make this statement more obivous – right now it’s a footnote but it deserves to be given more attebtion.
• Testimonial style: Break the design of the page a bit by making the testimonials look like testimonials. Make them italic to differentiate them from the regular text on the page. Remember, this won’t have any impact by itself, but many micro changes will make a more powerful page.
• Make it clearer that it’s a book: The book image is a bit too buried on the page, and it’s important that people know right away what the object being discussed is.
• Above the fold: try bringing the CTA and perhaps the book and it’s details (price) above the fold – reference Amazon.com for inspiration.

4. Pact – Underwear with a purpose

Details

Source: Wear Pact

What I like

• Glow in the dark underwear: How can you not like that!
• Context of use: They very clearly follow the show don’t tell rule here (video of people wearing the product) – so maximum “Context of Use” points.
• Focus on video: It’s a very simple page with only two real options. Watch the video or leave. There are some ways to ensure more people watch the video which I’ll cover below.

Things I’d change or test

• What is it?: The headline is too brand oriented. It says nothing about what is being sold. You could solve this by changing the headline from FIREFLIES to FIREFLIES – Underwear that glows in the dark! (this statement alone will peak interest levels to a much higher point).
• Charity: One of the great things about Wear Pact is that they donate a portion of their profits to a worthy cause that’s happening “now” (rather than being tied to one charity). But this is only given a tertiary mention in the paragraph of copy below the video. Break out the information into chunks, highlight the fact that a portion of proceeds will go to Haiti, use a logo or badge from the organization involved in the donation.
• Video autoplay: Eek. Contentious. And I general hate it. But this is about testing – so set up a variant with autoplay on and see how it affects your conversions. You never know.

5. The Lion Movie

Details

Source: The Lion Movie

What I like

• Johnson boxes!: These red dashed lines are one of the oldest marketing design techniques (originating from direct mail) and although it’s old school, it’s still an effective way of drawing attention to your call to action and also perhaps relating to a demographic that might buy this type of gift (age wise).
• Discount for bulk purchase: An old trick, but perfect for this scenario. If you buy extra tickets (which you always would – who watches a family movie alone?) you get them at a perceived discount.
• Obvious what you’ll get: The photo of a DVD and movie ticket are self explanatory.
• Appropriate amount of content: Given the relatively low cost of the item(s) and the familiarity everyone has with movies and DVDs – the amount of content on the page is appropriately short.
• Implied urgency: Cinemas only have limited seating, which increases the desire to purchase in advance.
• Price discount: It works on infomercials (despite the fact that we all know it’s being done to us) – so including a discount is a good motivator.

Things I’d change or test

• Where’s the video!: This is the perfect page to use video to sell. Show a trailer from the movie to build attachment.
• Do the extra tickets also come with a DVD?: It’s not clear if I’ll get just the ticket or both for the $10 extra ticket price. The copy from left to right is in conflict – ensure they agree with each other so people know what to expect.

6. Course Park

Details

Source: Course Park

What I like

• Focus: The page is focused on only one of their courses which will help when achieving a strong message match with upstream ads, and quality score for PPC.
• Clear CTA: No question where to click or how much it costs.
• Money back guarantee: Increases trust and removes buyers fear – a key ingredient for successful ecommerce landing pages.
• The pretty girl: What can I say, I’m weak…

Things I’d change or test

• Course format: I can’t tell from reading the landing page what format the course will be in. CD, DVD, online, in person (the photo indicates this might be the case)? Showing a photo of the medium would let people know what is being offered.
• Contextual examples: I’d really like to see a video or screenshots of the course materials in use. Rosetta Stone do a decent job on this page (still several things I’d change though) – showing a laptop for the online course and saying that the box sets contain interactive CD-ROM’s. There’s also a video at the top.
• CTA secondary description: While the CTA has some plus points (mentioned above), it should describe what you get (the format). e.g. Buy Now $9.99 (includes 5 interactive DVD’s) etc.

7. Japan Times Learning Center

It’s hard to say much about this because I don’t read Japanese, but I thought it was worth including. One thing I found a tad confusing was the mix of English and Japanese in the title and branding.

Details

Source: Japan Times Learning Network

What I like

• Macgyver: Without knowing a lick of Japanese, I managed to mangle my way through the form on the subsequent page, which leads to a credit card payment screen. Hence it’s in the eccomerce section of the post. So really I’m just patting myself on the back.
• It’s in Japanese: It’s really cool to see non-English pages being created in Unbounce.
• Testimonials: If that’s what they are, they have included photos, which helps break up an otherwise text heavy page.
• Repeating CTA: It’s essential on long pages to repeat your call to action at strategic spots. (e.g. top, middle bottom).

Things I’d change or test

• CTA contrast: The calls to action are a little hidden. I’d prefer that the entire button (not just the arrow) was treated with the green color to make it pop out from the page. Or ideally, a color that didn’t match the bullet points and sub headers elsewhere on the page. Currently it makes it unclear which elements are interactive.

Social Media Click-Through

Social media oAuth features such as Facebook or Twitter Connect allow you to create more of a Single Sign On (SSO) concept, where the barrier to entry is reduced by letting people use existing account credentials to access your service.

8a. Gameground’s Halo Reach Facebook Connect

Details

Source: Gameground

What I like

• Know thy audience: The Gameground idea is all about socially connecting your game experience, so using a Facebook login is a great way to relate to your target.
• Speak their language: The mission descriptions can probably be recognized by players of the game – which will get them excited about the reward points they can earn.
• Tapping the arcade mentality: This is a “Like” for the concept – as it seems to imply that there will be high score tables (like on old arcade games).

Things I’d change or test

• Needs a clearer statement of what it does: After reading the whole page I don’t really get it. How does it connect and enhance your gaming experience?
• Example rewards: What can I use the reward points for? Show me something I’d like to aspire to and I’ll be more likely to try it.
• Clarify headline: “Complete missions and discover what’s next in Halo Reach” – implies that I might actually get an in-game special/secret bonus. Is this true? I thnk a little more detail could help here.
• Leaderboards: It says you can beat high scores and compare with your friends. How? Will there be an online (Facebook?) leaderboard. Showing a screenshot of this in context or explaining how you’ll be able to brag to your Facebook friends would be enticing.

8b. An alternate design direction

What’s great with this example is that we actually have a B page that GameGround used in an A/B test. This version produced a 60% higher conversion rate over the full funnel conversion goal. I’m going to be completely honest and say that although I added all of these images before I started writing, I’m doing the critiques one by one, and haven’t given any thought to this B version until now, so it will be interesting to see if any of the changes made correlate with my comments above. :)

Details

Source: Gameground

What I like

• Hero shot: This design has a much stronger hero shot image which screams Halo.
• Branding: The top bar now includes a stronger sense of who the company is (GameGround) and the “now with support for Halo Reach” implies that they do similar cool stuff for many games.
• Simplified CTA: The button is now focused entirely on Facebook which makes it stronger
• Better explanation of concept: There is a slightly improved sense that you can unlock extra stuff/levels in the game – but still not much to explain how.
• Competition: The leaderboard (at least I predicted that one) gives a sense of competition between you and your friends.
• Cleaner design: The design is a lot simpler.

Things I’d change or test

• Number of CTA’s: There is only one really clear thing to do which appears good at first (click the Facebook button). But the three feature boxes at the bottom get negative points as they all link to the same page as the Facebook CTA. I’d prefer if they launched small modal dialog windows (Lightbox style) that answered some of the questions people will have about the core features without removing them from the page or taking them to content they weren’t expecting.

Service Registration Click-Through

The major difference between this type of page and the ecommerce pages is that the destination page is a registration page – usually for an online product or service. B2B software as a service (SaaS) companies with monthly subscription models are a common use case.

Important elements to include on registration click-through landing page are:

• Screenshots showing the online application
• Logos of other companies using the service
• Illustrative diagrams illustrating how the software solves the pain of it’s target customers
• Indicators of no-risk (free trial) and low barrier to entry (quick to sign up)
• Clear statements of benefit
• Elevator pitch (30-60 second) style video demos

9. UberVU

Details

Source: UberVU

What I like

• Context of use: Showing a screenshot on a computer shows the app as it would be used and it’s a nice touch to show extend the whitelabel feature by pointing to where your own logo would go.
• Clear-ish headline: The headline area is nice and prominent, however you have to read all 4 lines to get the point. Sadly the final two lines are the critical ones.
• It tells a story: As soon as the second headline kicks in, you get the sense that they are really following the headline into an explanatory phase. This is a critical part to great copywriting. Also, each section ends on a positive note to wrap up the point.
• Trust indicators: Bags of trust points for having a slew of big brand clients presented in a color neutral way so as not to interfere with the power of the CTA.
• Strong and descriptive CTA: The CTA is dominant on the page and would easily pass a 6-ft test. (stand 6-ft away and try to spot the most important interaction point and what will happen when you click it).
• Clean design with lots of whitespace: Makes it really quick to scan and simple to read. This type of design really adds a professional feel to the page, very Apple-esque in many ways.

Things I’d change or test

• Video: Rather than having to sit through a demo – I’d like to see one right now. Putting a nice intro video 1-3 minutes into the iMac image would be a really nice way to increase engagement. You could also do an extended sales pitch on why they should request a full demo.
• Risk/barriers: A small mention below the CTA to qualify the process would be useful (can I get a demo now or after filling out a massive form? How easy is it to get started with your software, is there a money back guarantee or a trial?)

10. 99designs

Details

Source: 99designs.com

What I like

• Very clear statement of benefit: The headline (and subheader) spell out exactly what 99designs does and how much it costs. This would be a great example to bookmark for reference.
• Flow diagram: Not really a diagram, but by using numbers and arrows, they lead you through the process so you know how it works and what to expect.
• Samples of work: A selection of beautifully designed logo’s puts trust behind their brand promise.
• Descriptive CTA: Instead of the dreaded “submit” button – they’ve gone for a perfectly written CTA – “Start a logo design project” does many things. Firstly, it let’s you know that you are going in the right direction to get a logo created, it also warns you subtly that there will be a few steps involved (by using the word start).
• Social proof: There is a mention at the bottom of the page that states “Join over 40,000 satisfied customers today” which builds trust in 99designs ability to deliver consistently.
• Guarantee: Trust is improved by the promise of a 100% money back guarantee – nicely positioned close to the CTA.

Things I’d change or test

• Enhance the social proof: I’d try bringing the statement of 40,000 customers right up to the top – perhaps even as an annotation under the CTA.
• Add some contrast: Some areas of stronger background contrast would really help chunk up the content and make it more digestible.

11. Tropo – The SMS Experts

Details

Source: Tropo

What I like

• Bold, clear value proposition: It’s pretty clear what Tropo do. They let you enable your apps to send SMS messages to people’s phones.
• Trust: Lots of trust indicators used here: from a delivery guarantee, a list of all the major supported carriers, logos of big customers, and the backing of the biggest SMS platform provider in the world.
• Flow diagram: There’s a really simple 3-step diagram to help you visualize how it works.
• Speed to implementation: “Start developing in 60-seconds or less gives people incentive to give it a shot”. This probably only relates to getting your account set up but that’s half the battle.

Things I’d change or test

• Order of the header imagery: I’d try placing the CTA on the right-hand side of the flow diagram. So your eyes can naturally shift from left to right, figuring out what they do, ending on the call to action. Right now it feels like you’re being asked to start before you’ve had a chance to look around.
• CTA inconsistency: I’d prefer to see the bottom CTA retain the color and feel of the one at the top. Currently there are so many colors floating around the page it’s not immediately clear where you should be clicking.

12. Watch Mouse

Details

Source: WatchMouse

What I like

• The mouse has a massive eye: Gives me confidence that he’s paying attention :)
• The CTA dominates the page: There’s only one thing to do and it stands big and proud above the fold.
• Simplicity: A registration based click-through page needs to communicate an idea simply and quickly – this page is designed to communicate quickly (although it needs some work on specific communication aspects – see “things I’d change or test” below).
• Endorsements: Including the logos of big name customers increases trust and adds a little extra “if those guys are using it, then I should pay attention”.

Things I’d change or test

• CTA text order: I’d flip the hierarchy of information in the CTA to say [What you are going to do] followed by [A trust statement] to produce something like “Set up your public status page in minutes (Free 30-day trial).
• What is a public status page?: I have to admit to not being 100% clear on what these pages are and what they’re for. So I’d make sure I’d make it very clear what they are with a visual example in the top portion of the page.
• Screenshots are hard to read: It’s good that there are some screenshots of example status pages included, but they are hard to read. I’d suggest either focusing on one larger image or making it interactive to allow people to pop up enlarged versions.
• Explain the why: The headline states “Use a public status page”. It would be good to explain explicitly why they are a good idea and provide examples of companies that use them successfully (and what types of information they use them for).
• Increase the contrast: The main headline banner is close in color to the CTA. I’d change one of them so that the CTA pops even more.

13. Asking Canadians

Details

Source: Asking Canadians

What I like

• Strong visual communication: The multicultural imagery (and language chooser) ties in very well with the language of supporting your community.
• Simple explanation of benefits:
• Visual separation: The offer and benefits are clearly separated by the use of the enclosing gray area. This makes the amount of text content less daunting when you arrive at the page.

Things I’d change or test

• Consistent CTA: There are two “Join Now” buttons on the page, and each has a different design. I’d prefer to see an identical button style. There’s nothing wrong with having different copy on the buttons, but they should be identical stylistically.
• Value reminder: The call to action could be enhanced with a reminder of what you could get when you join. A double-lined CTA would provide clarity. e.g. Join the Research Panel (for a chance to win $1,000 in rewards).
• Interactive elements: The “$1,000 worth of:” in the subheader is designed to look a bit like a button and commands most of the attention on the page. While it’s important to give weight to the core benefit of registration, it could be done in a less interactive looking way.
• Word placement: Consider moving the word “win” from the end of the subheader to be the first word of the next line – to produce “Win $1,000 worth of:”. A subtle change that reads in a more powerful way.
• Copy position: The benefits listed on the second half of the page could be called out more (what they are) by separating the line “Here’s what you will get:” onto it’s own line above the three bullets. For extra clarity, the wording could be changed to say something like “Here’s what you’ll get for joining Asking Canadians:”

Landing Pages with Forms

Many landing pages include forms: either to collect user data or to process their requirements for the purpose of looking up a second level of information (search, booking). In marketing, the most common use of a form is the former and is known as lead generation (lead gen) or lead capture.

Lead Gen

As the name implies lead gen landing pages are used to generate a list of customer leads (usually in the form of an email address or phone number) for the seller.

Effective lead gen pages follow some specific guidelines:

• Short forms: Don’t ask for more information than you need.
• Give to get: You should be giving something away (the prize) to help persuade your visitors to part with their personal data.
• Balance the size of the prize with the effort required: An exchange of information should always be fair. People are reluctant to give up their information, so make it worth their while. The bigger the prize you are giving away, the more information it’s okay to ask for.
• Use contrast to visually separate the action area: Your lead gen form is the key interactive area of the page – use visual design rules to make it stand out.
• Beware the fold: As much as I hate to use this old-school term, it still has an impact on some people. The standard rule is to keep the form button (your CTA) above the fold. This is impossible with long forms, so you have to employ visual cues to help point the way. Read “HOW TO: Keep Your CTA Above the Fold on a Lead Gen Landing Page” for more information.

14. The Martell Experience

Details

Source: Martell Home Builders

What I like

• Directional cues: The whole page is designed with directional cues pointing at the email form. There are three in total: the photo points down, the “sign up now” arrow points to the right, and in a subtle way, the roof on the logo at the bottom points up. Very nicely done.
• Choice of contact method: From testing I’ve done, there is always a portion of your customers that won’t like your chosen method of contact – guaranteed. So offering both email and a phone number gives them options.
• Trust: Providing a big phone number lets visitors know that there are real people behind the business.
• Happy photography: There’s a fine line between cheesy stock photography and imagery that really works and this one really works in my mind. Anyone who’s moved can relate to the feeling of moving into a new home (and the associated stress). This image paints a picture of a painless and happy experience.

Things I’d change or test

• Buying a new home where?: The advertising for this page is probably well targeted at specific geographic locales, but it still produces an element of doubt when the location isn’t included.
• What do I get?: After reading the CTA, I can see that I’m going to get a 99-day guide. But there’s no visual cue on the page to make me think I’m going to get a report until I’ve already decided I’m ready to go. I’d suggest trying an extended secondary headline, perhaps like this: “Use our free 99-day New Home Countdown Guide – and start moving into your new home:”. That way the expectation is set right away that you’re offering help in the form of a guide.
• What’s in it?: If you are giving something away (and want people to want it), provide a preview (the first 10 pages or first chapter) so they can see the quality and understand the benefit of doing business with you.
• Copy tweak: Instead of “Sign up now”, I’d test something less committal like “Get the guide now”.
• CTA color contrast: This is the point where I’d say that the button should be a different color than the rest of the page to make it stand out, but there are exceptions to every rule. Given that the entire color palette consists of only 4 colors, I sense it would be hard to find something different that wouldn’t ruin the calming aesthetic of the page, so I’m going to leave this one alone.
• Trust statement: The anti-spam trust statement in the footer about not sharing your email, could be connected to the email form a bit more closely. Whether through an asterisk (*) on the text inside the form to indicate that people should read the statement below, or moving the text to the area directly below the form.

15. Overtis

Details

Source: Designed by Matizmo

What I like

• Clean contrasting design: Separating the content from the action area (with the enclosing gray box) lets you know what you need to read and what you need to do.
• Directional cue: The strong black arrow leads the way to the action area.
• Bullet text styling: The bullet points are very easy to read as the intro to each (just like what you’re reading now) begins with a statement in bold.

Things I’d change or test

• Stats: I’m guessing from the content on the page that the white paper will provide some statistics about retail fraud in the UK. Pull the juiciest of these and boldly state it on the landing page to lift the level of persuasion. This will also make people more inclined to talk about or share the page – helping you to gain valuable word of mouth exposure. Remember that even if someone downloads the whitepaper, they might not read it now (or ever), so if you can plant a salient and powerful stat in their brain, you have armed them with a water-cooler topic.
• Don’t submit!!!: REgular readers will know that I hate buttons that say “Submit”. Its a simple rule. State exactly what will happen when you click the button. In this case it could be “Get your free white paper now”.
• Make the headline more descriptive: The headline as it stands doesn’t tell you very much. The important details are spread between the headline, the small red statement above it and the content below. But a good portion of your visitors will leave before putting in the effort to read all of it. I’d like to see a more specific headline like: “Learn how to increase revenue by beating retail fraud”. The word “learn” indicates that you’re going to teach them, “increase revenue” provides the incentive and “beating retail fraud” targets a pain point of your visitors.
• Provide a preview: If your content is worth reading, stand behind it by offering a free sample. Try-before-you-buy is a tried and true technique that can be utilized here by offering up a free chunk of the white paper to whet the appetite.
• CTA contrast: I let the last page off the hook, so I’m going to jump back on this idea now. With such a plain design, a bright and boldly colored CTA would leap off the page. Give it a try.

16. Scoop St. Deals

Details

Source: Scoop St.

What I like

• It’s dead simple: If you want to get New York deals, enter your email. Simple.
• Trust statement: It seems obvious when it’s right there (nicely positioned close to the form) – but if you were to take the no-spam statement away, the form instantly loses valueable trust points.
• Clear CTA: Visually it stands out on the page. In terms of the copy on the button, it tells you exactly what you’ll get (today’s deal). Perfect.

Things I’d change or test

• Hierarchy of information: The yellow strip at the top contains really powerful social proof (30,000 people in New York alone have trusted us with their email), yet it’s hidden in what could be a browser status message area. I’d try flipping it beneath the blue branded header.
• Frequency of emails: The CTA lets you know that you’ll see today’s deal, but how often will I receive emails from you? Daily? (probably) But you should say somewhere on the page.
• Radical design change: Another idea my insomnia just brought to bear would be to leverage the social proof in a more visual way. Imagine an overhead shot of a corner store that had a deal on (big DEAL sign in window) – and a line up of 30,000 Photoshop’d people lined up the street to get at the deal. This would represent two things: the fact that you’ve reached a critical mass that makes you trustworthy, and also that you can get the deal online and forgo the lineup. Just a thought.

Pre-launch Lead Gen

The coming soon page is seeing a renaissance of late. Gone are the 90′s “Under Construction” pages, and in their place are private beta invites, sneak peaks and viral sharing tools to gain entry. And it’s all about lead gen. Gathering a list of interested potential customers before you launch, so you have someone to market to when you open the doors.

17. Band Demand

Details

Source: Band Demand

What I like

• Bold relevant design: It’s clear from the moment you see the page that it’s about music, and it’s about local music (Austin in this case). Localized pages need to make this very clear to avoid getting false leads from people who don’t realize. Here you are left in no doubt that it’s about music in Austin.
• Directional cues: The bright red leads your eye to the Sign Up graphic (tip: insert important info here) and the arrow points you down to the form.
• Social sharing devices: Music is very social content, as is the information surrounding it, so I like that there is a social sharing widget on the page.

Things I’d change or test

• Messaging: The brand and messaging seem to be slightly in conflict (the name makes me think of a crowdsourced movement to encourage bands to come to your local area) while the messaging says it’s about updates and discounts. For the record, this is to be expected when you’re refining a pre-launch page, as part of the purpose of the page (and in testing it) is to hone your messaging until it’s very clear – ready for when you launch for real.
• What’s coming soon?: Is Band Demand coming soon? Or is the Austin portion of the service coming soon? I’m wrong about my classification of this page if it’s the latter (which is implied by the big “coming soon” stamp over the word Austin.
• Brighten the form text: The text in the form is very hard to read – it needs to be brightened up a bit so it’s more obvious.
• Email or snail mail: I think I’d remove the envelope as it implies regular mail, and it would improve the contrast of the arrow.
• Try alternate social widgets for social proof: Instead of the generic Share This widget, I’d consider using Facebook or Twitter sharing buttons that show a share count as they are used. This provides a sense of social proof which can increase trust. Most widgets like that allow you to show or hide the count. My recommendation would be to hide the count until the number is vaguely impressive and then show it.
• Try alternate social widget placements for higher usage: On a lead gen form like this, you can often get more action on your sharing buttons by placing them on the confirmation page. Read this post on “Post-conversion Strategies for Lead Gen” for more details.

18. Clever Scale

Details

Source: Clever Scale

What I like

• Simplicity: This is what we do, here’s a screenshot. Give us your email and we’ll let you know.
• Multiple engagement mechanisms: At the pre-launch phase it’s important to build leads in many ways (and different people have different preferences). So adding in Twitter, RSS and (assuming) RSS Email opens up choices for visitors.
• Sneak peek: The screenshot provides a teaser of what’s to come to help nudge people into subscribing.
• Descriptive words on the CTA!!!: It’s about as simple a statement as it could be “get notified” but it at least describes what you are doing. They get +1 for not saying “Submit”.

Things I’d change or test

• Bigger screenshot: Let people click on the screen for an enlarged view.
• Add a few bullets of features to expect: The screenshot alludes to an analytics dashboard – this could be described along with some benefits of the service and the company behind it.
• Offer a white paper or report: Cloud storage (and it’s benefits) might not be familiar to all visitors to this page (unless it’s very well targeted at CTO’s), so offering a free report about why cloud storage is the way forward, would provide some real benefit to people and enhance your position as a thought leader or expert in the field. It would also increase your conversions.

19. Contact Complete

Details

Source: Contact Complete

What I like

• The blog link: Normally I frown on extra navigation on landing pages (especially global nav), but as I mentioned at the start of this section, “pre-launch” pages are evolving, and at this stage it could be beneficial to allow this secondary engagement mechanism. The blog will do two things: provide extra content that may help people believe in your business concept and extend your contact methods via a potential RSS subscription.
• Explicit value statement: You are told (nicely in the context of the form) that by entering your email you can become an exclusive beta tester.
• Clear bullet points: Bullets are much easier to scan (for the info that will trigger your particular conversion impulse) than a paragraph of text, and I also like the way the intro to each bullet is bolded to provide emphasis.

Things I’d change or test

• Diagram or photo?: The picture of the salesman (if that’s what he is) is the most striking thing about the page, yet it doesn’t tell me anything about what the company does. In a circumstance like this, I often find a diagrammatic representation of how the system works is worth a million words (and this page is a touch text heavy). This example from WebTrends has a very similar layout but tells more of a story.
• Action area contrast: Highlight the action area (the form) by enclosing it in a colored box. Not only does this draw the eye, but it also relaxes your brain by telling you that it’s the place you need to visit after you’ve finished reading the content on the page.
• Make the examples clearer: I don’t really understand the content in the lower-right corner. Why and how are people sharing this information – and what precisely are they sharing (could spark privacy concerns here)?
• Action area title: I think the statement about becoming an exclusive beta tester is a stronger and more actionable headline for the form area than “The free industry directory is coming”, so I’d use that as the opener above the form.
• Go?: Nope. Make the button describe what will happen when you click it. I’d try “Become an exclusive beta tester” (which could fit on a bit button on the next line, rather than crammed on the end).

Online Booking

Online booking forms generally differ from classic lead gen because you’re not required to enter any personal information until you decide to book or not. (There are exceptions to this, but in my mind, anyone that asks for an email address before showing you room availability is asking too much).

20. Mammoth Lakes Ski Accommodation

Details

Source: Mammoth Lakes Ski Accommodation

What I like

• Alternate contact methods: Many people still lie to do their travel bookings over the phone (both for credit card security reasons and for the personal touch). This page obviously recognizes this by placing the phone number right at the top – saying “we have real people waiting to speak to you” which adds trust.
• Context of use: The photography makes it very obvious why you’d be staying there – for beautiful mountain scenery and skiing.
• Clear value proposition: The opening headline makes it very clear that they are offering discounted rates.
• Subtle urgency: The statement – “Book Now and Save” quietly implies that you can get a better deal if you hurry up and book it right away.
• The form only asks for the essentials: Only the arrival and departure dates and number of guests are asked for – no email or personal data is required (which would scare some people away).
• Relevant call to action: “Check availability now” is perfect CTA text. 10/10.
• Testimonial: There haven’t been all that many testimonials in the examples so far, but they are critical for travel related pages. Testimonials (if believable – see below) can greatly increase your conversion opportunities.

Things I’d change or test

• Alternative testimonial methods: As I mentioned above, testimonials are a deal breaker for travel related conversions. The more believable (and verifiable) they are the better. Two ideas spring to mind here:
  1. Link (in a new window) to, or show content (with links for verification) an independent travel review site such as TripAdvisor.com – if you are good place to stay, there will be good reviews and the transparency will boost your sales significantly.
  2. Show a social feed of positive commentary about your location and/or company. See the section titled “Testimonial social proof” in this post about social landing pages for more details.

Microsites

Microsites are essentially a half way point between a landing page and a website. They usually have about 3-10 pages (ballpark) and what makes them different to a small website is that they are usually still built to be promotion specific. They have been commonplace for higher priced items for a long time (cars being a prime example). When compared to a single standalone landing page, they provide an extended experience with a very different interaction experience (including navigation, exploration and longer conversion paths).

21. Vinotrac

Details

This is actually more of a complete site (as opposed to a marketing based microsite) but I’m including it to showcase what’s being built with Unbounce. As such it’s hard to critique in the same realm of the landing pages that we’ve already studied.

Source: VinoTrac

What I like

• A whole site!: To start with I just want to say that Unbounce wasn’t designed/built to construct microsites (at this point we’re focused on landing pages) – so it’s just kinda cool that the Vinotrac guys have built their whole site with it.
• Barrier reduction: The CTA includes the statement (no credit card required). If this is the case, it’s always a good thing to mention on your call to action as it let’s people know up front that there are no financial barriers during the signup process.
• Design is focused on the value proposition: The headline is given lots of space which helps it stand out as the primary thing you see when the page loads. A high quality screenshot is shown that allows you to see enough detail to understand a good portion of what the app is about.
• CTA contrast: The orange buttons really stand out against the page design, drawing your eyes to them using the principles of contrast and color.
• Simple content layout: The content on the homepage is nicely chunked and spaced out to facilitate quick and easy reading.

Things I’d change or test

• Main headline communication: If you were to look at the headline in isolation you’d be hard pressed to know what it was referring to. The subheader helps a bit, but my advice would be to test the headline by itself (just show it to people on a piece of paper and ask them what it means) until it’s 100% clear.
• Nothing to install: The content in the lower left section (“Nothing to install or worry about”) focuses a bit too much on the benefits of online software as opposed to the Vinotrac application itself – I’d use this valuable space to highlight a core feature or benefit.

22. Audio Cubes

Details

Source: Audio Cubes

What I like

• Context of use 1: The visual design mirrors the lighting experience that occurs when using the product in a live environment. Setting the mood is an important way to connect with the expectations and desires of your visitors.
• Context of use 2: Two videos are used as primary communicators to show the product being used.
• Clear CTA: The bright yellow call to action stands out clearly against the dark background and as a unique color on the page.

Things I’d change or test

• Separate interactive elements: The navigation links are colored the same as the headline, logo and bullets. Whenever possible, try to separate your page interactive elements from content.
• Buy now (how much?): There doesn’t appear to be enough information to support an informed purchasing decision. This could be aided by including the price on or near to the CTA. Don’t be afraid to be transparent. If your product is expensive, letting people know that will add the perception of quality – don’t shy away from the truth.
• Awards & testimonials: Two awards are listed at the bottom of the page coupled with some testimonials. Extra weight could be added to these areas with some titling (e.g. “Testimonials & Awards”) – remember, people are impatient and if you can make different areas of content easier to comprehend, they will digest more of the information in the few precious seconds they spend on your page (they don’t even need to read the content – just knowing that you’ve won awards can be a difference maker).
• Trust and reassurance: The “Where to Buy” page has details of a money back guarantee, but if you don’t visit this page you’ll miss this vital information. For those who click the “Buy Now” button for exploratory reasons (perhaps to find prices) – you could re-present the guarantee details on the purchase page.

Landing Page Trends

Did you spot any of the following trends? Notice anything else?

• CTA text: There are still way too many people using the word “Submit” on their buttons. Shame on you. :)
• Video: Only 5 of the 22 used video (tsk tsk). Interestingly, most of them were on ecommerce click through pages.
• Page length: Long landing pages used to be the realm of the long form sales letter only, but I’m seeing more and more long pages appear that are professionally designed and essentially split a microsite into a single page.
• Microsites: Question: how important are multi-page sites for your marketing needs? And feel free to debunk/argue with anything I’m saying – I love to debate and talk about this stuff…

What do you think?

Please jump into the comments and share your thoughts about how these landing pages could be further optimized.

– Oli Gardner

Enjoy…

Loop 11 Usability

Page Details

Type of landing page: Click Through
Website: Loop 11
Built using Unbounce?:Yes

Why I Like It

It has a Zebra crossed with a Rhino! How can you not like that?

It’s a very congruent page, where the imagery supports the headline (a new breed). The call to action is very obvious, using conversion design principles (whitespace and contrast) and has text that explains a key benefit (that you can try it for free). The compelling design kept me on the page for a long time and more importantly, made me want to share it with other people. Having a viral quality is a big bonus for a landing page.

Optimization Suggestions

• Considering the viral quality of the design, I’d like to see some type of “Share This” social media button (Facebook or Twitter).
• After clicking through to the destination page (a sign up form) – I noticed that the application can be used on an iPad. It would be a great test to have a video on the landing page that plays inside an image of an iPad. Showing the tool in action could provide the extra information required to inspire a sign-up.

College Ready or Not?

Page Details

Type of landing page: Lead Gen
Website: College Ready or Not
Built using Unbounce?:Yes

Why I Like It

The design is fun and original, and helps establish the tone of a learning environment. The form stands out well due to the contrasting color and makes it very obvious what the intended conversion goal of the page is. The sidebar is set up well to provide a list of benefits – easy for testing.

Optimization Suggestions

• The page could use a stronger headline that describes the unique value proposition of the service. It takes a little while to understand what you are signing up for.
• The CTA should describe what it is you’ll get by registering.
• Ideally the submit button would be more distinct. Right now it doesn’t look like a button. Although, it’s only small factor on a page this simple.
• Consider having different landing pages for the separate demographics (students and parents). This would allow you to target your messaging more closely to their needs.

Styllist

Page Details

Type of landing page: Lead Gen
Website: Styllist
Built using Unbounce?:Yes

Why I Like It

It’s instantly obvious what the page is about. Fashion. The headline spells out the core value of the service and the single field lead gen form provides a low barrier to entry for people interested in receiving updates.

Optimization Suggestions

To encourage more people to sign up, I’d like to see a few extra pieces of information on the page:

• An example of the type of information you will receive. A lightbox popup containing an example email, that shows the inside information subscribers will get, might convince me to register.
• A short privacy statement to let me know you’ll not abuse my email address.
• Perhaps an indication of when you might launch?
• Who is it for? If it’s just women’s clothing, you should probably state that in the copy. It’s implied by the photos, but not explicitly stated. If it will cover men’s fashion, either include some male models in the photos or create a separate landing page for each segment.

What’s The Dealio? San Francisco.

Page Details

Type of landing page: Lead Gen
Website: Where’s the Dealio
Built using Unbounce?:Yes

Why I Like It

Firstly, a beautiful design that echos the vibrant color of the Golden Gate Bridge. From a conversion standpoint, the fine print beneath the form lets you know what to expect – a daily email.

Optimization Suggestions

• The main headline is being A/B tested on different versions of the page which is great. From the three I saw, the one shown seemed to be the strongest (but you can never tell). I’d like to see a very direct statement here that says something very simple like: “Get a new San Fran discount every day”.
• Like the previous example, showing a sample of what you’ll get might be of benefit, although it’s less of an issue here as the service is live and you’ll get something sent to you almost immediately.
• I’d change the CTA to say something like “Send me the dealio” rather than “Submit”.

360 Feedback

Page Details

Type of landing page: Lead Gen
Website: 360 Feedback
Built using Unbounce?:Yes

Why I Like It

Simple clean design, with a subtle directional cue (the owls beak) that points to the form and matches the CTA color. The informational hierarchy encourage reading: brand->value proposition->benefits->details->CTA.

Optimization Suggestions

• Like the previous example (above), it breaks a fundamental rule of conversion – the non-descriptive CTA. Change the button text to describe what you’ll get when you click it.
• The statement “Find out more” doesn’t provide enough of a sense of what I’ll receive. Will it be another page? A PDF? An email full of information? To find out more, I might just type the brand name into Google, rather than give up my email. Let visitors know what they’ll receive and make it a worthwhile trade.
• If the product/service hasn’t launched yet, make this clear. If it is live, then provide access to some screenshots or a video of it being used.

Smooth Sailing

Page Details

Type of landing page: Click Through
Website: http://events.cheznouspresents.com/smooth-sailing-2010
Built using Unbounce?:Yes

Why I Like It

Ok, this one’s a touch controversial as it was created by one of the co-founder’s of Unbounce (Carter). I’m including it in this list for two reasons: I like the page and it’s use of social widgets, but re importantly, I couldn’t resist the opportunity to say what I think is wrong with it :)

On the plus side it’s got a great aesthetic, indicative of the genre of music that it’s promoting and it has a wide range of modern landing page features to increase engagement:

• Video: you can listen to some smooth music while you check out the band list.
• Social Proof: the Facebook widget shows photos of anyone you know that’s “recommended” the page alongside a count of smooth music fans.
• Secondary CTA’s: the footer has a couple of extra ways to stay in touch.

Optimization Suggestions

To keep people on the page longer and enhance the chance of a conversion, I’d suggest the following:

• Provide a clearly stated secondary headline beneath Smooth Sailing, which describes what the event is. “12 Vancouver Bands Play Yacht Rock Covers from the 70s”. This would make me understand it a lot more quickly.
• Add a play button beside each band to let you hear an audio preview (a la iTunes).
• Put a lighter background behind the Facebook widget – right now it’s hard to see.
• Throw up a lightbox style popup with a Map to the location “The Biltmore” – to prevent people leaving the page to figure it out.

SmartyPants

Page Details

Type of landing page: Click Through
Page link: http://deals.wearesmartypants.com/back2school3b/
Built using Unbounce?:Yes

Why I Like It

I like the idea of vitamins being kid-friendly and the design reinforces the fun factor. As it’s targeted at parents, they do a good job of answering three core concerns a parent might have: Will this help my kids take vitamins? Is it safe? What’s in it?

I also like the safety net CTA which offers up a phone number if you have any questions. The “As Seen On MSNBC” is also a good trust signal to potential buyers.

Optimization Suggestions

• I would be interested to see how much information is required to make a purchase of this type of product. Typically, landing pages perform better when you remove extraneous navigation from the page. A good test might be to remove the 16 links found on the page. Perhaps the target buyer (mothers) like to spend the research time. A technique to keep them on the page longer would be to use some modal popup windows that show the explanation of scientific terms and the doctor bio without making them leave. As an example, check out the “Contest Rules” link at the bottom of our contest landing page.

If you have a landing page you’d like us to feature – send me a link at oli@unbounce.com