고정 헤더 영역
상세 컨텐츠
본문
안녕하세요 오늘은
웹,모바일 기획 / UX 실험에 도움이 되는 도구인
HOTJAR에 대해서 소개해보려고 합니다.
가장 기본인 히트맵 생성과
레코드를 다운로드 받는 방법 등을
공유하고자 합니다.
여러분도 아시다시피 HOTJAR는
기본적으로 무료로 제공되고 있습니다.
무료버전을 사용하셔도 크게 문제는 없으나
요금제를 높일 수록 편리하긴합니다
역시 돈이 좋죠 ㅎㅎㅎ ;;;;
Hotjar | Behavior Analytics Made Easy | Website Heatmaps & More
See how visitors are really using your website, collect user feedback and turn more visitors into customers.
www.hotjar.com
우선 사이트에 접속하셔서 Try it free를
클릭하셔서 회원가입을 하세요
회원가입을 하시고 sign in을 하시면
HOTJAR 사용법이 팝업으로 뜹니다.
자세히 보시면 도움이 되지만
대부분 skip 하실 것 같습니다.
도움말을 닫고 나면 대시보드 화면에
아래와 같은 트랙킹코드를 보여줍니다.
녹색으로 눈에 띄는
copy to clipboard 버튼을 클릭하시면
자동으로 트랙킹코드가 복사됩니다.
복사된 트랙킹코드는
사이트의 모든 페이지 <head>영역에
복.붙 해주시면 됩니다.
물론, 구글 태그관리자를 통해서
태그를 추가해서 이용하시는 것도 가능합니다.
상단 이미지 아래에 제가 가려놓았지만
Site ID: 라고 표시된 부분이 있지용~
저 ID를 이용해서 구글 태그관리자를 통해
HOTJAR 태그를 추가 하시면
간편하게 핫짜 트랙킹 코드를
페이지 마다 심으실 수 있습니다.
구글 태그관리자를 통해서 트랙킹 코드를 심으신 경우
핫짜 유료 버전에서 제공하는
Javascript snippet 트리거 기능을 이용하실 때에는
태그 관리자에서 ID로 태그를 추가하는 방식이 아닌
맞춤 HTML 유형으로 핫짜 태그를 추가하셔야 합니다.
이 부분은 HOTJAR 도움말 영역에 자세하게
안내되어 있으니 참고하시면 좋겠습니다.
∇
https://help.hotjar.com/hc/en-us/articles/115011624487-Using-JavaScript-Triggers-for-Feedback-Tools
트랙킹 코드를 심으신 후에는
코드가 잘 심어졌는지 체크해 보셔야 합니다.
Verify Installation 버튼을 클릭하시면
확인해 보실수 있습니다.
코드가 잘 심어지면
상단 이미지와 같은 팝업이 사이트 상단에 뜹니다.
이제 히트맵을 생성해 보겠습니다.
왼쪽 메뉴에서 Heatmaps 메뉴를 선택합니다.
초록색 + New Heatmap 버튼을 클릭합니다
히트맵의 이름을 적어주세요.
저는 보통 히트맵 이름을 적을 때
기기유형_PAGE이름_생성날짜
요렇게 적습니다~
이제 히트맵으로 쌓일
페이지 뷰 수를 선택하시면 되는데
기본 무료는 1000 뷰까지 밖에 선택이 안되고요
저희는 plus를 사용하고 있어서
2000뷰까지 히트맵을 생성해줍니다.
비지니스 요금제 사용하시면
10000뷰 까지 히트맵을 생성해줍니다.
plus 와 비즈니스 요금제의 좋은 점은
이것도 있지만 히트맵 생성을
무한정으로 하실 수 있어여~
기본 요금제는 겨우 세개 히트맵만 생성가능해서
3개 생성 후에 더 쌓고 싶으시면
삭제하시고 다시 생성하셔야 합니다.
좀 귀찮기도 하고.. 여튼 돈이 좋아요;;;
이제 히트맵을 생성하고자 하는 페이지의
URL을 입력해주시면 됩니다.
어떤 페이지의 히트맵을 쌓고자 하는지에 따라
URL입력 방식이 조금 달라집니다.
어찌되었건,
Hotjar는 매우 친절합니다.
전부 안내를 해주고 있어용~
URL을 구성하는 요소들을 설명해주고 있네요
URL은 위의 방식들로 입력할 수 있습니다.
저는 simple match를 주로 이용합니다.
위에서 잠깐 설명드렸듯이
JavaScript 방식을 이용하시기 위해서는
<head>마다 트랙킹코드를 넣으시거나
구글 태그매니저에서 맞춤html 방식을
사용해서 트랙킹 코드를 심으셔야 합니다.
이제 마지막으로 생성버튼만 눌러주세요
생성된 히트맵은 몇 분(?) 정도 뒤에
히트맵을 볼 수 있게 View Heatmap 버튼이
활성화됩니다.
버튼이 활성화 된 후
View Heatmap 버튼을 누르면
히트맵 캡쳐 이미지를 확인할 수 있습니다.
히트맵은 이미지로 다운로드가 가능하구요
CSV 파일로도 다운로드가 가능합니다
csv파일로 다운로드 받으시면
CSS selector 단위로 몇 번의
클릭이 있었는지 자세하게 보실수 있어요
요게 매우 유용하더라구요 저는 ㅎㅎㅎ
오늘은 내용이 좀 많았네요~
유용하게 사용할 수 있는 좋은 무료 툴이라
열정적으로 포스팅해 보았습니다.
Hotjar와는 전혀 연관성이 없는 사람이지만
나름 기획적으로 인사이트를 발휘하고
A/B 테스팅 등을 해보기에도 좋은 것 같아요
그럼 오늘은 여기까지~
안녕~~~ !!
'#마케팅 | 데이터' 카테고리의 다른 글
| [책 추천] 그로스해킹 - 라이언 홀리데이 (0) | 2020.03.30 |
|---|---|
| [GA]이 달의 목표달성치 설정하기( 계산된측정항목 설정, 맞춤대시보드 만들기 ) (0) | 2020.02.29 |
| [Books] 트렌드코리아 2020 , 핵심요약/응용 (0) | 2020.02.04 |
| 1인 가구 소비자 ㅡ 마음 사로잡기 (0) | 2019.12.18 |
