track report & optimize your web creations

58
@EmpiricalPath Peter Howley of Empirical Path @EmpiricalPath @phowley99

Upload: empirical-path

Post on 15-May-2015

729 views

Category:

Technology


0 download

DESCRIPTION

Peter Howley of Empirical Path delivered this presentation to the HTTQ web design and developers group in April 2013. Topics include counting conversions, segmenting audiences, testing ideas, and sharing insights using Google Analytics, Optimizely, Klipfolio and other tools. Video also available at TBD.

TRANSCRIPT

Page 1: Track Report & Optimize Your Web Creations

@EmpiricalPath

Peter Howley of Empirical Path @EmpiricalPath @phowley99

Page 2: Track Report & Optimize Your Web Creations

@EmpiricalPath

‣ Introduction

‣ Status Quo

‣Count Conversions

‣ Segment Audiences

‣Test Ideas

‣ Share Insights

Page 3: Track Report & Optimize Your Web Creations

@EmpiricalPath

‣ Web analytics, market research and campaign measurement

‣ Founded in Washington DC in 2002

‣ Atlanta, NM and DC offices

‣ Founder led web analytics at washingtonpost.com

‣ Google Analytics Certified Partner

‣ Webtrends Agency

Page 4: Track Report & Optimize Your Web Creations

@EmpiricalPath

‣ Defend digital investment

‣ Compare online to offline

‣ Right-size digital investment

‣ Re-allocate budget to most valuable activities

‣ Celebrate and reward successes

‣ Learn from mistakes

Page 5: Track Report & Optimize Your Web Creations

@EmpiricalPath

Reports with little context that measure only how many people entered the funnel:

‣ Impressions

‣ Visits

‣ Unique visitors

‣ Friends

‣ Followers

Page 6: Track Report & Optimize Your Web Creations

@EmpiricalPath

Measure how many times they complete the funnel (& achieve campaign goal):

‣ Purchases

‣ Social shares

‣ Email signups

‣ Contacts via form & phone

‣ File downloads

‣ Video views

Page 7: Track Report & Optimize Your Web Creations

@EmpiricalPath

‣ Track user activity on pages separately from pageviews

‣ Any Flash-driven element, like a website or Movie player

‣ Embedded AJAX page elements

‣ Page gadgets

‣ File downloads

‣ Clicks on links to other domains

‣ Form submits without a unique thank-you URL

‣ Load times for data

‣ Correct Bounce Rate by defining visits with these user activities as not Bounces

Page 8: Track Report & Optimize Your Web Creations

@EmpiricalPath

‣ Category ‣ Root level of event tracking and is the base level for sorting events

‣ Collect similar actions together, e.g., Outbound Links, Downloads, Videos

‣ Action ‣ Descriptor for a particular event, described by any string you specify

‣ Verb that describes what user did, e.g., Played, Clicked, Paused, Downloaded

‣ Not just one per category

‣ Label ‣ Optional descriptor to provide further granularity

‣ Often automatically passed based on code on page

‣ Don’t record Page where event occurred; tracked automatically

‣ Value ‣ Numerical variable can have explicit or inferred values

‣ Economic value of non-commerce action

‣ Estimated value of unmeasured commerce action

‣ Non-interactive parameter ‣ Tells GA that an Event was not initiated by visitor

‣ Counts single-page visits with only these Events in Bounce Rate calculation

Page 9: Track Report & Optimize Your Web Creations

@EmpiricalPath

‣ Core events reports in Standard Reporting > Content section

‣ Top Events lets you drill down from Categories

‣ Overview rolls up all Categories, Events, and Actions

‣ Metrics on total & unique events

‣ And any optional value tracked

‣ Standard tabs also available

‣ Site Usage: Visits, Avg. Duration, % New Visits

‣ Ecommerce: Revenue, Transactions, Avg. Order Value

Page 10: Track Report & Optimize Your Web Creations

@EmpiricalPath

‣ gaforflash is an ActionScript 3 API for Google Analytics data collection

‣ 1st, add the gaforflash SWC to Flash CS3

‣ Quit Flash CS3

‣ Navigate to the location where you unzipped the GA zip and find the swc

‣ Create a "Google" directory

‣ Copy the SWC file there

Page 11: Track Report & Optimize Your Web Creations

@EmpiricalPath

public function handlePlayTime(event:Event):void { //Tracking elapsed time for video for event and pageview tracker.trackEvent("Videos", "AutoPlayed", "[VideoTitle]",PlayTime); tracker.trackPageview("/TDNB/[DomainName]/Videos/[VideoTitle]"); } public function handleComplete(event:Event):void { tracker.trackEvent("Videos", "Completed", "[VideoTitle]"); } public function handlePause(event:MouseEvent):void { var button:Button = event.target as Button; if (button.label == "Pause") { video.stop(); button.label = "Resume"; tracker.trackEvent("Videos", "Paused", "[VideoTitle]"); } else { video.play(); button.label = "Pause"; tracker.trackEvent("Videos", "Resumed", "[VideoTitle]", ResumeTime); } }

‣ Example Tracking:

‣ http://stanfordhospital.org/events/awareness/stroke.html

‣ http://test.empiricalpath.com/ga-youtube2.html

Page 12: Track Report & Optimize Your Web Creations

@EmpiricalPath

‣ Example Reporting:

‣ https://www.google.com/analytics/web/?#realtime/rt-event/a12625662w34163983p33420663/%3Ffilter.list%3D40%3D%3Dyoutube-video%25253A3Sk7cOqB9Dk%3B

Page 13: Track Report & Optimize Your Web Creations

@EmpiricalPath

Only cumulative share data

Only cumulative share data

Page 14: Track Report & Optimize Your Web Creations

@EmpiricalPath

Hard Way: Manual

_gaq.push(['_trackSocial', network, socialAction, opt_target, opt_pagePath]);

SOURCE: https://developers.google.com/analytics/devguides/collection/gajs/gaTrackingSocial

Easy Way: Google +

Do nothing (but get only G+ Social Actions)

Easy Way: AddThis

<!-- AddThis Button BEGIN --> <a class="addthis_button" href="http://addthis.com/bookmark.php?v=250"> <img src="http://s7.addthis.com/static/btn/v2/lg-share-en.gif" width="125" height="16" alt="Bookmark and Share" style="border:0"/> </a> <script type="text/javascript"> var addthis_config = { data_ga_property: 'UA-xxxxxx-x', data_ga_social: true }; </script> <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script> <!-- AddThis Button END -->

Easy Way: Google +

Do nothing (but get GA Events, not Social Actions)

Page 15: Track Report & Optimize Your Web Creations

@EmpiricalPath

SOURCE: https://developers.google.com/analytics/devguides/collection/gajs/gaTrackingSocial

Twitter Tweets

1. Implement a twitter button on your page :

<a href="http://developers.google.com/analytics" class="twitter-share-button" data-lang="en">Tweet</a> <script type="text/javascript" charset="utf-8"> window.twttr = (function (d,s,id) { var t, js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js=d.createElement(s); js.id=id; js.src="//platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs); return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } }); }(document, "script", "twitter-wjs")); </script> 2. Use Twitter's Web Intents Javascript Events 3. Bind a callback function to the Intent Event 4. Wrap event bindings in a callback function to ensure everything has loaded before

binding events.

function trackTwitter(intent_event) { if (intent_event) { var opt_pagePath; if (intent_event.target && intent_event.target.nodeName == 'IFRAME') { opt_target = extractParamFromUri(intent_event.target.src, 'url'); } _gaq.push(['_trackSocial', 'twitter', 'tweet', opt_pagePath]); } } //Wrap event bindings - Wait for async js to load twttr.ready(function (twttr) { //event bindings twttr.events.bind('tweet', trackTwitter); });

Facebook Likes

1. Set up a Like button on your page using the following code

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script> <fb:like></fb:like> 2. Subscribe to Facebook's edge.create event 3. Create a callback function to execute the Google

Analytics tracking code. FB.Event.subscribe('edge.create', function(targetUrl) { _gaq.push(['_trackSocial', 'facebook', 'like', targetUrl]); });

Facebook Shares FB.Event.subscribe('message.send', function(targetUrl) { _gaq.push(['_trackSocial', 'facebook', 'send', targetUrl]); });

Facebook Unlikes FB.Event.subscribe('edge.remove', function(targetUrl) { _gaq.push(['_trackSocial', 'facebook', 'unlike', targetUrl]); });

Page 16: Track Report & Optimize Your Web Creations

@EmpiricalPath

NOTE: All data disguised

Page 17: Track Report & Optimize Your Web Creations

@EmpiricalPath

NOTE: All data disguised

Show all, new, returning, or

campaign, etc. visits

Show all, new, returning, or

campaign, etc. visits

Page 18: Track Report & Optimize Your Web Creations

@EmpiricalPath

NOTE: All data disguised

Page 19: Track Report & Optimize Your Web Creations

@EmpiricalPath

GA Debug (Chrome) WASP (Firefox)

Page 20: Track Report & Optimize Your Web Creations

@EmpiricalPath

Charles (any) Fiddler (any)

Page 21: Track Report & Optimize Your Web Creations

@EmpiricalPath

ObservePoint (Chrome) ObservePoint (Firefox)

Page 22: Track Report & Optimize Your Web Creations

@EmpiricalPath

Experiment with ideas and use conversion rate in key segments to pick a winner:

‣ Landing Page

‣ Ad Copy

‣Home Page

‣Offer

‣Discount

‣ Button color

Page 23: Track Report & Optimize Your Web Creations

@EmpiricalPath

Above-the-fold call-to-action

23% of next clicks from the

homepage are to promotions

23% of next clicks from the

homepage are to promotions

23% of next clicks from the

homepage are to promotions

23% of next clicks from the homepage are to promotions

Page 24: Track Report & Optimize Your Web Creations

@EmpiricalPath

Carousel dominates above-the-

fold

Copy pushes everything

but Carousel below fold

79% of page views are

entries to the site

Page 25: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 26: Track Report & Optimize Your Web Creations

@EmpiricalPath

Revenue per Pageview shot up

Bounce rate improved

Pageviews dropped as client cut

PPC NOTE: Period data disguised

Page 27: Track Report & Optimize Your Web Creations

@EmpiricalPath

Visits viewing page spent 32%

more despite falling 73%

Oh yeah!

NOTE: Period data disguised

Page 28: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 29: Track Report & Optimize Your Web Creations

@EmpiricalPath

Winner

Excellent lift in conversion rate

Page 30: Track Report & Optimize Your Web Creations

@EmpiricalPath

Downplay; few click but most of those

come back

Shrink; pushes

products & prices down

Shrink; pushes

products & prices down

Keep; many entrances

click

Lose; draws eye from

product art & headline

Page 31: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 32: Track Report & Optimize Your Web Creations

@EmpiricalPath

Testing Tool Pros Cons Estimated Costs

Content Experiments

Free No worries re: over-sampling Easy to use Part of existing GA login and code

base

No support but GACPs like Empirical Path

No multi-variate testing Non-intuitive splits between tests &

control No visual WYSIWYG editor No targeting

Free

Includes heatmaps & clickmaps Multi-variate testing Visual WYSIWYG editor Includes targeting GA integration

Customer support via email only $49/mo for 10k UVs/mo $249/mo for 100k UVs/mo $1,700/mo for 1M UVs/mo

Live customer support Multi-variate testing Visual WYSIWYG editor Forrester “strong performer” Includes targeting GA integration

Lacks heatmaps & clickmaps Smaller early-stage firm

$71/mo for 10k UVs/mo $359/mo for 100k UVs/mo $1,999/mo for 1M UVs/mo

Deep support team at Adobe Forrester “leader” Includes targeting

Essentially requires costly support team

Worst references in Forrester study No GA integration

$900-$1,300/mo with substantial incremental costs for each “mbox” (the area where split-test is executed, such as a graphic that is being tested)

Deep support team Forrester “leader” Fixed fee lets you test ad nauseum

High total cost Weak on integrations

“Six-figures” per year

Page 33: Track Report & Optimize Your Web Creations

@EmpiricalPath

Create variations

Edit, add, move

elements

Page 34: Track Report & Optimize Your Web Creations

@EmpiricalPath

Multiple success metrics

For each success metric

Page 35: Track Report & Optimize Your Web Creations

@EmpiricalPath

Measure conversion rate for each key segment of visitors.

‣ Traffic source (PPC, email, SEO)

‣Geography

‣ Loyalty (new, returning)

‣ Answers to survey questions

‣ Content interest

‣ Prior purchase

Page 36: Track Report & Optimize Your Web Creations

@EmpiricalPath

Unique content for

each audience

Page 37: Track Report & Optimize Your Web Creations

@EmpiricalPath

<script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-xxxxxxx-1']); _gaq.push(['_setCustomVar','1', 'Visitor Type', 'Prospective Student','1']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script>

Page 38: Track Report & Optimize Your Web Creations

@EmpiricalPath

NOTE: All data disguised

Row for each segment…in any report

Conversion rates for

multiple goals

Page 39: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 40: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 41: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 42: Track Report & Optimize Your Web Creations

@EmpiricalPath

1 row for each link or set of links worth

tracking

Ties in other analytics

tools

Tells analytics which

channel worked

Page 43: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 44: Track Report & Optimize Your Web Creations

@EmpiricalPath

Revenue Other

Conversions

Page 45: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 46: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 47: Track Report & Optimize Your Web Creations

@EmpiricalPath

Get analytics reports, findings & recommendations to decision-makers

‣ Build useful dashboards

‣ Email reports automatically

‣ Update spreadsheets automatically

‣ Try out mobile apps

‣ Display real-time metrics

Page 48: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 49: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 50: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 51: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 52: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 53: Track Report & Optimize Your Web Creations

@EmpiricalPath

Webtrends

ClickyTouch

ChartBeat

Analytics App

Page 54: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 55: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 56: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 57: Track Report & Optimize Your Web Creations

@EmpiricalPath

Page 58: Track Report & Optimize Your Web Creations

@EmpiricalPath

Questions now?

Questions later:

[email protected]

‣ @EmpiricalPath or @phowley99

‣ Facebook.com/EmpiricalPath

‣ +Empirical Path Page