Should I put the Google Analytics JS in the <head> or at the end of <body>?
Google AnalyticsGoogle Analytics Problem Overview
Google gives me a piece of javascript and tells me to include it in the <head>.
Can I put it at the end of <body> or will some side effects occur if I do that?
Google Analytics Solutions
Solution 1 - Google Analytics
Putting it at the end of the <head> section helps ensure the your metrics are tracked even when a user doesn't let the page finish loading.
They used to tell you to put it at the bottom of the page, before they added support for handling partial loading of pages.
Directly from Google:
> One of the main advantages of the
> asynchronous snippet is that you can
> position it at the top of the HTML
> document. This increases the
> likelihood that the tracking beacon
> will be sent before the user leaves
> the page. It is customary to place
> JavaScript code in the <head> section,
> and we recommend placing the snippet
> at the bottom of the section
> for best performance.
See Google Analytics Help: Add the tracking code directly to your site
Solution 2 - Google Analytics
2021 Update
The general help page now states to "Copy and paste the global site tag after the opening <head> tag on each page you want to measure". So they now want it before virtually everything else. This may be due to changes to the tracking scripts.
2020 Update
Google currently suggests three different locations, which is frustrating. I haven't found technical justification for any of them directly from Google.
-
For static sites the general help page tells us to place the code snippet "before the closing
</head>tag". -
For dynamic sites (with documents generated by the server), the same site says to put it "immediately after the opening
<body>tag". -
The developer site, however, still has us putting it "near the top of the
<head>tag and before any other script or CSS tags" for all sites.
These are substantially different locations, and what's best for a particular user may depend on whether collection of partial page loads is desired. Some testing may be in order.
Solution 3 - Google Analytics
You can put it anywhere you want. I always put tracking code at the end of the page and I've never had any problems.
Solution 4 - Google Analytics
You can put it anywhere you want on page, and ll run anywhere on the page whether it’s in the head or the body. But according to Google support (Add the tracking code directly to your site) it is recommended to it in the head tag, paste it immediately before the closing </head> tag.
Following paragraph from a good article explaining why to put code in head tag
> The Pageview is recorded only after that code is loaded up. So the > sooner you load the code, the sooner that Pageview is recorded. Let’s > say you have a big blog page, and it’s a slow loading one, taking even > 10 to 20 seconds to load everything up. If your Google Code doesn’t > start until the end of the page, it can get held up, just like the old > non-asynchronous code used to hold up OTHER lines of code. Except now > it’s holding up the tracking code. If a visitor to your site hits the > page, and then leaves it before the tracking code fires the Pageview, > then you lose that visitor. They now become a new direct visit to > whatever page of the site they landed on. This can make all sorts of > data on your site incorrect.
Solution 5 - Google Analytics
2021 addition regarding page load speed
Before 2021 answer was quite straight foward. Generaly Google Analytics gathers most reliable data when it is run as early as possible when the page is loading. But there are 2 things to take into account:
- Many 2021 implementations of GA use Google Tag Manager, which also loads other, sometimes heavy, scripts. That was not the case a few years ago.
- Introduction of Core Web Vitals and mobile first indexing by Google and their importance for SEO means that accuracy of Google Analytics is no longer only thing to consider when placing the code. The other one is page load time.
In some situations, when you place GA with GTM on script heavy sites, it is easy to impact load times of the page and Core Web Vitals with the implementation. You can see this impact in Google PageSpeed Insights on many popular sites - before 2021 it almost did not matter. Now, changing the position of GTM (and GA with it) can make a big difference in PageSpeed Insights results. See how often "remove render-blocking javascript" advice contains GTM and GA tags in PageSpeed Insights.
So, to sum up, in 2021 there will even be cases that you would want to place GA code at the end of body. You have to be extra careful with your decision, especially when implementing it with GTM and other scripts.
Solution 6 - Google Analytics
In the head, just before the closing </ head> tag, then you won't have any problems verifying your website in Webmaster Tools.
Solution 7 - Google Analytics
Adding the following code (known as the "JavaScript tracking snippet") to your site's templates is the easiest way to get started using analytics.js.
The code should be added near the top of the tag and before any other script or CSS tags, and the string 'UA-XXXXX-Y' should be replaced with the property ID (also called the "tracking ID") of the Google Analytics property you wish to track.
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->
The above code does four main things:
-
Creates a
Solution 8 - Google Analytics
The code you should always be added near the top of the tag and before any other script or CSS tags, and the string 'UA-XXXXX-Y' should be replaced with the property ID (also called the "tracking ID") of the Google Analytics property you wish to track.