[Network탭 활용법] 태깅(Tagging), 제대로 삽입된 게 맞나요?


[태깅(Tagging),  제대로 삽입된 게 맞나요?]

여러분의 웹 사이트에 방문한 사람들이 어떻게 행동하는지를 데이터로 수집하여 활용할 수 있는 세상이 되었습니다.

흔히 Data-Driven Marketing의 시대라고도 부르지요.

그 배경에는 구글 애널리틱스(Google Analytics)와 같은 다양한 매체를 통한 데이터 수집이 가능해졌기 때문입니다.

그렇다면 데이터 수집은 어떤 원리로 이루어지는 것일까요? 해당 궁금증을 풀기위해 Tagging에 대해 잠시 짚고 넘어 가도록 하겠습니다.


1. Tagging 이란?

대부분의 매체들은 데이터 수집을 위한 JavaScript 기반의 코드를 제공하는데 이를 태그(Tag)라고 부르며, 요건에 맞춰 삽입하는 작업을 태깅(Tagging)이라 부릅니다.

개발 지식을 보유한 마케터라면 구글 태그 매니저(Google Tag Manager)를 활용하여 직접 태깅을 진행할 수도 있지만, 대부분의 경우 개발자에게 요청할 수밖에 없습니다.

개발 측에서 의도한 바를 정확하게 이해하고 태깅 작업을 완료해준다면 베스트지만 그렇지 않은 경우도 종종 발생합니다. 여러분이라면 태깅이 정상적으로 완료되었는지 어떻게 확인하실 건가요? 아마 대부분의 마케터 분들은 아래 2가지 방법을 활용하시리라 예상됩니다.

1) 특정 버튼을 눌러보고 매체에 데이터가 들어오는 것을 확인한다.
2) 확장 도구를 활용한다. (Google Tag Assistant, Facebook Pixel Helper 등)

이러한 방법들이 잘못된 것은 아니지만 정확한 확인을 위해서는 조금 부족한 면이 있습니다. 이 부족함을 해결하기 위한 해답은 Network Tab 기능에 있습니다.
Network Tab 기능을 통해 어떻게 해결가능한지 지금부터 상세히 다뤄보도록 하겠습니다.  (구글 크롬 기반으로 작성되었으니 참고 부탁드립니다.)

 

2. Network Tab 소개

Network Tab은 대부분의 브라우저에 탑재되어 있는 개발자 도구의 한 기능으로 웹 사이트에서 발생하는 모든 동작(=HTTP 통신)을 확인할 수 있는 영역입니다.
우선 개발자 도구를 열기위한 방법을 알아보도록 하겠습니다.  대표적으로 아래 3가지와 같습니다.

[Chrome 개발자 도구를 열기위한  3가지 방법]
1) Chrome 메뉴에서 도구 더보기 > 개발자 도구 선택
2) 페이지 요소를 우 클릭하고 검사를 선택
3) 단축키
– Window : F12, Ctrl + Shift + I
– Mac : Cmd + Opt + I

이 블로그를 보고 있는 지금! 개발자 도구를 한번 열어보세요.

아래와 같이 브라우저에서 새로운 화면이 보여지는 것을 확인할 수 있습니다.
(상단 Tab 영역에 Network가 있으니 해당 Tab을 클릭해주세요.)

T-1(new)

[히스토리 정보 확인하기]
Network Tab에서는 웹 페이지가 로드되는 과정에서 발생한 히스토리 정보를 보여줍니다. 먼저 항목 별 의미에 대해 하나씩 알아보도록 하겠습니다.

  • Name : 동작의 이름
  • Status : 상태 코드 (200 : 정상)
  • Time : 로드되는데 걸린 시간
  • Headers : 하나의 동작이 담고 있는 정보 (Name 클릭 시 노출)

예를 들어, 제일 먼저 ‘www.artience.co.kr‘라는 이름의 동작이 일어났고, 정상적으로 완료(200)된 것을 확인할 수 있습니다. 그리고 클릭 시, 해당 동작이 담고 있는 Headers 정보 확인이 가능합니다.

T-5

혹시 이쯤 되면 감이 오시나요? 태깅 작업을 진행하게 되면 각각의 작업 내역들이 하나의 동작으로 Network Tab에 기록됩니다. 그리고 각 동작들의 Headers 정보는 매체에 전송되는 데이터입니다.

저희는 특정 매체와 관련된 동작의 이름을 검색하여, Headers의 정보를 확인한다면 태깅이 정상적으로 이루어 졌는지 확인할 수 있습니다. Google Analytics와 Facebook 예시를 통해 직접 확인해보도록 하겠습니다.

 

3. 매체 별 예시

[Google Analytics]
GA에는 페이지 방문 시 수집되는 Pageview 데이터와 특정 사용자 행동을 수집하는 Event 데이터가 존재합니다. 그리고, Network Tab에서 GA와 관련된 동작은 ‘collect’ 키워드로 검색이 가능합니다.

1) Pageview
필터 기능을 활용하여 collect를 검색해보면 t=pageview라고 하는 동작들이 보이네요. (페이지 환경에 따라 무수히 많은 GA 동작들이 검색될 수 있습니다.) 클릭하여 Headers 정보를 살펴보면 약 20가지 정보들이 담겨져 있는 것을 확인할 수 있습니다.

주요 파라미터들은 다음과 같습니다. (상세 내용은 링크를 참고해주세요)

  • t : GA Hit Type
  • dl : 페이지 URL
  • dt : 페이지 Title
  • cid : GA client ID
  • tid : GA Property

T-62) Event
Event는 사용자 행동을 정의하기 위한 추가 정보들이 확인됩니다.

  • ec : Event Category (필수)
  • ea : Event Action (필수)
  • el : Event Label (선택)
  • ev : Event Value (선택)

Label과 Value는 없을 경우 GA에 (not set)으로 들어갑니다.

T-7[Facebook]
이번에는 Facebook Pixel 데이터에 대해 살펴보도록 하겠습니다. Facebook은 Pixel 이름으로 데이터가 구분되며, 맞춤 변수를 통해 세부 정보들을 함께 전송할 수 있습니다.

이번 예시에서는 Pixel과 맞춤 변수를 함께 살펴보겠습니다. 크롬 확장 도구인 Facebook Pixel Helper 화면과 서로 비교하여 확인하시기 바랍니다.

예시)
– Pixel 이름 : artience_blog
– 맞춤 변수 : blog_category = network

이렇게 보내진 Facebook 동작은 ‘?id’ 키워드로 검색이 가능하며, 주요 파라미터는 다음과 같습니다.

– id : Facebook Pixel ID
– ev : Event Value (Pixel 이름)
– cd[blog_category] : 맞춤 변수로 설정된 blog_category의 value

Tips) 맞춤 변수는 하나의 데이터에 다양한 정보들을 함께 보낼 수 있기 때문에 많이 사용되는 방법입니다. 대부분의 매체에서 지원하는 기능이니 활용하시는 것을 추천드립니다.

T-9


4. 마치며

Network탭을 활용하면 설명 드린 매체 외에도 Campaign Manager(Floodlight),
The Trade Desk(Universal/Static Tag) 등 웹 페이지에 설치된 모든 매체들을 확인할 수 있습니다.

Garbage in, Garbage out 이라는 말도 있듯이, Data-Driven Marketing의 첫 걸음은 정확한 데이터 수집입니다. 지금 바로 여러분의 웹 페이지에서 Network Tab을 통해 데이터를 확인해보시는 것은 어떨까요?

여러분의 Data-Driven Marketing을 응원합니다. 아티언스 데이터 이노베이션 팀 JC 였습니다.

관련하여 문의사항이 있으시다면 댓글로 부탁드리겠습니다.
감사합니다.

 

 

Google Analytics – “Direct” traffic 이해하기

이용자들의 온라인 매체 이용율이 증가함에 따라, SEO, SNS, SEM, Display Ads와 같은 온라인 마케팅 또한 주요 마케팅 활동으로 자리잡고 있습니다. 이러한 온라인 마케팅은 이용자 행동에 대한 다양한 데이터 수집을 통해 보다 객관적인 마케팅 효과 측정과 다양한 인사이트 도출이 가능합니다.
많은 온라인 마케터들이 사이트 방문자들의 행동 데이터 수집을 위해 사용하는 Google Analytics, AceCounter 등의 로그 분석툴은 각기 다양한 Dimension으로의 데이터를 제공하고 있으며, 그 중 방문 경로(Traffic Source)별 데이터는 마케팅 활동별 효과 측정과 사이트 방문수 변화 원인 파악 등에 주로 활용됩니다.

그런데 방문 경로별 데이터를 추출하다 보면 (Google Analytics의 Direct Traffic 등) 명확히 정의되지 않은 경로에 대한 데이터들이 종종 확인되곤 합니다. 또한 사이트에 따라 이러한 데이터들이 적지 않은 비중을 차지하는 경우도 있으며, 이 경우 보다 정확한 분석이 어려울 수 있습니다.

 

direct traffic 1
위 화면은 한 사이트의 Channel별 데이터입니다. ‘Direct’의 Traffic이 전체의 17% 가량을 차지하고 있으며, 신규 방문율, 이탈율, 평균 페이지뷰, 평균 체류 시간 모두 타 Channel 대비 높은 실적을 보이고 있습니다. 방문 후 실적으로 미루어 사이트에 대한 충성도가 높은 이용자들인 것으로 볼 수 있으나, 이들이 어떤 경로를 통해 방문했는지는 알기가 어렵습니다.

이번 블로그에서는, 이렇게 방문경로가 확실히 정의되지 않는 데이터들이 왜 발생하는지, 이를 개선하기 위해서는 어떻게 해야할지 알아보도록 하겠습니다. 로그 분석툴에 따라 Dimension에 대한 정의가 조금씩 차이가 있으며, 본 블로그에서는 Google Analytics를 기준으로 작성한 점 참고 부탁 드립니다.

 

1. Direct Traffic 이란 무엇인가?

direct traffic 2

위 화면은 Google Analytics의 Default Channel Grouping channel 정의에 대한 도움말입니다. 1) Source가 ‘direct’ 이거나, 2) Medium(매체)가 ‘not set’ 이거나, 3) Medium(매체)가 ‘none’ 일 경우 Direct로 분류한다고 안내하고 있습니다. 다시 말하면, 별도의 ‘Referrer’ 정보가 확인되지 않는 방문에 대해 Direct Traffic으로 분류합니다.

 

2. 어떤 경우 Direct Traffic으로 분류되는가?

Google Analytics에서 Traffic의 ‘Referrer’ 정보를 확보하지 못하는 경우는, 크게 1) 원래 ‘referrer’가 없는 경우와 2) ‘referrer’ 정보가 유실된 경우 두가지로 구분할 수 있습니다. 브라우저에 URL을 직접 입력하거나 즐겨찾기를 통해 접속할 경우 전자에 해당되고, 기술적 한계 및 권한 제한 등의 사유로 Google이 ‘referrer’ 정보를 획득할 수 없는 경우 후자에 해당됩니다.
‘referrer’ 정보 유실이 발생되어 Direct Traffic으로 분류될 가능성이 있는 방문 형태는 크게 다음과 같습니다.

1) E-mail 링크를 통한 방문
2) MS Office or PDF 문서 링크를 통한 방문
3) Shortened URL(단축URL)을 통한 방문
4) 페이스북/트위터 등과 같은 Mobile Social App을 통한 방문
5) Internet Explore(일부 구버전)의 javascript/flash 링크를 통한 방문
6) Secoure(https) site에서 Non-secure(http) site로의 방문
7) 302 redirect
8) 사이트 내 GA script가 누락된 페이지에서 GA script가 삽입된 페이지로의 이동
9) 브라우저 버전/설정에 따라 Referrer 정보를 제공하지 않는 경우

 

3. Direct Traffic을 줄일 수 없는가?

‘어떤 방문인지 모르는’ Direct Traffic의 비중이 줄게 되면 보다 정확한 방문 경로별 데이터 추출이 가능하게 됩니다. URL 입력을 통한 방문 등 referrer 정보가 원래 없는 Traffic은 별도의 개선안이 없으나, referrer 정보를 확인하지 못해 Direct로 분류되는 Traffic은 연결 URL 내 referrer 정보 삽입을 통해 Direct Traffic으로 분류되는 것을 방지할 수 있습니다.

예를 들어 E-mail 내 사이트로의 링크 URL이 ‘http://www.test.com’ 인 경우, Google Analytics가 E-mail을 통한 방문임을 알 수 있도록 URL 뒤에 다음과 같은 parameter를 추가합니다.

http://www.test.com?utm_source=newsletter&utm_medium=e-mail&utm_campaign=2015-dec-newsletter

E-mail 내 parameter가 추가된 링크URL을 이용자가 클릭할 경우, Google Analytics는 ‘e-mail’ medium, ‘newsletter’ source, ‘2015-dec-newsletter’ campaign의 referrer 정보를 가진 Traffic임을 인식하여 분류하게 됩니다(보다 자세한 내용은 Google URL Builder 참고).

URL Builder를 활용한 해결책은 referrer가 유실되는 다양한 경우 중 일부에만 해당되며, referrer가 유실되는 원인에 따라 각기 다른 대응안을 적용해야 할 것입니다.

 

2014년 7월 Groupon에서 Direct Traffic과 Organic Traffic 간의 상관관계에 대한 실험 결과를 발표한 적(Searchengineland – Experiment Shows Up To 60% Of “Direct” Traffic Is Actually Organic Search)이 있었습니다. 약 6시간 동안 Google Webmaster Tool에서 Goupon 각 페이지의 de-index를 통해 검색 결과에 노출이 되지 않도록 하였었는데, 해당 시간동안 Organic Traffic이 0에 가까웠으며, 동시에 Direct Traffic이 60% 정도 감소했었다고 합니다. 이는 Groupon 사이트 Direct Traffic의 약 60% 정도가 사실은 Organic Traffic이었다는 것으로도 볼 수 있으며, 다시 말하면 Google Analytics에서 보여지는 Organic Traffic이 모든 Organic Traffic은 아닐 수도 있습니다.

정리하면, (URL 입력을 통한 방문 이외에도) 다양한 Traffic이 Direct로 분류되고 있으며 이렇게 불분명한 Traffic이 많을수록 측정과 분석이 어려울 수 있습니다. 따라서 보다 정확한 측정과 평가를 위해서는 지속적인 원인 파악 및 대응을 통한 Direct Traffic 비중 축소가 필요할 것입니다.

구글 어널리틱스를 이용한 광고를 통한 웹페이지 방문자 데이터 수집 방법

요즘 인터넷 사용자들은 복잡한 단계를 걸쳐 검색을 진행하기 때문에 광고 세팅부터 우리의 타겟 고객의 요구사항을 만족시키기는 어렵습니다. 따라서 초기 광고 세팅 후 방문자의 행동패턴(U.X) 분석을 통해 키워드 별 성과 및 사이트 내 경로를 확인하여, 사이트 리뉴얼, 키워드에 대한 비딩 전략 및 랜딩페이지 변경 등에 이용한다면 더욱 효과적으로 광고를 운영할 수 있습니다.

구글 어널리틱스(GA)를 활용하면 웹 페이지 방문자들이 사이트 내에서 어떠한 활동을 하였는지 확인할 수 있습니다.

GA에서는 간단한 설정을 통하여 Paid, Organic, Referral, Direct 등 모든 소스의 데이터를 수집 및 확인할 수 있습니다만, 오늘은 광고를 통한 데이터 수집 방법에 대해 알아보도록 하겠습니다.

 

GA는 무료로 제공되며, 확인할 수 있는 웹 페이지 내 사용자 행동은 매우 많습니다.

간단하게는 웹 페이지를 방문한 횟수, 페이지 뷰, 신규 방문자수부터 페이지 및 사이트 체류시간, 이탈률, Next Page, End Page 등 여러가지 항목들을 확인할 수 있으니, 광고를 진행하는 입장에서 방문자들의 행동패턴을 파악하기 위해서는 GA와 같은 분석툴은 필수적인 사항이라고 할 수 있겠습니다.

 

1. 추적 코드 삽입 방법

일단 GA를 통해 데이터를 모으기 위해서는 Traffic을 얻고자 하는 웹 사이트의 모든 페이지에 추적코드를 심어야 합니다.

1) GA계정으로 로그인하여 관리(admin)탭으로 이동합니다.

2) Property 내에 있는 Tracking Info 하단의 Tracking Code를 클릭하여 해당 태그 전체를 추적하려는 모든 웹 페이지에 붙여 넣습니다.

 

태그를 삽입하였다면 웹 페이지를 방문한 사람들의 정보가 GA에 기록되게 됩니다.

tracking-code

2. utm Code 삽입을 통한 데이터 분류

이 데이터들 중 내가 운영한 광고를 통해 들어온 방문자들의 데이터를 더욱 세분화 하여 확인하기 위해서는 광고의 Landing Page URL에 utm Code라고 하는 GA에서 데이터를 판단할 수 있는 코드를 삽입해 주어야 합니다.

 

Utm Code 항목은 아래와 같이 5가지가 있습니다.

 

캠페인 소스(utm_source)

필수. 검색 엔진, 뉴스레터 이름 또는 기타 소스를 식별하려면 utm_source를 사용하세요.
: utm_source=google

캠페인 매체(utm_medium)

필수. 이메일 또는 클릭당비용과 같은 매체를 식별하려면 utm_medium을 사용하세요.
: utm_medium=cpc

캠페인 용어(utm_term)

유료 검색에 사용됩니다. 광고의 키워드를 확인하려면 utm_term을 사용하세요.
: utm_term=running+shoes

캠페인 콘텐츠(utm_content)

A/B 테스트 및 콘텐츠 타겟팅 광고에 사용됩니다. utm_content를 사용하여 동일한 URL을 가리키는 광고 또는 링크를 구분할 수 있습니다.
: utm_content=logolink 또는 utm_content=textlink

캠페인 이름(utm_campaign)

키워드 분석에 사용합니다.utm_campaign을 사용하여 특정 제품 프로모션 또는 전략적 캠페인을 식별합니다.
: utm_campaign=spring_sale

 

예를 들어 “mouse”라는 키워드의 랜딩페이지에 utm Code를 삽입할 때

Example.com?utm_source=Google&utm_medium=cpc&utm_term=mouse&utm_content=accessory&utm_campaign=computer 와 같이 설정 하시면

해당 광고를 통해 들어온 데이터는 GA에서 판단할 때 Google, CPC 광고를 통해 들어왔고, Computer Campaign- Accesosory ad group – Mouse 라는 키워드를 통해 발생한 데이터로 기록되며, 이는 차후 데이터를 활용 할 때 Source, Medium, Campaign, Ad Content, Keyword 이라는 각각의 Metrics별로 데이터를 확인할 수 있습니다.

 

3. 구글 애드워즈 Auto-Tagging 활용

구글 애드워즈를 사용하여 광고를 진행 할 경우에는 Auto Tagging 설정만 해주게 되면 위와 같이 긴 랜딩페이지를 설정해줄 필요 없이 자동적으로 Tracking Code가 삽입되게 됩니다.

auto-tagging111

1) 애드워즈 계정에 로그인하여 우측 상단에 톱니바퀴 모양을 클릭한 뒤 Account Setting으로 들어갑니다.

 

2) Preferences Tab에 있는 Tracking 항목의 Auto-tagging 값을 Yes로 설정을 하면 Destination URL에 자동적으로 Tracking Code가 삽입이 됩니다.

 

auto-tagging21

마무리

지금까지 알아본 것과 같이 간단한 설정들을 통해 광고로 발생한 데이터를 세분화 하여 수집 및 이를 분석하여 현재 광고 혹은 사이트 내의 문제점을 파악할 수 있으며, 해당 문제되는 사항들을 최적화하여 광고의 효용성을 높일 수도 있습니다.

이를 잘 활용해 보시길 바라겠습니다.