Google Analytics

Google analytics is a web analytics service offered by Google and a central part of the company’s marketing platform. Basically it works by adding a small javascript (tracking code) to the bottom section of a website, whereafter all user activity is collected and reported to a webservice.

You will need a google account to set up your first tracking website. So head over to analytics.google.com to set up a new account. Give your account a name – and read the options more carefully than you usually would.

Analytics as a full recommended setup is basically GDPR domain. As developers we should be aware of the implicances. If you allow the recommended setting in your analytics account setup, GDPR would strictly demand user consent.

As you can see all the setting checkmarks are “recommended”. The first one is important – allow Google products & services. We kind of know that phrase by now, what it means is – allow Google to use your webpage and visitor data in their data-analysis. Wonder why you can opt-out? Well, GDPR.

Another point to remark, is how we allow Googles cross service ad-features. Remember, your website in itself, does now allow Google – or any other company – to surveil the behaviour of your users. It is not until this moment – when you actively put a script on your page, that monitors and sends all activity on to Google, that this is even possible.

There is, of course, a big difference between knowing who somebody is before they came along, as supposed to having a completely anonymous profile. (x clicked the article about y vs. sporty male, 32 clicked article about y). When you opt in for sharing data with Google, and for using their 3d party ad-services, you should gain user consent.

More tips on how to make ga GDPR compliant

Anyway, since we will use this for an educational purpose, let’s allow all four domains in our setup. As long as you keep in mind to take this discussion with a future client or employer.

On the next page let’s set up the basics. Why do we have to fill in an industry? This has to do with the aforementioned. Firstly, Google can use this to gain knowledge on industries and data. As a bonus, they give us back the ability to “benchmark” our pages – i.e check how well they perform compared to other pages in the same industry. For now, let’s hjust choose “jobs and education” or the like.

On the next page we get some interesting GDPR stuff – as you can see Google actually explicitly tells us to make a cookie consent on our page. This is due to the fact, that we opted in on the sharing options. We will get back to this later. Whether or not these options are worth the trouble for your users – and worth blending with the communicative purpose – is worth a contextual reflection.

Click next and your account is set up. Google signals is next for opt in – let’s do it for now, but again. Well the same debate returns.

Basic setup

In page analytics – is the ability to see analytics data directly on your page via a chrome plugin. Can be fun – activate it.

User metrics – in order to make a distinction between new and returning visitors, google analytics places a cookie on the client computer. This metric is an important part of the data analysis on most websites, so activate.

Tracking info – right, so this is the code we need to get the actual tracking done. Copy the code and head over to the html file.

User-ID – wait

Session timeout – define a time period for when a new session should begin. Not relevant for now.

Excluded links – this is relevant if you own a company, but don’t want to track internals traffic. May blur or burst your campaign irrelevantly if a graphics designer hits the page 100 times every hour.

Connect a google ads account – this is relevant if you set up a campaign, and want to cross check efficiency. Leave blank for now, but we will get back to that.

Products – interesting to go through, too complicated to set up at this point.

Target groups – remarketing. At this point it begins to get interesting. We don’t need to set this up at this point, but it’s good to know the concept:

Remarketing is a clever way to connect with visitors to your website who may not have made an immediate purchase or enquiry. It allows you to position targeted ads in front of a defined audience that had previously visited your website – as they browse elsewhere around the internet.

Customized dimensions – the ability to set specific dimensions directly via javascript. We’ll get back to that.

Dataimport – not now.

Get to work

Clicking around your own site in order to generate activity can be necessary but tedious. There are several ways to come around this challenge. One option is simply to use the Google Demo Account You can also generate some test data directly in your analytics account.

GA Frontpage – users, sessions and bounce

The frontpage presents you with an overview or dashboard of the most important things you need to know about your website. Users refer to “unique sessions”, namely the number of sessions without a pre-existing cookie (to inspect all cookies from ga, open dev-tools/applications).

Bounce refers to users who come to your page, only views one single page, and then closes the tab (without pushing any buttons, reloading the page or in any other way contact the google analytics server again, during the visit).

This may be an important metric – but not always. Depending on the aim of your campaign, you may or may not wish to see this behaviour. Bounce rate refers to the percentage of users, who carry out this behaviour.

Session average duration is the average time users spend, visiting your page.

Real time view

Now, if you head back to the analytics overview, you should be able to track some data (Google analytics takes upto 24 hours for most aggregated data to appear – while real time view, updates every 5 seconds).

Open the website you’re tracking and check out the real time view.

This is fairly interesting. As you can see, analytics now know that you are visiting your own page. The overview can teach us a little intro to how ga works.

Referrer URL

The address of the web page where a person clicked a link that sent them to your page. If you were to follow a link to your webpage from another site (i.e. ad, email, google search or other webpages), such as the page you are reading on right now – click below and you will be able to see the referrer in th real time view:

https://simmoe.github.io/analytics_boilerplate/

Search sources

One very important feature for campaign websites is to know how well the page performs on search engines. Try to see if you can find your own page via google search – or other search engines.

As you can see, you may be able to see that you have a visitor that found your campaign page via google “organic” search (organic, meaning you didn’t pay for this search-result). But you can’t see the search term – frustrating! This is due to the fact that google search nowadays is encrypted over https – Google still knows the search phrase of course, but choose not to show it. This will all change the moment you start paying Google to beef up your page in search results of course, but for now it doesn’t help us much.

Maybe setting up a search console will help us get better search data. Go to admin/property/search console.

We can try – but I dunno for now.

Content

The content tab gives you an overview of active pages. If you create one or more subpages on your domain, you will be able to generate specific views for those pages. Later on you can cross-link that type of information:

  • how many new/returning users click the subpage link?
  • are there specific time-intervals/weekdays where users are more likely to click the link?

The real time view gives us a basic understanding of how Google Analytics work. When you are running actual campaigns (or websites in general), this can be an informative place to spend time getting to know your users. But the real strength in Google Analytics lies in the aggregated data – the history of your campaign or website so to speak. Let’s head on to the Target Groups to start building an understanding.

Target groups in GA

The target groups tab is the general overview of the websites users, and most often the starting point for analysis.

New and returning visitors, sessions and pageviews

When you have the GA script on your page, it generates a cookie on your computer, so it is possible to track whether you have visited the page before. Depending on the aim of your campaign, this is an important metric.

Users generally have sessions – a full visit from when they come to your page, until they close the browser tab (default session timeout is 30 minutes). Sessions have pageviews, which again may be unique (first time ever) or returning (been here before).

If you visit your page in a private browser window, you will be able to generate unique visits, otherwise the cookie will recognize you.

Active users is a metric for the behaviour of returning visitors.

Lifetime Value and Kohortes will be diggin a bit too deep for now. Head on to the target groups tag.

Referral

Where do your visitors come from? Whenever a link is clicked on the internet it bears a trail of its origin. Typically you are interested to know whether your users:

  • Come from other internet pages (links)
  • Come from search engines (Google and…)
  • Come from other media, such as email campaigns or other (i.e. barcodes)
  • Come directly (type the URL in their browser or have it bookmarked)

User information

As you can see here, GA actually stores a unique client ID for every user that visits the page. This is not an IP address or the like. It’s a Cookie! The number of “users” on your website is equal to the number of unique client IDs in this panel.

You can track unique actions for specific users in this view. What pages did he/she visit and when, etc. For more advanced use of the GA tracking modules, this feature could be used to store user specific information, and thus generate user specific actions. You could, say, store an array of user-id’s who – if they visit the page once more – will be invited to a job interview, given a medal or price etc.

Demographics and interests

Most often when you are new to setting up Google Analytics on a personal page, you open these tabs with excitement and exit disappointed. We are obviously tuning in to the more interesting features of the analytics module, but also the more speculative.

Anyway, since we are here to learn, we better take a look at how to enable demographics and interest reports.

Notice that even though you set analytics up to track demographics and interests, this may not give you a quick insight into aggregated values, simply because the site traffic you will be able to generate on your own, does not comply with being “aggregated”.

The above are the standard segmentation categories used by analytics. Unfortunately it can be quite hard to test these segments, if you have poor or no traffic to your campaign. Which may be the case at this point.

Adding segments

From the analytics panel it is easy to create and compare user segments. Open i.e the “Audience” tab, and hit + next to the default “all users” target group. Now check “users with conversions” (or any other predefined segment) and hit apply. As it appears you now have a fine overview of the share of conversion sessions on the page.

Campaign setup in Google Analytics

When you set up a campaign landingpage, you will often seek to make an architecture that makes it as simple as possible to track down your users behaviour. I.e a frontpage with one single “call to action”. This could be for the user to subscribe to a newsletter, click a contact link, read some info or other relevant behaviour according to the client.

What measures and targets are the most relevant for you, depends on the nature of your campaign. Typically however, you (and your customers) have interest in these basic features:

  • Where do users come from? (i.e. other webpages, email newsletters, poster codes etc)
  • How many and who conducted desired actions? (conversions, call to action, subscriptions etc)
  • Where do users go after they visit the site (relevant for external landing pages, bounce analysis, remarketing etc)

There are several ways to come about this information in analytics. Some of it is build into the tool without customization. To create a hard hitting campaign however, you need to be able to tweak and customize analytics, to be more exact than it comes out of the box. In the following we will go through some common methods to answer the questions above.

There are many more ways to do this of course, analytics is a complex tool and bread on the table for many a hardworking coder or analyst – just bear in mind that in order to get to know this tool in depth, you need to put the time in, and hands on, it takes.

Custom campaign URL – where do your users come from?

The google analytics “acquisition” tab is where you start looking for answers to this question. The reports present data based on the source and medium of your users, along with other acquisition dimensions.

In order to leverage the standard reports, we can create custom URL’s that tells GA directly how to categorize incoming traffic.

Let’s make a link somewhere – i.e in a word document – and follow the trail. You get nothing (direct link). Let’s make the url more interesting. Check out these URL’s

https://simmoe.github.io/analytics_boilerplate/
https://simmoe.github.io/analytics_boilerplate/?utm_source=email&utm_medium=quick_newsletter&utm_campaign=quick_campaign&utm_content=link_one
https://simmoe.github.io/analytics_boilerplate/?utm_source=web&utm_medium=animated_banner&utm_campaign=quick_campaign&utm_content=image_link

The first URL will – regardless of whether it was clicked from another webpage, email link or directly in the browser – give us little or no information as to where traffic comes from. The second tells us a lot more: this traffic came from the source “email”, more specifically “link_one” from the medium “quick_newsletter”, that belongs to the campaign “quick_campaign”.

Using custom URL’s thus allows you to control external traffic sources before they land on your page. Note: when you set up paid ads like Google adwords or Facebook ads, custom URL’s are taken care of for you.

There are 5 parameters you can add to your URLs:

  • utm_source: Identify the advertiser, site, publication, etc. that is sending traffic to your property, for example: google, newsletter4, billboard.
  • utm_medium: The advertising or marketing medium, for example: cpc, banner, email newsletter.
  • utm_campaign: The individual campaign name, slogan, promo code, etc. for a product.
  • utm_term: Identify paid search keywords. If you’re manually tagging paid keyword campaigns, you should also use utm_term to specify the keyword.
  • utm_content: Used to differentiate similar content, or links within the same ad. For example, if you have two call-to-action links within the same email message, you can use utm_content and set different values for each so you can tell which version is more effective.

Read more on how to make a custom campaign via URL referrals

Reporting custom URL’s

To see the effects of a campaign generated from custom URL’s, simply hit Acquisition/Campaigns and choose the campaign which you wish to report.

Custom events

Most often you will want to be a bit more clever than you can by using referral values. Custom events make it possible to produce analytics data directly via user interaction on your page. Let’s review the gtag global setup:

<script async src="https://www.googletagmanager.com/gtag/js?id=UA-145815969-1"></script>
<script>
			window.dataLayer = window.dataLayer || [];
            function gtag() {
                dataLayer.push(arguments);
            }
            gtag('js', new Date());
            gtag('config', 'UA-YOUR-GA-ID');
</script>

This basically imports the ga tracking script, and pushes all of the standard events to your tracking database. But say we went on and made some interactive component – i.e. a small webform. And we wanted to track the results of that to our data. Go ahead and create a small section with the following links:

<a id="self-assured" href="#">I am aware of the consequences, take me on</a>
<a id="insecure" href="#">I am not sure of the consequences, should I really click this link?</a>

And in the script section, add some event handling:

<script>
document.addEventListener('click', (e) => {
// If the clicked element doesn't have the right selector, bail
	if (event.target.matches('#self-assured')) {
    	gtag('event', 'Click link', {
        	'event_category': 'interactive tests',
            'event_label': 'Self assured link'
        });
	}

  	if (event.target.matches('#self-insecure')) {
    	gtag('event', 'Clicked self-insecure', {
        	'event_category': 'interactive tests',
            'event_label': 'Self insecure link',
            'value': 20
        });
    }
    console.log("User clicked: " + e.target);
});
</script>

Now publish the page and make a few clicks – review the results in the realtime panel:

You now have a realtime view of user interaction on your campaign landingpage in action. Too generate a full report on the “interaction test”, you will have to wait 24 hours.

Reporting: Using events as segments

What if we would like to treat users who trickered certain events a segments? This way we can answer specific questions such as “how many users who clicked self-assured, subscribed to the newsletter?”

First go into a tab i.e. ‘acquisition’ and choose ‘new segment’. Give the segment a name, i.e. “Self assured”. Click conditions – event label – exactly matches, and choose the relevant segment.

You are now able to generate a specific report on how users who clicked the self-assured link, behave – i.e related to your goals. Neat.

Now choose segments, and add ‘all users’ to your view. You are now able to compare event-based segments, to all users – i.e to see how likely they are

Conversions

Conversions describes the fact that with campaigns, we most often seek to obtain certain goals. It may be buying something, reading or doing something, depending on the nature of the campaign of course. A common way to use Google Analytics, is to set up goals.

A conversion is reported whenever a user completes a goal or makes a purchase during a session. Let’s head to the admin/account/goals section to set up a conversion. It is possible to choose different goal templates, for now let’s use “Subscribe to newsletter” and set type to “destination”. As destination, choose a URL to a subpage, i.e “/your_repo_name/thanks.html”. Go ahead and create the page on your website.

Now again, you will be able to check that your goal works in realtime – but you will have to wait with generating a report.

A/B testing with Google Analytics

To create an A/B test, the first thing to do is to form a simple hypothesis concerning some of your web-content. Start small – ie.

changing the color of the action button may have an effect on click through rate.

Now we leave analytics and shift to something called Google Optimize. Admittedly this is confusing, but this is the way it’s been setup. Follow these directions to perform A/B testing.

Behaviour

Way in way out

Another important feature of many campaign sites, is to lead users on to some other page. Meaning the campaign landingpage is really an intermediate page, to make users go on to subscribe/enroll/download/read on about something. To check the flow of your users behaviour and exit, go to behaviour/flow.

Measuring external URL’s

When a user leaves your website, GA is not able to track data any further (well, they are, but it’s not visible i your dashboard anymore). We may often wish to track an external URL however – in fact this may be a central goal of a campaign or collaboration.

In order to track a click to an external ressource, first add a click handler to the tag:

<a onclick="getOutboundLink('www.example.com'); return false;">Zero moment of truth.</a>

Next, setup a script snippet that reports the click as a custom event.

 <script>
         /*
         * Function that registers a click on an outbound link in Analytics.
         * This function takes a valid URL string as an argument, and uses that URL string
         * as the event label. Setting the transport method to 'beacon' lets the hit be sent
         * using 'navigator.sendBeacon' in browser that support it.
         */
        let getOutboundLink = function (url) {
            gtag('event', 'click', {
                'event_category': 'outbound',
                'event_label': url,
                'transport_type': 'beacon',
                'event_callback': function () {
                    document.location = url;
                }
            });
        }
</script>

Now, you can either treat the link as a standard custom event, or set up a goal that measures it’s clicks.

Custom reporting

Now that we have made a small GA setup, you can look at some of the options to customize your experience of the software. This may not seem important now, but as soon as you get a boss, and she wants to know excactly how it’s going right now with the newsletter campaign, all of a sudden it is.

Custom dashboards are a widget set up that allows you to create a small live figure of any measure on your site. Try to add a dashboard and set up a few widgets. I.e a widget that shows how well your goals are performing:

Leave a comment