Page Templates that Work
-
Upload
marketingexperiments -
Category
Business
-
view
3.699 -
download
5
description
Transcript of Page Templates that Work
![Page 1: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/1.jpg)
Page Templates that Work: New research reveals 3 high-performing webpage templates that consistently improve conversion
#webclinic
![Page 2: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/2.jpg)
#webclinic
JOIN THE CONVERSATION ON TWITTER
#webclinic
![Page 3: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/3.jpg)
#webclinic
TODAY’S TEAM
@jonpowell31
Jon Powell Senior Manager Research and Strategy MECLABS
Paul Cheney Editorial Analyst MECLABS
@prcheney
![Page 4: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/4.jpg)
#webclinic
An Experiment
![Page 5: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/5.jpg)
#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:
![Page 6: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/6.jpg)
#webclinic
EXPERIMENT: VERSION A
![Page 7: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/7.jpg)
#webclinic
EXPERIMENT: VERSION A
![Page 8: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/8.jpg)
#webclinic
EXPERIMENT: VERSION B
![Page 9: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/9.jpg)
#webclinic
EXPERIMENT: VERSION B
![Page 10: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/10.jpg)
#webclinic
EXPERIMENT: SIDE BY SIDE Version A
Version B
![Page 11: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/11.jpg)
#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.
![Page 12: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/12.jpg)
#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
![Page 13: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/13.jpg)
#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
![Page 14: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/14.jpg)
#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%
![Page 15: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/15.jpg)
#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
![Page 16: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/16.jpg)
#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
![Page 17: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/17.jpg)
#webclinic
Template #1 Main Offer Page
![Page 18: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/18.jpg)
#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
Channel Main Offer Page
Checkout Page
Directory Page
Standard Conversion Path
![Page 19: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/19.jpg)
#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
![Page 20: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/20.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER
44% Increase in lead rate
To This From This Protocol ID: TP1530
![Page 21: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/21.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER
HEADER Navigation
Logo
Footer
HEADER Navigation
Logo
Footer
From This To This
83.7% Increase in conversions
Protocol ID: TP1457
![Page 22: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/22.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER To This From This
87.4% Increase in conversions
Protocol ID: TP1568
![Page 23: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/23.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER To This
From This
324% Increase in click-through
Protocol ID: TP1635
![Page 24: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/24.jpg)
#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
![Page 25: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/25.jpg)
#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
![Page 26: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/26.jpg)
#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
![Page 27: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/27.jpg)
#webclinic
27
MAIN OFFER PAGE VARIATIONS
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)
![Page 28: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/28.jpg)
#webclinic
28
MAIN OFFER PAGE VARIATIONS
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
![Page 29: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/29.jpg)
#webclinic
Template #2 Transaction Page
![Page 30: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/30.jpg)
#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
Channel Main Offer Page
Transaction Page
Directory Page
Standard Conversion Path
![Page 31: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/31.jpg)
#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
![Page 32: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/32.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER
Footer
Header Header To This From This
Footer
7.3% Increase in completions
Protocol ID: TP1498
![Page 33: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/33.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER
To This
Protocol ID: TP1268
From This
12% Increase in completions
![Page 34: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/34.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER
From This To This
97% Increase in completions
Protocol ID: TP1214
![Page 35: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/35.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER
From this… To this…
109% Increase in Conversions
Protocol ID: TP1636
![Page 36: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/36.jpg)
#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?
![Page 37: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/37.jpg)
#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?
![Page 38: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/38.jpg)
#webclinic
Template #3 Directory Page
![Page 39: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/39.jpg)
#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
Channel Main Offer Page
Checkout Page
Directory Page
Standard Conversion Path
![Page 40: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/40.jpg)
#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
![Page 41: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/41.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER
19% Increase in click-through
Header Header Navigation Navigation Navigation
Flash Banner
From This To This
Protocol ID: TP1499
![Page 42: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/42.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER
Footer
Logo Header Navigation
From This Protocol ID: TP1746
Logo
Footer
Header Navigation
To This
25% Increase in click-through
![Page 43: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/43.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER
HEADER
Footer
HEADER
Footer
Navigation Navigation
From This To This
63% Increase in conversions
Protocol ID: TP1460
![Page 44: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/44.jpg)
#webclinic
EXPERIMENT: BEFORE, AFTER From This To This
331% Increase in conversions
Protocol ID: TP1560
![Page 45: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/45.jpg)
#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
![Page 46: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/46.jpg)
#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
![Page 47: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/47.jpg)
#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
![Page 48: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/48.jpg)
#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
![Page 49: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/49.jpg)
#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
![Page 50: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/50.jpg)
![Page 51: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/51.jpg)
#webclinic
Live Optimization
![Page 52: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/52.jpg)
#webclinic
LIVE OPTIMIZATION 3M
Primary objective(s): Increase CTR Primary audience: Consumers interested in product research URL: http://bit.ly/14VZSED
![Page 53: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/53.jpg)
#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
![Page 54: Page Templates that Work](https://reader038.fdocuments.net/reader038/viewer/2022103113/554ce374b4c905d1488b5468/html5/thumbnails/54.jpg)
#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