그로스마케팅 파트너, 허들러스
4장 구글 애널리틱스 추적코드의 정체
안녕하세요. 그로스마케팅 파트너, 허들러스의 유성민 대표입니다. 허들러스는 데이터에 기반한 비즈니스 성장의 방법론은 연구하며 컨설팅을 진행해드리고 있습니다. 앞으로 브런치에 구글 애널리틱스의 관련된 글을 순차적으로 연재해나갈 예정입니다 :) 오늘은 그 연재의 네 번째 이야기를 진행해보도록 할게요.
구글 애널리틱스를 볼 줄 아는 사람은 있어도, 이 애널리틱스가 어떤 원리로 데이터를 가져오는지, 어떤 방식으로 우리 웹사이트를 추적하는지에 대해서 잘 알고 있는 사람은 없습니다. 하지만, 원리를 이해하면 기억에 오래 남습니다. 이번 장에서는 구글 애널리틱스의 추적코드를 살펴봅시다.
Google Analytics 계정 생성과 추적 코드
간단히 구글 애널리틱스의 계정부터 먼저 만들어봅시다. 구글 검색창에 한글로 “구글 애널리틱스"를 검색해봅시다. 그 전에, 구글 애널리틱스는 크롬 브라우저에서 가장 최적화되어있기 때문에, 크롬 브라우저로 인터넷에 접속해주세요. 추가로, 구글 상품이다보니, 구글 계정에 로그인이 된 상태로, 구글 애널리틱스를 검색해야 합니다.
구글 애널리틱스를 검색하면 가장 상단에 링크가 보입니다. 링크를 눌러주세요.
다음과 같은 창이 나타납니다. [무료로 계정 만들기]를 눌러봅시다. 앞서 1장에서 설명한 것처럼, 구글 계정 하나 당 구글 애널리틱스 계정을 총 100개까지 만들 수 있기 때문에, 걱정없이 만들어주세요.
계정 설정 - 측정 대상 - 속성 설정의 순서로 계정을 만들게 됩니다. 계정 이름은 여러분들이 편하게 알아볼 수 있는, 계정 이름을 정의해주세요. 저는 간단하게 허들러스라고 만들겠습니다.
나머지 사항은 무시하고 우선, [다음] 버튼을 눌러 2번인 측정 대상 영역으로 이동합니다.
이 영역은 “당신이 사용할 구글 애널리틱스는 어디서 추적할 것인가 ?” 를 물어보는 영역입니다. 앱은 높은 수준의 개발지식이 필요하여, 이번 강의에서는 다루지 않을 것이고, 우리는 웹 사이트에 구글 애널리틱스를 설치한다고 가정하고, [웹]을 클릭해줍니다. [다음] 버튼을 눌러주세요.
3번 영역에서는 하나씩 따라서 적어봅시다.
1) 웹사이트 이름 : 웹사이트 이름은 브랜드의 이름을 적어주는 영역입니다. 허들러스의 경우, 계정의 이름(비즈니스 이름) 과 브랜드명이 동일하기 때문에, 허들러스를 똑같이 적어줍니다. 하지만, 하나의 큰 사업체의 비즈니스 브랜드 또는 계열사가 여러개 있을 경우에는, 반드시 하위 단계인 브랜드 이름을 기준으로 적어주셔야 나중에 불편함이 없습니다. 물론, 우리가 지금 만드는 구글 애널리틱스 계정도 추후 삭제가 가능합니다.
2) 웹사이트 URL : 우리 웹사이트의 메인 페이지 URL을 적어주시면 됩니다. http와 보안 환경이 가능한 프로토콜을 지원하는 https 를 구분하여 적어주세요.
3) 업종 카테고리 : 이 부분은 여러분들의 웹사이트가 어느 업종에 소속되어 있는지를 표시해주는 구간입니다. 추후 우리 웹사이트가 구글 검색엔진에 노출될 때, 반영하는 부분이니 최대한 유사한 업종을 찾아서 선택해주세요.
4) 보고 시간대 : 보고 시간대는, 어느 국가를 선택하느냐에 따라서, 구글 애널리틱스의 리포트에 새로운 데이터가 업데이트 되는 시각이 달라집니다. [대한민국] 으로 하게 되면 불편함 없이 데이터를 볼 수 있으니, [대한민국]을 검색하여 넣어주세요.
최종 [만들기] 버튼을 누르면 아래와 같은 개인 정보 처리 GDPR 개인 정보 처리 방침 동의에 대한 내용이 팝업창으로 나타납니다. 체크 박스를 모두 체크해주시고, [동의함] 버튼을 눌러봅시다.
[완료] 라는 노란색의 창이 뜨면서, 다른 위치로 이동이 됩니다. 이제 계정 생성이 완료되었습니다. 저와 같은 화면이 나타나면 계정을 성공적으로 만들어내신 것입니다.
계정을 만드니, 속성열에 있는, [추적 코드] 쪽으로 이동이 되었습니다. 무언가 복잡해보이는 코드나, 안내 사항들이 나와있지요? 우리는 2가지만 알고 있으면 됩니다.
첫번째는 추적 ID 입니다. 이 추적 ID는 제가 만들 구글 애널리틱스 계정의 추적 ID와 여러분들이 만든 추적 ID가 모두 다를 것입니다. ID는 말 그대로 고유값이기 때문입니다. 이 추적 ID는 여러분들이 구글 애널리틱스를 고급 수준까지 다다르게 되면, 구글 에서 제공해주는 다양한 소프트웨어와 연동하여, 구글 애널리틱스 리포트를 좀 더 세밀하게 만들 수 있습니다. 우선은 넘어갑시다.
추적 ID 바로 아래 영역을 보시면, [범용 사이트 태그] 라는 항목과 함께 알 수 없는 영어로 된 코드가 나타납니다. 이 코드가 바로 우리 웹사이트에 직접 설치를 진행할 코드입니다. 이 코드가 어떤 것을 의미하는지는 알 필요가 없으나, 그냥 설치하면 된다는 식의 설명은 너무 무책임한 것 같아서, 개발 상식을 간단히 짚고 넘어 갑시다. 크롬 브라우저에서 지금 보고 계신 창은 그대로 남겨두시고, 새 창을 열어주세요. 그리고, 오른쪽 마우스를 누른 뒤에, [검사] 버튼을 눌러봅시다.
그렇게 되면 여러분들이 보시는 화면에서 오른쪽에 참으로 복잡한 컴퓨터 언어들이 나타납니다.
사실 이 복잡해 보이는 언어들은, 웹사이트를 구성하고 있는 언어입니다. 웹 문서를 구성하고 있는 언어는 크게 3가지가 있습니다.
사람에 빗대어 설명을 해볼까 합니다. 사람을 처음 만들기 위해서는 무엇을 만들어야 하나요 ? 바로, [뼈대] 입니다. 웹사이트도 마찬가지 입니다. 웹 사이트의 레이아웃, 뼈대를 만들기 위한 언어가 바로, [HTML] 입니다.
자 그러면 뼈대가 완성된 사람은 뭐가 필요할까요 ? 눈도 필요하고, 머리카락도 필요하고, 피부도 입혀주고, 옷도 입어야 겠군요. 웹사이트도 마찬가지 입니다. 텍스트의 크기를 지정해야하고, 글꼴, 지금 나타나느 화면의 멋진 배경 이미지도 보여주어야 합니다. [HTML] 이라는 뼈대가 완성되면, 그 레이아웃 위에 디자인을 관장하는 언어 [CSS] 가 있습니다. CSS는 웹사이트의 디자인적인 요소를 덧입히는 언어입니다. 자, 사람이 피부까지 모두 완성되었습니다.
그러면 사람을 만드는게 모두 완성되었을까요? 당연히 아닙니다. 사람에게 가장 중요한 것은 [뇌] 입니다. 우리가 뜨거움을 느끼는 것도, 아픔을 느끼는 것도, 무거움을 느끼는 것도 모두 [뇌]에서 명령어를 보내기 때문입니다. 웹사이트도 이런 뇌의 역할을 하는 언어가 있습니다. 웹사이트를 사용하는 사용자의 행동에 따라 명령어를 내려주는 언어를 우리는, [JavaScript] 라고 부릅니다. Javascript의 예를 한번 들어볼까요? 지금 화면에 있는 여러분 컴퓨터의 시간을 봐주세요. 예를들어 17:24라고 시간이 있다고 가정합시다. 60초 후에는 자동으로 분단위의 시간이 1이 추가되어 17:25로 바뀔 것입니다. 자동으로 명령어를 내려서 바꿔준 것이지요. 이게 자바스크립트의 예입니다.
그럼, 개발자 100명을 세워두고, 명령어를 1개씩 짜보라고 하면, 총 몇 개의 명령어가 나타날까요 ? 네, 100개입니다. 명령어는 주어진 언어로 정의하기 나름이기 때문입니다. 즉 정리하자면, 웹사이트는 총 3가지 언어로 구성되어 있습니다. 첫번째는 뼈대를 관장하는 HTML, 두번째는 완성된 레이아웃 위에 디자인을 입히는 CSS, 마지막으로 [뇌]의 역할을 관장하여, 정적인 웹사이트가 동적으로 움직일 수 있도록 명령을 내려주는 언어를 [JavaScript] 라고 합니다.
자, 다시 구글 애널리틱스 코드로 돌아옵니다. 이 구글 애널리틱스 코드는 HTML 일까요? CSS 일까요? JavaScript 일까요 ? 정답은, JavaScript 입니다. 이 명령어를 그대로 해석하자면, “우리 웹사이트에 특정 사용자가 방문하면, 그 사람의 데이터를 우리의 구글 애널리틱스 계정으로 쏴라!” 가 됩니다. 네, 여러분이 보고 계시는 이 구글애널리틱스 코드의 정체는 [JavaScript] 입니다. 그렇다면, 이 자바스크립트 코드인 구글 애널리틱스 추적코드는 어떻게 웹사이트에 삽입할 수 있을까요 ? 다음장에서는 애널리틱스 추적코드를 삽입하는 방법에 대해서 본격적으로 다뤄보겠습니다.