Crowning the Ultimate Landing Page Champion

Page Fights

Having a poorly optimized touchdown web page may end up in confused leads, poor conversion charges, and misplaced gross sales…

…or within the context of Page Fights, public humiliation.

Unbounce lately paired up with ConversionXL to crown the last word touchdown web page champion. In a stay three-part sequence, cruel judges Oli Gardner and Peep Laja dished out powerful love within the type of brutal (however helpful) touchdown web page critiques.

“There’s not going to be lots of time for niceties. It’s Web page Fights – we’re going to be brutal” – Georgiana Laudi, Unbounce Advertising Director and Web page Fights Moderator

Within the course of, Peep and Oli shared conversion price optimization greatest practices, broke down the fundamentals of A/B testing and invited viewers to forged their vote to find out who moved on within the competitors.

They spared no emotions within the pursuit of the last word touchdown web page champion, and fortunate for you, our contestants underwent public shaming so that you don’t must.

We’ve compiled some distilled knowledge from the sequence so you may get to work at eradicating embarrassing conversion killers out of your touchdown web page and making it the high-converting winner it was meant to be.

Who is aware of? Possibly your touchdown web page has the potential to be topped the following Web page Fights champion…

Episode 1: Touchdown Pages That Didn’t Minimize It

We acquired over 200 submissions from entrepreneurs masochistic sufficient to need their pages torn aside on a stay Google Hangout on Air.

Of those, many simply didn’t make the lower. Some had poor design, have been painfully slow-loading or had their headlines as pictures. A handful even had the nerve to submit their homepages as touchdown pages (if you happen to don’t know the distinction, cease proper now and watch this one-minute video).

With the pool narrowed all the way down to 33 touchdown pages, the sequence kicked off with a flood of rapid-fire critiques as Oli and Peep blurted out first impressions. Whereas this will likely have appeared rushed, think about this:

Within the time Oli or Peep can consider a witty diss, a lead can have handed judgement in your web page.

A Web page Fights viewer put it greatest:

Poetry.

Listed here are some recurring weak factors we discovered on our contestants’ pages – and an important starter guidelines of issues to keep away from if you happen to don’t need your guests to bounce.

Your consideration ratio sucks

Web page Fights noticed many pages with out clear goal, with a number of actions competing for consideration.

Take the submission beneath from Rentify for instance:

Rentify landing page exampleRentify landing page example

Presumably, Rentify needs results in “Get began” by clicking on the orange button on the left – and though the button has a pleasant distinction towards the background, the judges identified that it competes with different components on the web page.

Any of the hyperlinks throughout the highest of the web page may distract the lead from changing, and as Oli identified, the badge on the best is much extra outstanding than the precise CTA. With the gentleman within the photograph dealing with away from the copy, the attention jumps round on the web page aimlessly.

The attention ratio for this web page is 6:1, with six distracting actions and as many apparent areas for enchancment. Take a look at how significantly better the web page appears to be like if you happen to simply crop out the nav and the extra CTA:

Rentify landing page example 2Rentify landing page example 2

Bonus tip: Rentify’s touchdown web page would information eyepath even higher if the gentleman within the photograph was dealing with the copy.

Takeaway: make the meant goal of your touchdown web page clear and information your lead towards the press – depart no ambiguity or chance for distraction.

Your worth proposition isn’t clear

Even when your CTA copy is stable, you might nonetheless be complicated the hell out of your leads.

All the weather in your web page have to work collectively to rapidly and concisely paint an image of your supply. If any of the weather conflict, your lead may turn out to be discouraged and bounce.

The landing page submission beneath is without doubt one of the 33 that made the lower – and though it’s undoubtedly superbly designed, the judges identified that the headline, sub headline, graphic and CTA copy work towards each other:

Detox Clean exampleDetox Clean example

Interchangeably, they discuss with a bodily ebook, an e book and paid membership. With all of those gives on the desk, how probably is it {that a} lead will really “Register now”, not understanding what they’re getting themselves into?

Peep identified that coupled with the buzzwords within the headline, the supply feels unclear (if not sketchy) and so a lead is more likely to stray.

Takeaway: Your worth proposition needs to be clear out of your headline and CTA copy alone. Any extra components on the web page ought to exist solely to bolster the persuasiveness of your supply.

The shape causes friction

As soon as your web page copy has efficiently satisfied your prospect that they need to decide in, you need to make the method of opting in as painless as attainable.

In different phrases, in the event that they’re already satisfied that they need to join, you don’t need your type standing of their means – as is the case within the following submission from DUI Nevada:

DUI Nevada landing page exampleDUI Nevada landing page example

All the shape fields couldn’t match within the screenshot, however I counted: 26 alternatives for the result in abandon the shape.

The copy on this web page already causes sufficient friction; as Peep identified, the worth proposition isn’t clear and the wall of textual content supplies little or no motivation to learn on.

However even when the copy was masterfully written, the shape has so many fields that there’s little incentive on the a part of the result in start filling it out.

DUI Nevada tops all of it off with “Submit” as CTA copy. Yikes.

”It appears to be like like this web page was designed by a drunk individual.” – Oli Gardner

Takeaway: in case your decide in type is simply too prolonged or tough to fill out, your prospect may turn out to be discouraged, even when they consider you might have the reply to their drawback.

When unsure, cut back the fields to the naked minimal and ask for the extra info as soon as the lead is in.

Episode 2: The Semi-Finalists Face the Judges

The tip of our first episode of Web page Fights noticed the disqualification of all however 5 of our courageous contestants. Every of the finalists was invited to come back face-to-face with the judges and plead their case.

These pages might have sturdy copy and wonderful design, however there may be extra to CRO than what meets the attention.

1. Paul Jarvis – Creator, Write & Promote Your Rattling E book

Paul Jarvis landing page example (before)Paul Jarvis landing page example (before)

Paul Jarvis is an independently-published creator and net designer who needs to assist different authors get their ebook out into the world together with his free electronic mail course.

Paul defined that with no paid visitors, his course landing page will get over 800 guests every week, and converts at about 24%.

Oli actually responded to the conversational copy on the web page, which is relatable and convincing. However as you already know, convincing copy is simply one of many many components that go into making a high-converting web page. Peep and Oli mercilessly cracked into the weak factors of Paul’s web page:

The shape isn’t outstanding

Though Oli counseled Paul for the clear, minimal design of the web page, he discovered that the shape acquired misplaced within the sea of clean house.

Takeaway: Whitespace is a good approach for focusing your prospect’s eye, however with out a contrasting type to face out towards the clean canvas, your web page will really feel muted and uninspiring.

Equally, as Peep identified, the sponsor logos on Paul’s web page dominate, drawing the attention away from his CTA. And though Paul didn’t have management over the scale of the sponsor logos, he does have the flexibility to actually make his type pop to successfully push it to the highest of the visible hierarchy.

The meant motion is unclear

Don’t make it laborious in your prospects to find out their ‘subsequent step.’

When Paul provides a purchase order hyperlink for his ebook to the underside left nook of the web page, he detracts from the primary goal.

“In case your essential name to motion right here is to get individuals to enroll in your course by way of electronic mail, why would you additionally attempt to take them away from the web page?” – Oli Gardner

Takeaway: At all times select one meant motion in your leads, and don’t distract them from it!

Oli went on to clarify that though it’s nice to earn a living, asking an entire stranger to buy your ebook is simply too huge of an ask. Begin by asking for his or her electronic mail, heat them up in an electronic mail sequence and pop the (larger) query as soon as they know who you might be.

The directional cues are missing

You need to all the time be intentional about how your prospect’s eye ought to journey throughout the web page. On Paul’s web page, the 2 columns could also be aesthetically pleasing, however they trigger the attention to maneuver in an unnatural means.

Take a look at any structure components that divide the web page to make sure that you’re not breaking apart the web page unnecessarily and blocking pure gaze pathways.

2. Ryan Walsh – Proprietor, MindOverPain.org

Ryan Walsh landing page example - before (cropped)Ryan Walsh landing page example - before (cropped)

Click on for full-length web page.

Ryan Walsh discovered in regards to the alleviation of wrist ache after experiencing persistent ache first-hand. Discovering that there have been others who may gain advantage from his information, he began a free on-line course to show easy methods to receive aid with out stretches or costly ergonomic gear.

Though the hassle he put into designing his landing page is clear within the size of it, the judges discovered a number of areas for enchancment.

The copy reads stiff

For starters, the unique copy on the web page got here throughout as stale, injected with buzzwords. As Peep identified, the way in which Ryan described his story when he was introing his enterprise for Web page Fights was far more compelling than the copy on his web page.

“Use your individual voice and you’ll be higher off” – Peep Laja

The judges recommended that Ryan revise all of the copy on the web page, together with the CTA and the headline, to talk extra carefully to the ache his prospects are having.

Takeaway: Peep recommended utilizing qualitative analysis to assist uncover the exact language your viewers is utilizing, so you need to use trigger words to talk to them in phrases they perceive.

The web page feels too salesy

On high of the impersonal copy, Ryan was using false scarcity, a tactic that Oli recommended could possibly be backfiring.

Landing page example: false scarcityLanding page example: false scarcity

Shortage might help persuade a prospect that they should buy immediately, enjoying on their worry of lacking out on the chance “whereas restricted provides final.” Nevertheless, as Oli defined, the way in which Ryan used a Hello Bar on this web page may backfire; individuals anticipate {that a} free on-line course gained’t have restricted seats, and the shortage feels faux.

Coupled with the baseless assure (Peep questioned how Ryan may assure outcomes for a free course) and tacky inventory pictures, the judges agreed that Ryan’s web page lacked sincerity.

“It makes my bullshit detector go off.” – Peep Laja

The one redeeming issue? The photograph Ryan had included of himself was unpolished and finally felt relatable and credible.

The web page is unnecessarily lengthy

For a free supply that’s comparatively easy, you don’t must do a lot convincing.

And since Ryan’s worth proposition is easy, his prolonged web page seems like overkill. For a free supply touchdown web page, a shorter page may be better suited.

Takeway: Each component you add to your web page has so as to add worth. If it doesn’t, kill it.

The judges strongly recommended that Ryan lower down on sections (particularly those who felt insincere) and take a look at a shorter, extra concise design.

3. Josh Frank – eCommerce Lead, Chalkfly

Josh Frank landing page example (before)Josh Frank landing page example (before)

Josh Frank is the eCommerce Lead for Chalkfly, a socially-conscious workplace provide distributor.

Josh’s landing page, focused at startup founders and workers, had a 21% conversion price when he submitted it to Web page Fights. It’s value mentioning that his visitors was primarily coming from a Fb advert marketing campaign he was working.

As Oli defined, Fb adverts are tough to work with. As a result of entrepreneurs haven’t any management over the scale of the advert’s headline, it’s laborious to regulate which component is most outstanding. To treatment this, Oli recommended placing the headline into the advert’s picture, so Josh has full management over the prominence of the assertion he’s attempting to make.

The headline can’t stand by itself

You’ve heard by now that individuals don’t really learn your touchdown web page – they skim.

And when Oli learn probably the most outstanding copy on the web page aloud, the worth proposition was completely unclear.

Josh’s aversion to repeating the time period “workplace provides” and his imprecise supply for “15 {dollars} in Chalkfly money” finally labored towards him.

Takeaway: Readability ought to trump all different copy choices.

It doesn’t get straight to the purpose

This web page does an entire lot of beating across the bush.

Josh’s web page lacks a narrative and visible cues; even probably the most important components such because the goal buyer and worth proposition must be teased out from the copy.

Oli defined that the part above the fold ought to in a short time talk what your enterprise is and what it does.

Takeaway: Each different component ought to contribute to a congruent design, working collectively to align to a single objective.

4. Mike Svystun – Advertising Supervisor, Vertalab

Mike Syvstun Landing Page example (before)Mike Syvstun Landing Page example (before)

Mike Svystun is the Advertising Supervisor for Vertalab, an organization that helps startups construct net apps. The corporate launched this landing page within the context of a marketing campaign to finally assist elevate model consciousness.

Peep and Oli discovered some areas that would use enchancment:

The supply lacks credibility

The touchdown web page positions Vertalab as an authority with regards to launching net startups, however there are not any components that add legitimacy to their recommendation.

There is no such thing as a point out of certification or previous ventures and the low variety of social shares create negative social proof for the web page.

The judges really helpful that Mike take away the social share buttons solely, inserting them as a substitute on the affirmation web page. As Oli defined, leads are extra more likely to return a favor after you’ve already delivered.

In lieu of the pathetic social share counters, Mike may add testimonials or inject different social proof components that time to the authority of Vertalab within the startup group.

The shape is uninspired

With its generic CTA copy and naked bones design, the shape on Mike’s web page may use lots of work.

Successfully, the decide in type on the web page feels prefer it’s an afterthought, when it should be the star of the page.

“Design the shape as if it’s the one factor on the web page.” – Oli Gardner

Taking it a step additional, Peep recommended that Mike take a look at placing left-aligned type labels above the shape subject; having inline type labels can confuse the lead (particularly in the event that they disappear after a click on).

5. Stuart Harrison – Search Engine Marketer, Hampson Hughes Solicitors

Stuart Harrison landing page example (before)Stuart Harrison landing page example (before)

Stuart Harrison, Search Engine Marketer for regulation agency Hampson Hughes Solicitors, submitted a touchdown web page focused particularly at delivery harm victims.

Stuart did a comparatively good job on this landing page contemplating it’s the primary he’s ever made, however his 1% conversion price recommended there was loads of room for enchancment.

Message mismatch

The judges referred to as Stuart out for participating the prospect in a dialog with his ad and headline after which utterly dropping the ball.

The advert, headline and sub headline tackle very particular ache factors, however the name to motion feels generic.

Sustaining a coherent dialog from the advert copy to the touchdown web page headline is what Oli has dubbed “conversation momentum.”

“Match the fashion and context of the dialog you began together with your advert in your touchdown web page.” – Oli Gardner

In case your messaging begins off by resonating together with your prospect, you need to preserve that momentum going.

Episode 3: The Finalists Are Given a Second Probability

Within the remaining episode of the sequence, contestants got the chance to return to the Web page Fights stage and redeem themselves for his or her CRO shortcomings.

Every finalist offered a revamped model of their touchdown web page, displaying how easy modifications can go a great distance in the case of rising the conversion price in your touchdown web page.

1. Paul Jarvis – Proprietor, Write & Promote Your Rattling E book

Paul Jarvis landing page example (before and after)Paul Jarvis landing page example (before and after)

The delicate modifications Paul made to his touchdown web page are an enormous enchancment:

  • He tightened the headline copy to be extra concise. He additionally highlighted sure phrases for emphasis, accommodating leads who skim.
  • He left-aligned the headline, web page copy and decide in type in order that the attention strikes naturally from the headline, by way of the copy, straight to the decide in type.
  • He made his signup type extra outstanding to offset the scale of his sponsor logos and to attract consideration to the objective of the web page.
  • He improved the eye ratio on the web page by eradicating the hyperlink to his ebook on Amazon in order that the web page solely has one objective.

Paul’s new and improved web page does a greater job of guiding the prospect to his decide in type, and his 1:1 consideration ratio makes the aim of the web page very clear – at the least in principle.

Whereas these recommendations are greatest practices, the one technique to validate that modifications to your touchdown web page are value your whereas is to A/B take a look at. Extra on that later…

2. Ryan Walsh – Proprietor, MindOverPain.org

Ryan Walsh landing page example (before and after)Ryan Walsh landing page example (before and after)

Click on for full-length web page comparability.

Ryan’s touchdown web page makeover was probably the most dramatic:

  • He swapped out the explainer video (which our judges recommended are higher for tech corporations) for a extra private video.
  • He eliminated many sections of the web page that didn’t add worth or in any other case detracted from a comparatively simple supply.
  • He tweaked his copy to be extra private, as needs to be the case on a touchdown web page that addresses a well being concern.

The judges agreed that omitting pointless components from the web page made Ryan’s supply way more reliable, private and plausible. Total, the web page feels way more reliable and to-the-point. That being stated, Peep recommended there have been different components that remained to be examined, together with the CTA button copy, small font measurement, and the presence of a crossed out $97 value.

3. Stuart Harrison – Search Engine Marketer, Hampson Hughes Solicitors

Stuart Harrision landing page example (before and after)Stuart Harrision landing page example (before and after)

The modifications to Stuart’s web page are delicate however highly effective:

  • He condensed his type to make the web page extra linear.
  • He eliminated the dodgy testimonial and changed it with steps which lead a prospect towards the objective of the web page.
  • He eliminated extraneous copy and as a substitute cited the 4 essential causes somebody ought to go together with his service. The best way he did this was masterful; he pulled the info from a survey and handled every bullet level graphically, which makes the general web page simpler to digest.
  • He added an extra CTA on the backside of the web page to seize any scrolling leads.
  • He modified the headline to hold the dialog momentum from his advert to his web page.

The decision? Sustaining dialog momentum from the advert to the touchdown web page and condensing the web page’s copy into easy-to-read (and even easier-to-skim) sections reduces friction on the web page.

Every of the contestants made spectacular modifications to their pages, however on the planet of CRO, there may be all the time greater than could be performed, whether or not one other part to condense, or one other variable to check.

“If solely optimization was as straightforward as sitting on our asses and simply understanding what was going to work” – Peep Laja

Which brings us to the ultimate chapter of the Web page Fights saga…

A/B Testing Suggestions From the CRO Specialists

The perception dished out all through the sequence is nice in principle, however in apply, each change you make in your touchdown web page needs to be A/B examined and allowed to run till statistical significance is achieved.

In mild of this, our judges offered some perception into easy methods to know when a take a look at result’s actionable – even with a small pattern measurement.

  1. At all times use a instrument reminiscent of Unbounce, Optimizely or Visual Website Optimizer.
  2. Prioritize your testing by determining what the largest drawback is. Do quantitative/qualitative research, run surveys and discuss to your goal market. With their assist, discover what’s damaged in your web page and begin there.
  3. Solely take a look at one factor at a time. Multivariate and sequential testing could be imprecise; motivations change, and in case your web page begins performing terribly, it may be tough so that you can decide which issue is the wrongdoer. The one time you have to be testing a number of components without delay is when you have no visitors for A/B testing and a radical makeover is critical.
  4. Solely make modifications when outcomes are statistically important. Though there isn’t a common rule for figuring out this, Peep shared a very good set of tips for figuring out whether or not your outcomes are prepared so that you can act on:
    1. Your statistical confidence stage is upwards of 90%.
    2. You could have a pattern measurement of at the least 100-200 conversions per variation.
    3. Your take a look at has been working for at the least one week (though ideally for 2 weeks and past).

A/B testing can appear overwhelming if you happen to’re not skilled with it, however when you get began, you’ll be amazed on the payout you may get from little or no effort. In the event you don’t know the place to begin, try the Ultimate Guide to A/B Testing and begin getting your palms soiled. All of the cool children are doing it.

#alwaysbetesting

CRO-wning the Winner

[Warning: Page Fights champion spoiler ahead…]

Web page Fights spanned a brutal three weeks, and in that point, a lot blood, sweat and tears have been shed. After many touchdown pages have been improved, viewer questions addressed and brutal disses dished, it was time to crown a Web page Fights champion.

The winner was to take dwelling:

The viewers forged their votes and selected their champion:

Watch for it…

Watch for it…

Watch for it…

Ryan Walsh - Page Fights ChampionRyan Walsh - Page Fights Champion

Congratulations to Ryan Walsh of MindOverPain.org!

How does your web page measure as much as that of our finalists? Does it fall into any of the traps outlined on this put up? Or are you primed for battle?

In the event you missed the possibility to give up your touchdown web page for critique on Web page Fights, sign up to be the first to know when you’ll be able to be part of the following spherical.

And within the meantime, study from our contestants’ errors and take your web page to the following stage.

— Amanda Durepos