Google Analytics JS를 <head> 또는 <body> 끝에 넣어야합니까?

123

Google은 나에게 자바 스크립트를 제공하고 <head>.

마지막에 넣을 수 있습니까, <body>아니면 부작용이 발생할까요?

google-analytics

— 피터 홀
소스

3

닫는 </ body> 태그 앞에 넣으라고하지 않습니까? 아니면 이것이 바뀌 었습니까?

— Marko

155

<head>섹션 끝에 배치하면 사용자가 페이지로드를 완료하지 않은 경우에도 메트릭을 추적하는 데 도움이됩니다.

그들은 페이지의 부분 로딩을 처리하기위한 지원을 추가하기 전에 페이지 하단에 배치하라고 지시했습니다.

Google에서 직접 :

비동기 스 니펫의 주요 장점 중 하나는 HTML 문서의 맨 위에 배치 할 수 있다는 것입니다. 이렇게하면 사용자가 페이지를 떠나기 전에 추적 비콘이 전송 될 가능성이 높아집니다. <head>섹션에 JavaScript 코드를 배치하는 것이 일반적 이며 최상의 성능을 위해 섹션 하단에 스 니펫을 배치하는 것이 좋습니다.

Google Analytics 도움말 참조 : 사이트에 직접 추적 코드 추가

— 크리스 아르 긴
소스

8

그래서 바닥에 놓아도 괜찮을까요? 차라리 모든 것을 하단에 배치하고 (적절한 렌더링을 위해 상단에 CSS를 배치하여) 내 페이지를 빠르게로드합니다.

2

예, 그렇게해도 괜찮습니다. 나는 실제로 믹스를 가지고 있지만 언급 된 이유 때문에 대부분 그것을 맨 위에 올려 놓는 것으로 마이그레이션했습니다.

— Chris Arguin 2010

6

이것이 장점 인 이유는 무엇입니까? 그러한 사용자는 본질적으로 처음부터 실수를 저질렀다고 말하고 있기 때문에 부분 페이지로드를 계산하고 싶지 않은 것 같습니다. 그들이 거기에 있기를 원할지라도, 나는 그들이 내 콘텐츠를보기 위해 여분의 밀리 초를 기다리게 만들고 싶지 않습니다.

— Melinda Green

3

부분적인 페이지로드는 사이트 소유자에게 수정해야 할 사항을 의미 할 수도 있습니다. 누군가가 당신의 가게에 들어서고, 단지 외부가 그들을 오해하게 만들었다는 것을 깨닫는다 고 상상해보십시오. 이를 수정하기 위해 광고를 수정하고 싶을 것입니다.

— Optimus

2

이것에 대한 작은 업데이트 : <head>이제 링크 된 페이지에 "각 페이지의 여는 <head> 태그 바로 뒤에 태그 추가"

— Brandon

6

원하는 곳에 둘 수 있습니다. 나는 항상 페이지 끝에 추적 코드를 넣었고 아무런 문제가 없었습니다.

— 카사 블랑카
소스

2

페이지를 부분적으로로드하고 밀리 초 이내에 나가는 사용자를 감지하려는 이유는 무엇입니까?

— João Pimentel Ferreira

이 가치있는 정보도 있기 때문에 @ JoãoPimentelFerreira, 당신은 같았다 뷰 (%)을 측정 할 수 있습니다

— jangorecki

3

페이지에서 원하는 위치에 배치 할 수 있으며 머리 또는 본문에 관계없이 페이지의 어느 곳에서나 실행할 수 있습니다. 그러나 Google 지원에 따르면 ( 사이트에 직접 추적 코드 추가 ) 헤드 태그에 태그를 닫는 태그 바로 앞에 붙여 넣는 것이 좋습니다 .</head>

헤드 태그에 코드를 넣는 이유를 설명 하는 좋은 기사의 다음 단락

페이지 뷰는 해당 코드가로드 된 후에 만 기록됩니다. 따라서 코드를 빨리로드할수록 페이지 뷰가 더 빨리 기록됩니다. 큰 블로그 페이지가 있고로드 속도가 느리며 모든 것을로드하는 데 10 ~ 20 초가 걸린다고 가정 해 보겠습니다. Google 코드가 페이지 끝까지 시작되지 않으면 다른 코드 줄을 유지하는 데 사용 된 이전의 비동기 코드와 마찬가지로 중단 될 수 있습니다. 지금은 추적 코드를 유지하고 있습니다. 사이트 방문자가 페이지를 방문한 다음 추적 코드가 페이지 뷰를 실행하기 전에 페이지를 떠나면 해당 방문자를 잃게됩니다. 이제 그들은 그들이 방문한 사이트의 페이지에 대한 새로운 직접 방문이됩니다. 이로 인해 사이트의 모든 종류의 데이터가 부정확해질 수 있습니다.

— 수 보드 굴 락스
소스

0

머리에서 닫는 </ head> 태그 바로 앞에 있으면 웹 마스터 도구에서 웹 사이트를 확인하는 데 문제가 없습니다.

— Sezhers
소스

0

다음 코드 ( '자바 스크립트 추적 스 니펫'이라고 함)를 사이트 템플릿에 추가하는 것이 analytics.js를 사용하는 가장 쉬운 방법입니다.

코드는 태그 상단 근처에 다른 스크립트 또는 CSS 태그 앞에 추가해야하며 'UA-XXXXX-Y'문자열은 Google 애널리틱스의 속성 ID ( '추적 ID'라고도 함)로 대체해야합니다. 추적하려는 속성.

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

스 니펫 확장

위의 코드는 네 가지 주요 작업을 수행합니다.

https://www.google-analytics.com/analytics.js 에서 analytics.js 자바 스크립트 라이브러리를 비동기 적으로 다운로드하기 시작하는 요소를 만듭니다.
analytics.js 라이브러리가로드되고 사용할 준비가되면 실행되도록 명령을 예약 할 수있는 전역 ga 함수 (ga () 명령 대기열이라고 함)를 초기화합니다.
ga () 명령 대기열에 명령을 추가하여 'UA-XXXXX-Y'매개 변수를 통해 지정된 속성에 대한 새 추적기 객체를 만듭니다.
ga () 명령 대기열에 다른 명령을 추가하여 현재 페이지에 대한 페이지 뷰를 Google Analytics로 보냅니다.

— 마일 미야토비치
소스

좀 더 자세히 살펴 보겠습니다. "명령 대기열"이라고 부르는 것은 너무 많은 신용을 제공하기 때문입니다. 압축되지 않은 코드는 몇 가지를 풀고 바인딩 된 Array.push함수에 대한 핸들을 얻는 데 사용하는 몇 가지 인수를받습니다 . ga"기능은"결합 전적으로이다 push. 따라서 즉시 호출을 최적화 할 수 있습니다. 찾을 수없는 경우 빈 배열 ( []) 을 구성하는 대신 각 ga호출 에 대해 "인수"배열로 채 웁니다 . [['create', 'UA-XXX', 'auto'], ['send', 'pageview']]…

— amcgregor

-3

코드는 항상 태그 상단 근처와 다른 스크립트 또는 CSS 태그 앞에 추가 'UA-XXXXX-Y'해야하며 문자열 은 ID추적하려는 Google 애널리틱스 속성 의 속성 ( '추적 ID'라고도 함) 으로 대체해야합니다 .

— 파얄 다리 야니
소스

2

이것은 질문에 대한 답이 아닙니다. 질문은 당신이 말한대로 하지 않는 것의 부작용이 무엇인지 묻는 것 입니다.

— Peter Hall