Universal Analytics (UA) will be deprecated on July 1, 2023, which means it will stop processing data. Analytics 360 properties will stop working on October 1, 2023. Migrate to Google Analytics 4.

사이트에 analytics.js 추가

컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.

analytics.js 라이브러리('Google 애널리틱스 태그'라고도 함)는 사용자가 웹사이트와 상호작용하는 방식을 측정하기 위한 자바스크립트 라이브러리입니다. 이 문서에서는 Google 애널리틱스 태그를 사이트에 추가하는 방법을 설명합니다.

Google 애널리틱스 태그

Google 애널리틱스 태그는 <head> 태그 위에 가까이 있는 다른 스크립트나 CSS 태그 앞에 추가해야 하고 사용할 Google 애널리틱스 속성의 속성 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 -->

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

  1. https://www.google-analytics.com/analytics.js에서 analytics.js 자바스크립트 라이브러리를 비동기식으로 다운로드하는 <script> 요소를 만듭니다.
  2. analytics.js 라이브러리가 로드되고 사용할 준비가 되면 실행할 명령어를 예약할 수 있는 전역 ga 함수(ga() 명령어 큐를 호출함)를 초기화합니다.
  3. ga() 명령어 큐에 명령어를 추가하여 'GA_MEASUREMENT_ID' 매개변수를 통해 지정된 속성의 새 추적기 객체를 만듭니다.
  4. ga() 명령어 큐에 다른 명령어를 추가하여 현재 페이지의 페이지 조회를 Google 애널리틱스로 전송합니다.

맞춤 구현에서는 Google 애널리틱스 태그의 마지막 두 줄(createsend 명령어)을 수정하거나 더 많은 상호작용을 캡처하기 위한 코드를 추가해야 할 수도 있습니다. 하지만 analytics.js 라이브러리를 로드하거나 ga() 명령어 큐 함수를 초기화하는 코드를 변경해서는 안 됩니다.

대체 비동기 태그

위에서 설명한 Google 애널리틱스 태그를 사용하면 스크립트가 모든 브라우저에서 비동기식으로 로드되고 실행되지만 최신 브라우저에서 스크립트를 미리 로드할 수 없다는 단점이 있습니다.

아래의 대체 비동기 태그는 미리 로드 기능을 지원하므로 최신 브라우저에서 성능이 조금 향상되지만, async 스크립트 속성을 인식하지 못하는 IE 9 이전 버전의 모바일 브라우저에서는 동기식 로드와 실행으로 성능이 저하될 수 있습니다. 방문자가 주로 최신 브라우저를 사용하여 사이트에 액세스하는 경우에만 이 태그 구성을 사용하세요.

<!-- Google Analytics -->
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->

Google 애널리틱스 태그는 어떤 데이터를 캡처하나요?

이 태그 중 하나를 웹사이트에 추가하면 사용자가 방문하는 페이지별로 페이지 조회가 전송됩니다. Google 애널리틱스에서 이 데이터를 처리하고 다음과 같이 많은 정보를 추론할 수 있습니다.

  • 사용자가 사이트에서 보내는 총 시간
  • 사용자가 각 페이지에서 보내는 시간 및 페이지를 방문한 순서
  • 클릭된 내부 링크(다음 페이지 조회의 URL 기반)

또한 새로운 추적기 객체를 만들 때 analytics.js가 수행하는 IP 주소, 사용자 에이전트 문자열, 초기 페이지 검사는 다음과 같은 사항을 결정하는 데 사용됩니다.

  • 사용자의 지리적 위치
  • 사용 중인 브라우저 및 운영체제
  • 화면 크기 및 Flash 또는 자바가 설치되었는지 여부
  • 참조 사이트

다음 단계

기본적인 보고는 Google 애널리틱스 태그를 통해 수집한 데이터로도 충분하지만 대부분의 경우 사용자에 대한 답변을 얻고 싶은 추가 질문이 있습니다.

이 사이트의 가이드에서는 analytics.js로 중요한 상호작용을 측정하는 방법을 설명하지만 특정 기능을 구현하기 전에 왼쪽 탐색 메뉴의 기본 섹션에 표시된 가이드를 읽어보는 것이 좋습니다. 이 가이드에서는 analytics.js 라이브러리를 개략적으로 설명하고 사이트 전체에서 사용되는 코드 예를 더 확실하게 이해할 수 있습니다.

이 시리즈의 다음 가이드에서는 analytics.js의 작동 방식을 설명합니다.