Devo colocar o JS do Google Analytics no <head> ou no final de <body>?

123

O Google me fornece um pedaço de javascript e diz para incluí-lo no <head> .

Posso colocá-lo no final <body>ou alguns efeitos colaterais ocorrerão se eu fizer isso?

google-analytics Peter Hall
fonte
3
Eles não dizem para colocá-lo antes da tag de fechamento </body>? Ou isso mudou?
Marko

Respostas:

155

Colocá-lo no final da <head>seção ajuda a garantir que suas métricas sejam rastreadas, mesmo quando um usuário não deixa o carregamento da página.

Eles costumavam dizer para você colocá-lo na parte inferior da página, antes de adicionar suporte para lidar com o carregamento parcial de páginas.

Diretamente do Google:

Uma das principais vantagens do snippet assíncrono é que você pode posicioná-lo na parte superior do documento HTML. Isso aumenta a probabilidade de o farol de rastreamento ser enviado antes que o usuário saia da página. É habitual colocar o código JavaScript na <head>seção e recomendamos colocar o snippet na parte inferior da seção para obter o melhor desempenho.

Consulte a Ajuda do Google Analytics : adicione o código de acompanhamento diretamente ao seu site

Chris Arguin
fonte
8
Então está tudo bem se eu colocá-lo no fundo? Prefiro que minhas páginas sejam carregadas rapidamente, colocando tudo na parte inferior (e css na parte superior para a renderização adequada) -edit- é bruto colocar js lá em cima.
2
Sim, tudo bem fazer isso; Na verdade, eu tenho uma mistura, mas migrei principalmente para colocá-la no topo pelas razões mencionadas.
Chris Arguin
6
Por que isso é uma vantagem? Parece-me que não quero contar carregamentos parciais de páginas porque esses usuários estão basicamente dizendo que cometeram um erro ao chegar lá em primeiro lugar. Mesmo quando eles pretendem estar lá, não quero fazê-los esperar mais um milissegundo para ver meu conteúdo.
Melinda Green
3
Um carregamento parcial da página também pode significar algo para o proprietário do site que ele precisa corrigir. Imagine alguém que entra na sua loja, apenas para perceber que o exterior os enganou a entrar. Você deseja corrigir sua publicidade para corrigir isso.
Optimus
2
Uma pequena atualização para isso: em vez de no final de <head>, a página vinculada agora diz "Adicione a tag logo após a abertura da tag <head> em cada página".
Brandon
6

Você pode colocá-lo onde quiser. Eu sempre coloco o código de acompanhamento no final da página e nunca tive problemas.

Casablanca
fonte
2
Por que você deseja detectar um usuário que carrega parcialmente sua página e sai em milissegundos?
João Pimentel Ferreira
@ JoãoPimentelFerreira porque é informação valiosa também, você pode querer medir o que% de pontos de vista era assim
jangorecki
3

Você pode colocá-lo em qualquer lugar que desejar na página e executá-lo em qualquer lugar na página, seja na cabeça ou no corpo. Mas, de acordo com o suporte do Google ( adicione o código de acompanhamento diretamente ao seu site ), é recomendável na tag head e cole-o imediatamente antes da </head>tag de fechamento .

Parágrafo seguinte de um bom artigo explicando por que colocar código na tag head

A visualização de página é registrada somente após o carregamento desse código. Portanto, quanto mais cedo você carregar o código, mais cedo a Visualização de página será gravada. Digamos que você tenha uma grande página de blog, e é de carregamento lento, demorando de 10 a 20 segundos para carregar tudo. Se o seu Código do Google não iniciar até o final da página, ele poderá ser mantido, assim como o código não-assíncrono antigo usado para armazenar OUTRAS linhas de código. Só que agora ele está segurando o código de rastreamento. Se um visitante do seu site acessa a página e a deixa antes que o código de rastreamento seja acionado na Visualização de página, você o perde. Agora eles se tornam uma nova visita direta a qualquer página do site em que aterrissem. Isso pode fazer com que todos os tipos de dados no seu site estejam incorretos.

Subodh Ghulaxe
fonte
0

Na cabeça, logo antes da tag </ head> de fechamento, você não terá problemas para verificar seu site nas Ferramentas do Google para webmasters.

Sezhers
fonte
0

Adicionar o código a seguir (conhecido como "snippet de rastreamento do JavaScript") aos modelos do seu site é a maneira mais fácil de começar a usar o analytics.js.

O código deve ser adicionado próximo à parte superior da tag e antes de qualquer outro script ou CSS, e a string 'UA-XXXXX-Y' deve ser substituída pelo ID da propriedade (também chamado de "ID de rastreamento") do Google Analytics propriedade que você deseja rastrear.

<!-- 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 -->
Expandir snippet

O código acima faz quatro coisas principais:

  1. Cria um elemento que inicia o download de forma assíncrona da biblioteca JavaScript analytics.js em https://www.google-analytics.com/analytics.js

  2. Inicializa uma função ga global (chamada fila de comandos ga ()) que permite agendar comandos para serem executados assim que a biblioteca analytics.js estiver carregada e pronta para ser usada.

  3. Adiciona um comando à fila de comandos ga () para criar um novo objeto rastreador para a propriedade especificada por meio do parâmetro 'UA-XXXXX-Y'.

  4. Adiciona outro comando à fila de comandos ga () para enviar uma visualização de página ao Google Analytics para a página atual.

Mile Mijatović
fonte
Vamos dar uma olhada mais de perto, porque chamá-lo de "fila de comandos" está dando muito crédito. O código uglificado compactado aceita alguns argumentos que ele usa para descompactar algumas coisas e adquirir um identificador para uma Array.pushfunção vinculada . A ga"função" é inteiramente esse limite push. Assim, as invocações imediatas podem ser otimizadas: em vez de construir um array vazio se não for encontrado ( []), preenchê-lo com os "argumentos" matrizes para cada gachamada: [['create', 'UA-XXX', 'auto'], ['send', 'pageview']]...
amcgregor
-3

O código que você deve sempre ser adicionado próximo à parte superior da tag e antes de qualquer outro script ou CSS, e a string 'UA-XXXXX-Y'deve ser substituída pela propriedade ID(também chamada de "ID de rastreamento") da propriedade do Google Analytics que você deseja rastrear.

Payal Daryani
fonte
2
Isso não responde à pergunta. A questão é perguntar quais são os efeitos colaterais de não fazer o que você diz.
6136 Peter Hall