There were a few bugs with our new heatmaps for people who were putting our tracking code in their HTML head tag, and there were an alarmingly large number of you doing so. Those bugs are fixed now, but that’s beside the point of this little post.
Web browsers download page elements in the order that they are listed in your HTML – CSS, javascript, and images (mostly). If the domain that any of those are hosted on is offline or going slow, a web browser will “hang” for up to 60 seconds while it waits for the item to load, before moving on to the next item. (Asynchronous javascript is an exception but that’s still not very common – although we do offer it an option – but again, that’s not the point. And besides, if you’re loading it asynchronously, you’re not depending on it being available for immediate execution, so what would be the point of putting it in your HTML head?).
If you have third party javascript in your HTML head and that third party server goes offline, your web site is effectively dead because nothing else is going to load for up to 60 seconds. When I visit sites that hang like that, I immediately close them as I’m sure 99% of people do.
If the javascript was instead in the footer of your web site, the web browser would still hang trying to download the item, but most of your site would already be loaded in the visitor’s web browser. In other words, your site would still be (mostly) usable while the engineers for the third party service go into panic mode.
Our CDN never really goes “offline” but there are obviously thousands of services out there that ask you to put their javascript on your web site. Any third party javascript code that’s not critical to your web site working properly should never go in the HTML head. Tracking code, ad code, widgets, social plugins, etc – these are all non-critical and have no business up there. Help make the internet a better place and always put that code at the bottom of your web site, k?
The only valid exception here is if it’s hosted by a major provider such as Google, and you rely on the functionality of that code as the page loads (which we do for Google’s map API, but that’s it). That is the only exception.
So… if you’ve got our code in your HTML head, please move it instead to the bottom of your HTML, right before the closing /body tag, as has always been recommended on the page where you grab your tracking code from.
Bonus pro-tip: For first party elements, your CSS file should always be the very first item in your HTML head. That way your site will always look “proper” as soon as possible, beacuse this will be the very first thing the browser downloads after the HTML itself.
