Page Templates that Work

Page Templates that Work: New research reveals 3 high-performing webpage templates that consistently improve conversion

#webclinic

#webclinic

JOIN THE CONVERSATION ON TWITTER

#webclinic

#webclinic

TODAY’S TEAM

@jonpowell31

Jon Powell Senior Manager Research and Strategy MECLABS

Paul Cheney Editorial Analyst MECLABS

@prcheney

#webclinic

An Experiment

#webclinic

EXPERIMENT: BACKGROUND

Background: An online printing company that specializes in delivering printed marketing materials with minimal turnaround. Goal: To increase the number of purchases online. Research Question: Which product page will result in the largest purchase rate? Test Design: A/B Variable Cluster test

Experiment ID: TP1568 Record Location: MECLABS Research Library Research Partner: [Protected]

Research Notes:

#webclinic

EXPERIMENT: VERSION A

#webclinic

EXPERIMENT: VERSION A

#webclinic

EXPERIMENT: VERSION B

#webclinic

EXPERIMENT: VERSION B

#webclinic

EXPERIMENT: SIDE BY SIDE Version A

Version B

#webclinic

EXPERIMENT: RESULTS

Design Conversion Rate

Version A 4.03%

Version B 7.55%

Relative Difference 87.4%

87.4% Increase in Conversions The treatment page increased the rate of conversion by 87.4%

What you need to understand: By re-sequencing product and process information, the new product page template achieved an 87.4% increase in conversions.

#webclinic

EXPERIMENT: RESULTS

9.4% IN CONVERSIONS 87.4%

IN CONVERSIONS

5,368% IN CONVERSIONS

19% IN CLICKTHROUGH

34.6% IN CLICKTHROUGH

Because the changes did not alter CMS content, they were further tested across additional SKUs

#webclinic

Key Principles

1. Philosophically, the marketer should be able to distinguish between two essential parts of any marketing creative:

1. The Form: The elements of marketing collateral that transcend the specific instance of the marketing message. (e.g., page templates, copy-length, forms fields, etc.).

2. The Substance: The elements of marketing collateral that are instance-specific. Generally, they are tied closely to the specific expression of the offer’s value proposition.

2. When done properly, testing the “form” elements of a web page creates a significant opportunity for compounding results.

WEBSITE TEMPLATES

#webclinic

14

Ad Group A Brand Terms

Ad Group B New Movers Lists

Ad Group C Bankruptcy Lists

Ad Group D New Homeowners Lists

Ad Group E New Business Lists

257% 28% 603% 302% 451%

COMPOUNDING RESULTS

201%

#webclinic

Key Principles

3. For page templates specifically, there are no absolute rules when it comes to “best practices”; however a meta-analysis of our experimentation reveals common patterns across industry for successful page templates.

WEBSITE TEMPLATES

#webclinic

Today, we are going to walk through the field-tested templates for 3 of the most common webpages on a website

TODAY’S FOCUS

Channel Main Offer Page

Checkout Page

Directory Page

Standard Conversion Path

#webclinic

Template #1 Main Offer Page

#webclinic

Main Offer Page: A page containing specific product, service, offer information designed to help a customer come to a primary decision

MAIN OFFER PAGE


Checkout Page

Directory Page


#webclinic

AS IT RELATES TO THE MIND…

Offer Page Trans. Page #1 Thank-you Page Channel Directory Page Trans. Page #2

High

Low Cogn

itive

Mom

entu

m

Goal: To obtain a conversion

commitment

Goal: To engage visitor and lead them to the most relevant value

Goal: To maintain the cognitive momentum generated by the offer page

We are here

#webclinic

EXPERIMENT: BEFORE, AFTER

44% Increase in lead rate

To This From This Protocol ID: TP1530

#webclinic


HEADER Navigation

Logo

Footer

HEADER Navigation

Logo

Footer

From This To This

83.7% Increase in conversions

Protocol ID: TP1457

#webclinic

EXPERIMENT: BEFORE, AFTER To This From This

87.4% Increase in conversions

Protocol ID: TP1568

#webclinic

EXPERIMENT: BEFORE, AFTER To This

From This

324% Increase in click-through

Protocol ID: TP1635

#webclinic

MAIN OFFER PAGE TEMPLATE

• Clearly visible headline and sub-headline that communicate the value of continuing to the next step

• An instantly recognizable

image that supports the value on the page.

• A primary information column to create linear flow through the page and minimize confusion

#webclinic

MAIN OFFER PAGE TEMPLATE

• Easy-to-scan body copy to propel the force of the value proposition for the primary offer

• One emphasized call-to-action that appears clickable and communicates exactly what the customer will get by clicking.

• Supporting content (i.e.

copy, images, testimonials, reviews) to re-assure hesitant visitors or educate detail-oriented visitors

#webclinic

26

MAIN OFFER PAGE VARIATIONS

Variation #1: Long Copy

• What makes it different: • Substitutes a focus on

imagery to additional copy/ other forms of primary content

• When it applies: • When the substitute content

is more likely to increase a page’s value force potential

#webclinic

27


Variation #3: Integrated CTA (top)

• What makes it different: • Instead of checking the

customer out entirely on a new page, it integrates the first step in the primary eye-path

• It provides a balance of primary value force content instead of a full presentation (long-copy or copy and image)

#webclinic

28


Variation #3: Integrated CTA (top)

• When it applies: • When a single offer page

must serve multiple visitor segments with varying familiarity with the primary offer

• When a page’s value force is strong enough to allow a significant reduction in process friction

#webclinic

Template #2 Transaction Page

#webclinic

Transaction Page: A page, or series of pages dedicated to collecting information from a customer required to complete a value exchange (i.e. purchase, consultation)

TRANSACTION PAGE


Transaction Page

Directory Page


#webclinic



High

Low Cogn

itive

Mom

entu

m


commitment



We are here

#webclinic


Footer

Header Header To This From This

Footer

7.3% Increase in completions

Protocol ID: TP1498

#webclinic


To This

Protocol ID: TP1268

From This

12% Increase in completions

#webclinic


From This To This

97% Increase in completions

Protocol ID: TP1214

#webclinic


From this… To this…

109% Increase in Conversions

Protocol ID: TP1636

#webclinic

TRANSACTION PAGE TEMPLATE

• Clearly visible headline and copy to reiterate the value of filling out the form

• Minimum required form fields to complete the transaction and ensure expected value

• Form field groups and headers to further reduce friction

• Additional copy, pop-over links to justify each form field relative to the immediate value exchange

What’s this?

#webclinic

TRANSACTION PAGE TEMPLATE

• Testimonials and credibility indicators are placed along the side of the page to answer questions concerning process or value

• Single, clear call-to-action that

states what the customer will get when they click

• Additional credibility indicators placed in close proximity to the call-to-action

What’s this?

#webclinic

Template #3 Directory Page

#webclinic

Directory Page: A page serving multiple objectives not necessarily connected to each other. The goal of these pages is to direct them to the most relevant offer (homepages, category pages, etc.).

OVERVIEW PAGE


Checkout Page

Directory Page


#webclinic



High

Low Cogn

itive

Mom

entu

m


commitment



We are here

#webclinic



Header Header Navigation Navigation Navigation

Flash Banner

From This To This

Protocol ID: TP1499

#webclinic


Footer

Logo Header Navigation

From This Protocol ID: TP1746

Logo

Footer

Header Navigation

To This


#webclinic


HEADER

Footer

HEADER

Footer

Navigation Navigation

From This To This

63% Increase in conversions

Protocol ID: TP1460

#webclinic

EXPERIMENT: BEFORE, AFTER From This To This

331% Increase in conversions

Protocol ID: TP1560

#webclinic

DIRECTORY PAGE TEMPLATE

• Clearly visible headline and sub-headline that communicates the value proposition of continuing deeper into the site

• An instantly recognizable

image that supports the primary expressed value

• Easy-to-scan body copy to propel the force of the primary expressed value

#webclinic

DIRECTORY PAGE TEMPLATE

• Point-first header explaining what can be done relative the most immediate next step

• Content sections tailored to

attract the attention, interest, action of a sole prospect group

(though content appears equally weighted on the page, it is not so in the mind of multiple prospect groups)

• Supporting content to speak to secondary visitor types

#webclinic

47

DIRECTORY PAGE VARIATIONS

Variation #1: Two-Prospects

• What makes it different: • Substitutes three sections of

prospect focused content with only two

• When it applies: • When there are two primary

prospect groups arriving to the page instead of three

#webclinic

48

DIRECTORY PAGE VARIATIONS

Variation #2: Short Copy

• What makes it different: • Significantly reduces

introductory content to a minimum

• When it applies: • When visitors already arrive

with knowledge of the primary value proposition

• When, in testing, a company discovers that a minimal introductory value force content is optimal for conversion

#webclinic

AT THE END OF THE DAY..

Radical Redesigns: The objective is to challenge the control enough to generate a significant difference

Focused variable clusters: The objective is to test the highest performing variables and increase channel specificity

Single variable testing: The objective is to determine relative impact by isolating variables

Testing Cycle

Key Principles Template testing

#webclinic

Live Optimization

#webclinic

LIVE OPTIMIZATION 3M

Primary objective(s): Increase CTR Primary audience: Consumers interested in product research URL: http://bit.ly/14VZSED

http://bit.ly/14VZSED

#webclinic

LIVE OPTIMIZATION

Audimute

Primary objective(s): Increase sales of soundproofing parts Primary audience: Companies and individuals looking for soundproofing materials URL: http://bit.ly/148bUJZ

http://bit.ly/148bUJZ

#webclinic

MarketingExperiments.com/subscribe

MarketingExperiments Optimization Newsletter Free subscription to more than $20 million in marketing research

Join 89,000 of the top marketers from around the world as we work together to discover what really works.

#webclinic

http://www.marketingexperiments.com/create-your-marketingexperiments-account.html

http://www.marketingexperiments.com/create-your-marketingexperiments-account.html

http://www.marketingexperiments.com/subscribe