12

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

1
  • See [ Google Analytics code: can it go before in the document? ](stackoverflow.com/questions/1708771) and [ does Google analytics make a major effect on time to download a static web page? ](stackoverflow.com/questions/374084). The bottom line is that Google recommends putting it at the end of the body so it won't block the rest of your page. But it's okay to put it in the head. Also, GA now has async version (see this question), which lets you put the GA code earlier and have it load in parallel in modern browsers. Commented Sep 12, 2010 at 10:06

4 Answers 4

30

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.

Sign up to request clarification or add additional context in comments.

Comments

6

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.

4 Comments

1. soo I have to put in this case: google-analytics.com/ga.jsin head? 2. How browser know to handle asyn=true? Thanks
Its use in this way like in article
Hi, the async=true is a HTML5 attribute. The trick with not blocking the website while loading the javascript is due to the dynamic creation of the script tag.
This is just additional for the future. Have a look at this link, this explains asynchronous javascript friendlybit.com/js/lazy-loading-asyncronous-javascript
2

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.

2 Comments

No, other ls except ui+jquery inside body
This is no longer true. When using the new asynchronous code, Google recommends putting it at the bottom of the </head>, just before the opening <body> tag.
0

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.

1 Comment

I know that, because that I answer.The website build by good exports, soo that know the article.Soo should be some reason that they put in header because most of js in body.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.