Google Analytics Bag o’ Tricks: Tracking Content Engagement Like Ecommerce

Google Analytics Bag o’ Tricks
Simo Ahava (NetBooster) – SUPERWEEK 2015

SUPERWEEK 2015 | #SPWK | @SimoAhava
Simo Ahava | NetBooster
@SimoAhava
http://google.me/+SimoAhava
simo.ahava@netbooster.fi
www.simoahava.com

My (GA) Developer Philosophy

If you build it, data will
come

The Web is (inherently)
stateless

User intent is untrackable
in the stateless Web

The life span of a web page
ENTRANCE
EXIT

No, browser cookies are
not the solution (or HTML
Storage)

document.cookie = 'returning=true'; document.cookie = 'articlesRead=3';

They provide you with
temporary state only

Google Analytics is
stateful

From https://developers.google.com/analytics/devguides/platform/customdimsmets

Google Analytics is better
at pattern-matching than a
browser

But it requires quality
input

When the stateless and the stateful unite
Meaningful data

How do we find and
collect meaningful data?

No, how do we ask the
right questions?

When a user doesn’t view a page, is it a Page View?

Surely not?
* Obligatory Conference Presentation Meme

APIS, WORKERS, LIBRARIES, SPECIFICATIONS
ECMAScript
DOMSettableTokenList
Web Audio
AutocompleteErrorEvent
Animation Timing
DOMTokenList
DOM
Fullscreen
Drag and Drop
SVG
Indexed DB
DocumentFragment
DOMError
File API
ChildNode
Media
DOMImplementation
Web Sockets and Messaging
Event
WebGL
Visibility
Web Storage
Document
EventSource
CSS Object Model
Comment
Web Workers
Attr
WebRTC
Selectors
DocumentType
Offline
Element
CharacterData
Browser
Canvas
EventListener
CustomEvent
Shadow DOM
CloseEvent
File System API
BroadcastChannel
Typed Arrays
Pointer Lock
Elements

PAGE VISIBILITY API

PAGE VISIBILITY API
Visible: document['hidden'] = false
Hidden: document['hidden'] = true

PAGE VISIBILITY API
Visible: document['hidden'] = false
Hidden: document['hidden'] = true
document.addEventListener('visibilitychange', function() {
dataLayer.push({
'event' : 'visibilityChange'
});
});

PAGE VISIBILITY API
Meaningful data:
When a page is loaded in hidden state, do not send a Page View.
If the visibility of the page changes from hidden to visible, then
send the Page View.

DETAILED GUIDE
http://goo.gl/DFgxmi

THE PROCESS
1. Page is loaded in the browser
2. Is the Visibility API supported?
3. Is the page visible?
4. Is a Visibility Change detected?
yes / no
FIRE PAGE VIEW
…and remove visibility listener…
…and end the process…

THE PROCESS
yes / no
FIRE PAGE VIEW

THE PROCESS
yes / no
FIRE PAGE VIEW
…and end the process…>> >>

THE PROCESS
yes / no
FIRE PAGE VIEW
document.addEventListener(
'visibilitychange',
function() {
dataLayer.push({
'event' : 'visibility-
Change'
});
}
);

THE PROCESS
yes / no
FIRE PAGE VIEW

What just happened?

We made a metric more
meaningful

But it’s only meaningful if
the questions it answers
are relevant

How can we measure content engagement?

Content engagement is
notoriously difficult to
track

Adjusted Bounce Rate
Adjusted

Adjusted Bounce Rate
Adjusted
Not happy with a metric? Sure! Tweak the data
collection. Don’t tackle the real
problem, i.e. your horrible content!

Scroll Tracking
http://cutroni.com/blog/2014/02/12/advanced-content-tracking-with-universal-analytics/

Scroll Tracking
Better, but it isolates the action of reading as the sole
qualification of engagement.

Content is to a blog what
products are to a web
store

Shopping Reading Behavior

Checkout Behavior Content Engagement

Product Article Performance

Product Content List Performance

Internal Promotions

Step 1: Terminology

Product: A blog article
Product price: Words in an article
Product impression: Views of a
title or title+ingress in content
lists
Product list: Widget / content
area where product impressions
can be gathered from
Product list click: Clicks on entries
in a product list
Product detail view: Page load
of an article page
Add to cart: First scroll on an
article page
Checkout: 1/3, 2/3, and 3/3
scroll depth on an article page
Purchase: 3/3 scroll depth on an
article page and minimum of 60
seconds dwell time

Step 2: Data Collection

PRODUCT LISTS

PRODUCT LISTS
Product impression
Product impression
Product
impressions
Internal promotion

ARTICLE PAGE

ARTICLE PAGE: INITIAL PAGE LOAD = PRODUCT DETAIL VIEW

ARTICLE PAGE: SCROLLING BEGINS = ADD TO CART

ARTICLE PAGE: SCROLL DEPTH = CHECKOUT

ARTICLE PAGE: SCROLL DEPTH + DWELL TIME = PURCHASE

TIPS
1. Use dataLayer, don’t do what I did (DOM scrape)
2. Feel free to leave something out if it isn’t meaningful
or doesn’t make sense
3. Design the data collection with analysis in mind – not
because it’s fun and cool
4. If using GTM, remember that only the most recent
’ecommerce’ object push is sent with a tag! Always
remember to push an ’event’ value with an
’ecommerce’ object push
5. Read Google’s Dev Guide! It’s all in there.

Google Analytics Bag o’ Tricks: Tracking Content Engagement Like Ecommerce

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Destacado

Destacado (20)

Similar a Google Analytics Bag o’ Tricks: Tracking Content Engagement Like Ecommerce

Similar a Google Analytics Bag o’ Tricks: Tracking Content Engagement Like Ecommerce (20)

Más de Simo Ahava

Más de Simo Ahava (13)

Último

Último (20)

Google Analytics Bag o’ Tricks: Tracking Content Engagement Like Ecommerce