Unbounce Landing Page Design - Iceberg

Unbounce Landing Page Design

View Portfolio

Use a big headline
and hero shot

A large colorful headline should dominate. Don’t be subtle: use big, bold, clear text with a single dominating photo (that shows them what they’ll get) along with a caption — the second most-read copy element. The headline should convey both the product benefit and special offer.

Use a video

A video (especially from a news source) adds credibility and provide information in a easily digestible way. The interactivity keeps a customers attention. Don't have it autoplay.

Show people

People are naturally drawn to people. Using an image showing the eyes creates more impact.

Make sure the landing
page syncs with the ad

Make sure to state the same offer in the same terms with the ad that got them there, and use copy and graphics that are constant with the creatives.

Use recognized logos

Quotes from recognized news sources add credibility.

Address the reader with your copy

People read left to right. Use you and your. When applicable, paint a picture of how the product affect the consumer (i.e. a Home Shopping Network-style sales pitch).

Use testimonials

Quotes from the current customers gives the new ones reassurance. Putting positive testimonials on your site can increase sales by 34%. Consider adding customer photos next to each text testimonial. Photos featuring people can double your conversion rate.

Use an easy-to-
complete form

Short form: use the fewest fields you can and make the form as compact as possible. Pre-populate data whenever possible. The more targeted the better. Make the submit button clearly visible.

Action button above
the fold

Place the key action button "above the fold", the area visible without scrolling.

Minimize risk and fear

Include seals such as Money-Back Guarantee, Risk-Free Trial Offers, Secure Server, Free Shipping and Easy Returns. The icons can dramatically increase conversion rates.

Use a single landing page

Multiple-page order processes drop conversion rates.

Make text easy to read and skim

Make copy clear and readable, and try to use bullets for quick scanning and increased retention. Any subheads should convey the essence of the message.

This case study shows an actual website we did for LingPerfect.

The Best Landing Page Design
of the Decade: Part II

And now for the list of sites that didn’t make it into Part I of our series. Some of them put high conversion rates over beauty, and some are just a really nice and simple example of how landing pages should be done. Beauty? Sure, it’s important—but at the end of the day the conversion rates are really what it’s all about.

 

1. Geico

Hot: The screen real estate on this design are visibly well planned. A lot of content above the fold, fully visible on smaller screens and devices make for an effective layout.

 

2. Netflix

Hot: This above the fold approach is pretty popular among clients who put large conversion rates over beauty.

 

3. Basecamp

Hot: 37signals tried a lot of iterations and this one still sticks. Long headline, person and a contact form make combine seamlessly to get the job done.

 

4. Microsoft

Hot: A great example of how a huge corporation like Microsoft can display their infinite list of products and explain what they do in a neat (and still informative) compact design.
Not: For an opposite example visit GE or IBM.

 

5. Facebook

Hot: The landing page that signed one billion people. This one is a good example of how to build a landing page in its final step, when people are already aware of the product.

 

6. Twitter

Hot: People like it. It’s plain, simple and memorable.

 

7. Dropbox

Hot: Very minimal, very cool and ultimately? Very compelling.

 

8. Stripe

Hot: It created a movement based on the idea that products for developers shouldn’t actually be ugly. What a concept!

 

9. Path

Hot: It defined a pattern for landing pages selling iPhone apps.

 

10. Campaign Monitor

Hot: This is one of the well-known examples of its own species.
Not: Too many pages out there are built in a similar manner.

The Best Landing Page Design 2010-2013

No surprises here, you’ve seen them all before. This is a selection of best known landing pages on the web. They all share two important things: great conversion rates and pronounced beauty.

 

1. MailChimp

Hot: A great example of a landmark landing page, combining all the right elements including a big headline, action button, and a memorable mascot.
Not: Unfortunately, it is now replaced with a different and noticeably less appealing design.

 

2. Simple

Hot: Leave your bank for Web 2.0 aesthetics. This site was among the first corporate websites that introduced one-page design with long scrolling.

 

3. Mint

Hot: An early example that showed how to successfully fit corporate design into a Web 2.0 look and feel. They did a lot of testing with different headline formats.

 

4. Square

Hot: A very influential design that inspired the movement of Bootstrap websites.

 

5. Kaleidoscope

Hot: Inspired the movement of “attention to detail” landing pages, with a lot of fine tuning of graphics.

 

6. Zendesk

Hot: Combine a Buddha mascot with a nice shade of green and you get this funky zen experience that everybody recognizes.

 

7. Xero

Hot: Fresh, minimal and straight to the point. Very nice use of the turquoise color scheme.

 

8. Groupon

Hot: Highly influential, unique and memorable.
Not: Brought a bandwagon of copycats.

 

9. Assistly

Hot: At its peak, it brought some freshness with its purple design and nice iconography.
Not: Fresh at the moment, but not as timeless as MailChimp.

 

10. Apple.com

Hot: This list would not be complete without Apple.
Not: Jony Ive Redesigns Things.

 

The sites mentioned above are some of the designs that have been most requested by our clients over the years. You can see the results in our portfolio.

Radical Redesign Increase Signups by
102.5%

Reports show that radical new design on essay websites for students increased sales by 50%.

Radical design on a checkout page will gain a 14% increase in sales without releasing any new products or spending money on ways to get more traffic to the website. Radical redesign on sales pages is proven to improve sales by 20%.

Anyone else seeing a pattern here?

Jason Fried’s mantra while testing was: “We need to test radically different things. We don’t know what works. Destroy all assumptions. We need to find what works and keep reiterating it—keep learning.”

37signals’ radical redesign achieved gains up to 102.5%.

Numbers Don’t Lie

Source: Dan Siroker, ex-Google product manager

Google has this philosophy that, “It does not matter whether you are an engineer or a vice president, at the end of the day a decision comes down to ‘What does the data say?“

40% Conversion Boost in 5 minutes

Source: Google, Inc.

Start simple. Test how changing the headlines on your page can make a significant difference. Does your profit grow? We bet it does. Remember; don’t touch anything else on the page, just the headline!

The Gary Halbart tutorial will teach you how to write killer headlines. 37signals article will show you how to test multiple headlines on the page. If you are interested in how headline updates conversion boosts evidence, watch these two videos by Google.

You can setup an A/B test in five minutes using tools like Optimizely or Visual Website Optimizer.

The Difference a Single Button Can Make:
A call to action button increases
conversions by 62%

If you don’t have call to action button, make one. (Case: +62%)

Change the button text. (Case: +29%)

Change the button colors. (Case: +5%)

Change the button shapes, elements and sizes. (Case: +6.3%)

Add text around the buttons. (Case: +28%)

“Consolidated Label, A/B tested a new design with a prominent call to action button on their test page. Their original web design did not have any call to action buttons so they tried making an A/B test with one. They did expect an increase in conversions but they didn’t expect it to produce a 62% increase in conversions over the original design.”

Testimonials Increased Sales by 34%

There are three kinds of testimonials you can test on:

  1. Text only. Putting positive testimonials on your site can increase sales by 34%. Consider adding customer photos next to each text testimonial. Photos featuring people can double your conversion rate.

  2. Audio. You can easily produce audio testimonials using Google Voice. When a client calls the audio testimonial Google Voice number and leaves a voice message, the transcript of that call and the audio file will go into your Gmail email box.

  3. Video. Since implementing testimonials, a video training company saw a 20% increase in conversion rates.

Bonus: Introduction to testimonials and some research on topic.

The Error of Failing to Emulate
a Winning Idea

Source: Felix Dennis, Billionaire

There is an often overlooked adjunct to the subject of ideas in commerce; stealing them. Or, to put it more pleasantly, emulating them.

The error of failing to emulate a winning idea pervades every industry, at all levels, and always has done. Often this is due to indolence or folly. Of indolence, no more need be said. The folly, on the other hand, usually takes the form of a peculiar and pernicious affliction, known colloquially as the ‘it wasn’t invented here’ syndrome. I would place this affliction very high on the list of reasons preventing individuals and companies from achieving major success.

Give us 10% of Your Traffic and Test the Results

Source: Wired

“In 2011 a fund-raising site called GoFundMe was talking with WePay about the possibility of switching to its service from payment giant PayPal.

Using A/B, WePay could present GoFundMe CEO with an irresistible proposition: Give us 10 percent of your traffic and test the results against PayPal in real time. It was an almost entirely risk-free way for the startup to prove itself, and it paid off. After GoFundMe CEO saw the data on the first morning, he switched half his traffic by the afternoon—and all of it by the next day.”

Wired has a big article on A/B testing.

Why Do Designers Hate Long Sales
Letters?

Source: 37signals

The answer: they’ve never tested it.

“In the past, you must have come across one of those long sales pages that never seem to end. Most designers hate long sales letters because they contain heaps of text but apparently lack on aesthetic fronts. Some people go to extremes and even call such sales pages evil forms of internet marketing. Truth be told: long sales letter pages are based on learnings from direct marketing and the catalog industry, so there is nothing inherently evil about them. In fact, many marketers still use long form of sales pages because they convert visitors like crazy.”

37signals’ long sales letter page increased signups by 37.5%

Do People Use Your Website More If You Display Newspaper Logos on It?

Source: Thumbtack

“Despite having the second-highest circulation of any U.S. newspaper, the USA Today was the least trusted brand among both consumers and local service professionals, actually decreasing conversions by 25% and 13%, respectively.

Including multiple press logos together on our landing pages increased conversions by 17%. However, certain newspaper brands performed better than others when placed alone on our landing pages: The Washington Post and the New York Times were the most trusted brands among consumers, increasing conversions among consumers by 32% and 29%, respectively. The Wall Street Journal was the must trusted brand among local service professionals, increasing conversions among professionals by 8%.”

Disclaimer: Always Be Testing (ABT)

In a now legendary test, Google went about examining 41 shades of blue to see which one would perform better. They know the golden rule is: Do not assume anything without testing it first. What works for us may not work for you. Testing is something every web designer must do for themselves. You may find that what has worked for you in the past may not work in the future. There is never an eternal, ultimate truth because things are never constant—but are constantly evolving.

What’s described as the “best” practices may not always stand true. It’s still hard to believe, but numbers don’t lie.