CODEWITHSUNDEEP
javascriptjquery-uigoogle-analytics
Ben
Ben

Reputation: 25807

Is there a reason to put google analytics in head and not in body?

Does exist reason to put google analytics in head and not in the end of body? (I working on big website that its works in this way)

Option 1:

<head>
<script src="http://www.google-analytics.com/ga.js"></script>
</head>

Option 2 - in bottom of body :

<body>
//html code

<script src="http://www.google-analytics.com/ga.js"></script>
</body>

Edit1: Also the same question with jquery ui

Edit2: add ga.js in the end of script (fix)

Thanks

Upvotes: 12

Views: 14378

Answers (4)

Yahel
Yahel

Reputation: 37305

Embedding the ga.js code the way you describe (with a hardcoded <script> tag) is indeed blocking, and if you load the script like that, the best practice is considered to be loading it at the just before the </body> tag. But this is not the recommended practice if you're using the new asynchronous code. Google explicitly recommends placing the new asynchronous code in the <head>.

The new asynchoronous code is non-blocking in two ways. First, it queues up the variables for the page in a global _gaq variable. That way, the data is prepared either way.

Then, as described in this SO answer, using javascript directly to write out the script as in the new async code is non-blocking (this direct inject method is the way to achieve asynchronous-ness, even in browsers that don't directly observe the async attribute). The rest of the site can continue to load if for some reason Google's servers are down or slow to respond. And that's only if the user doesn't have ga.js cached already, as many do, since ga.js is used on many, many popular websites.

The benefit of all this is that the earlier the ga.js loads and is able to transmit the _gaq object to Google, the more likely you'll be to capture ALL of your potential data, like the data of the users who click very quickly on your page. This is particularly important for 'big' websites that tend to have lots of regular users who follow quick-clicking habits.

If you're skeptical, test it out using a page load inspector like the webkit developer tools. I've tested it extensively and found no evidence of significant blocking when using the async code in the </head> as described.

Upvotes: 30

enricog
enricog

Reputation: 4273

I suggest to use the asynchronous google analytics code.

Asynchronous Google Analytics

If you use the non-asynchronous code and put it into the head section, it may block the load of your website if the ga code would be slow to load, because it waits until the scripts are loaded. And because google analytics is an external script you may have no influence on the load performance (normally it should not matter, but it can happen that even google has server problems).

So, no i don't see a real reason to do it that way.

Upvotes: 6

Kris van der Mast
Kris van der Mast

Reputation: 16613

It's recommended to put such scrips as low as possible in the html for performance reasons. Scripts that need to get loaded interrupt other downloads in the browser. I suggest that you take a look at this article: Best Practices for Speeding Up Your Web Site.

Upvotes: 0

Oded
Oded

Reputation: 499002

There is no good reason for it. Google themselves recommend putting the tag at the bottom of the body in order to avoid loading it early on and slowing down page loading.

It was probably done that way because someone is used to putting <script> tags in the header.

Upvotes: 2

Related Questions