Search Engine Marketing: Tracking Pages Without JavaScript by Using Web Beacons

September 17, 2012Beacons: Tracking pages without JavaScript

Ignatius Hsu, Business Analyst – [email protected], @ignatiushsu

Beacons

• What are they• Scenarios• Tracking communications channels• How to use one today in Google

• Classic Async

• Universal Analytics

• Challenges• http://bitly.com/bundles/ignatiushsu/3

9/17/20132 More Reading: http://bitly.com/bundles/ignatiushsu/3

3 More Reading: http://bitly.com/bundles/ignatiushsu/39/17/2013

4

An image embedded in content such as emails and Web pages

Often invisible to the visitor, a 1x1 pixel gif (though sometimes visible as display ad)

Image is served from a third party

Tracks movement on a piece of content or a site

Also used in sites designed for feature phones

Sometimes visitors are tracked across sites using third party cookies

Embedded Beacons

More Reading: http://bitly.com/bundles/ignatiushsu/39/17/2013

5

Embedded Beacon - Email


6

Embedded Beacon - Email


7

Web analytics packages use JavaScript to capture visit data, sends to server.

The transmission of data to the server is known as an “endpoint”. Many packages use a gif as their endpoint, not unlike a beacon.

gif - Google Async, Adobe SiteCatalyst

URL - Google Universal Analytics

Tracks movements within a site through first party cookies (third party cookies are now rare)

JavaScript Beacons


8

Beacons & AnalyticsEmbed Embed Dynamic JS

Channel Emails, Web Pages Web PagesBeacon Embedded image on page Endpoint is dynamically

rendered on page, captures visit data

Data storage Third party server captures and stores referral data

Transmits visit data through endpoint to a third party server

Cookies Often uses cookies (3rd party)

Uses cookies(1st party)

Use Cases Ad Networks, Email Marketing, Content on forums/external sites, other uses?

Owners of Websites


9

Analytics Tracking Methods

Content Presentation Layer + Client Browser

JavaScript No JavaScript

Control over Code

E.g. my website.Web Analytics(Google Analytics, Adobe Analytics, etc.)

E.g. native iOS app.Server side scripts, Mobile SDK Frameworks(Google Analytics for Mobile Websites - php…, Flurry iPhone/Android SDK, etc.)

No Control over Code

E.g. social media.Use analytics provided by service or third party, if any.(Facebook, Twitter, Hootsuite, Radian6, etc.)

Can I insert an external image? If yes, consider using a beacon.

E.g. email messages, forums, some publishing platforms.Use analytics provided by service (MailChimp Analytics360)

Can I insert an external image? If yes, use a beacon.


10

Multi-Channel Tracking (e-mail/site)

More Reading: http://bitly.com/bundles/ignatiushsu/3

Current

9/17/2013

11

Classic Universal Analytics Measurement Protocol

Multi-Channel Tracking (e-mail/site)


12

Classic GA BeaconFully Static Beacon (see bit.ly Google Spreadsheet):

<img src="http://www.google-analytics.com/__utm.gif?&utmwv=1&utmn={{random-number}}&utmhn=my.site.com&utmp=/filter-param/content.html&utmac=UA-XXXXXXX-Y ||&utmr=-&utmcc={{long-cookie-string}}" />

• Pageview model.• All pageviews tracked are tied to one unique visitor.• No cookies stored.

Pre-rolled Appspot Beacon (see bit.ly AppSpot for the developer’s post):

<img src="http://nojsstats.appspot.com/UA-XXXXXXX-Y/my.site.com/filter-param/content.html" />

• Pageview model.• Each pageview creates a unique visitor.• 1 pageview / unique session.• Third party cookie stored.


Classic GA Beacon

13

1. Fill in these values (or copy example values where applicable). Cookie value is a bit of a hack.

2. Copy this

Paste it wherever you need it


14

GA Universal BeaconUniversal Analytics, Measurement Protocol:

<img src="http://www.google-analytics.com/collect?v=1&tid=UA-XXXXXX-Y&cid=9988776655&t=event&ec=email&ea=open&el=9988776655&cs=weekly-promo&cm=email&cn=date-9-15-2013&cm1=1&cd1=9988776655" />

• Channel agnostic, track by event, pageview, app or social.• Mix and match.• Flexible.• Tracks hits to visits.• No cookie stored.


Universal Analytics Measurement Protocol

15

4. Copy this

5. Paste it wherever you need it

1. For CID, insert email or CRM customer ID, if possible

2. Complete fields for pageview or event or campaign.


Universal Analytics Measurement Protocol


Universal Measurement Protocol (optional enhancements)

17

• See bit.ly (below) for LunaMetrics resources on enhancements covered in this section• Custom Metric 1 (cm1) – “Email Opens” –used in custom reports

• Scope: user• Make active

• Custom Dimension 1 (cd1) – “Visitor ID” – allows stitching of client ID b/w email + site• Formatting Type: Integer• Min: 0, Max: 1• Make active


Universal Measurement Protocol (optional enhancements)

18

In your page source, add this code within the GA script, after “ga('create', 'UA-XXXXXX-Y', ‘my.site.com');” ga(function(tracker) { var hash = location.hash; var mcId = hash.match('mc_eid=(.*)'); var cid = tracker.get('clientId'); if(mcID){ var vid = mcId[1]; ga('set', 'dimension1', vid); }});

Where mc_eid is the link parameter added by your email marketing suite for unique customer ID. There may be other parametrs your email suite autotags.

Keep email link campaign codes consistent:?utm_campaign=date-9-15-2013&utm_medium=email&utm_source=weekly-promo&mc_eid=9988776655


Universal Measurement Protocol Report


Caution on Beacons

Classic

• Both versions have drawbacks (which is why we only use them when other options aren’t available).

• If pageviews are not tied to a unique visit, consider creating a new profile to track these interactions, and filtering these out of your main profile(s) so as to not affect visit metrics (bounce, pageviews/visit, time on site, etc).

Universal

• Pageviews are tied to visits. Events still count towards visit data, so like Classic, create a new account and set up filters.

• Track external pages and emails as events. Less messy, at least until User ID arrives (Universal is still in beta). Where possible, connect a Client ID to a user, and stitch data between channels (e.g. email and website).

• In Universal Analytics, Client ID <> User ID.• Client ID is supposed to be an anonymous ID, and is not a unique identifier.• User ID is a customer ID.• People speculate that User ID can be defined/switched by us in a future release.


21

Speculating on the FutureSome vendors are already stitching cookie data in sophisticated ways. This diagram is a concept of how multi-channel tacking might be done through cookies and a flexible analytics package. The devil is in the details. What are the privacy implications, and how would customers opt-out?

Multi-Channel Tracking


22

More Resources: http://bitly.com/bundles/ignatiushsu/3

Health & Medicine

Search Engine Marketing: Tracking Pages Without JavaScript by Using Web Beacons