클릭맵

클릭 히트맵은 페이지에서 중요한 콘텐츠를 파악하는 데 도움을 줍니다. 또한 사용자가 링크로 착각하는 디자인 요소를 식별할 수도 있습니다.

Clarity는 모든 페이지 뷰에 걸쳐 절대 순위를 사용합니다. 때때로 페이지 인상이 사용자가 클릭한 요소를 보여주지 않을 수 있습니다.

클릭 히트맵으로 사용자가 링크가 아닌 곳을 포함하여 어디를 클릭하는지 파악할 수 있습니다. PC에서는 클릭을, 모바일/태블릿에서는 탭을 추적합니다.

클릭맵은 단일 페이지 또는 페이지 그룹에 대해 조회할 수 있습니다.

클릭맵의 종류

클릭맵

다양한 종류의 클릭맵을 사용할 수 있습니다:

전체 클릭(All clicks): 데드 클릭, 레이지 클릭, 첫 번째 클릭, 마지막 클릭을 포함한 모든 유형의 사용자 클릭을 보여줍니다.
데드 클릭(Dead clicks): 사용자가 클릭했으나 아무런 효과/반응이 없었던 위치를 보여줍니다. 데드 클릭에 대해 자세히 알아보세요.
레이지 클릭(Rage clicks): 사용자가 짧은 시간 내에 같은 작은 영역을 빠르게 반복 클릭한 위치를 보여줍니다. 레이지 클릭에 대해 자세히 알아보세요.
에러 클릭(Error clicks): JavaScript 에러 직전에 발생한 클릭을 보여줍니다. JavaScript 에러에 대해 자세히 알아보세요.
첫 번째 클릭(First clicks): 페이지에서의 최초 사용자 클릭을 보여줍니다. 사용자 온보딩 패턴을 파악하는 데 유용합니다.
마지막 클릭(Last clicks): 페이지에서의 마지막 사용자 클릭을 보여줍니다. 사용자 이동 패턴을 파악하는 데 유용합니다.

좌측 패널에는 클릭 수 기준으로 순위가 매겨진 요소가 표시됩니다. 클릭맵은 페이지에서 가장 많은 클릭을 받은 요소의 순위를 보여줍니다. 유형을 변경하면 그에 맞게 데이터가 업데이트됩니다.

아래로 스크롤하면 페이지 하단의 요소 순위도 확인할 수 있습니다. 클릭된 요소를 선택하면 클릭 수(클릭 비율 %)를 확인할 수 있습니다. 확장(>>)하여 보거나 축소(<<)하여 클릭 데이터를 닫을 수 있습니다.

클릭맵 좌측 패널

녹화 아이콘을 선택하거나 View recordings를 선택하여 녹화를 볼 수도 있습니다. 녹화 보기를 통해 해당 요소가 클릭된 녹화를 시청할 수 있습니다.

클릭된 요소 보기

이 버튼을 선택하면 적용된 필터를 나타내는 요소 뱃지가 표시됩니다. 뱃지 라벨에 대해 자세히 알아보세요.

해당 요소를 클릭한 녹화 보기

뱃지 라벨 제한 사항:

복사 아이콘을 선택하여 요소를 클립보드에 복사할 수 있습니다. 이렇게 하면 해당 요소의 CSS 선택자가 복사되어, UI에서 정확한 요소를 식별할 수 있습니다. 이를 활용하여 요소의 스타일을 변경할 수 있습니다.

클릭맵에서 요소를 클립보드에 복사

상단 패널에서 클릭맵 시각화를 맞춤 설정할 수 있습니다:

클릭맵 상단 패널

필터: 필터 개요를 참고하세요.
세그먼트: 세그먼트를 참고하세요.
기간 설정: 히트맵을 더 잘 보기 위해 기간을 편집할 수 있습니다. 오늘, 어제, 또는 사용자 지정 일수나 기간을 선택할 수 있습니다.
방문 URL: 정규식 매칭을 지원하는 자동 완성 검색바로, Clarity 프로젝트에 포함된 모든 웹사이트가 표시됩니다. 여러 경로 필터를 추가하여 페이지 그룹의 히트맵을 조회할 수 있습니다. 적용된 다른 필터도 여기에 표시됩니다. 필터를 세그먼트로 저장하거나 초기화할 수도 있습니다.
지원 디바이스: PC/태블릿/모바일 뷰를 선택하여 각 디바이스에서의 사용자 행동을 파악할 수 있습니다.
히트맵 유형: 스크롤맵, 영역맵, 어텐션맵, 전환맵으로 전환할 수 있습니다.
공유: 클릭맵을 다른 사람과 공유할 수 있습니다.
다운로드: 클릭맵을 CSV 또는 PNG로 다운로드할 수 있습니다.
비교: 두 개의 같은 또는 다른 히트맵을 비교할 수 있습니다.
스크린샷 변경: 다른 스크린샷을 선택하여 클릭맵을 조회할 수 있습니다.
히트맵 요약: 히트맵 요약으로 웹사이트 페이지의 사용자 행동과 트렌드를 쉽게 파악할 수 있습니다.

클릭맵 하단 패널

페이지 뷰 및 클릭 수: 적용된 필터에 대한 페이지(또는 페이지 그룹)의 총 페이지 뷰 수와 총 클릭 수입니다. 페이지 뷰는 히트맵당 최대 100,000건으로 제한됩니다.
색상 스케일: 섹션의 인기도가 높아질수록 색상이 따뜻해집니다. 색상이 따뜻할수록 클릭이 밀집되어 있다는 의미입니다.
히트맵 순위 표시: 토글로 히트맵의 순위를 켜거나 끌 수 있습니다.
불투명도: 열 표시가 텍스트나 이미지를 가릴 때 투명도를 조절하는 컨트롤입니다. 불투명도를 사용하여 붉은 영역의 열기를 빠르게 확인할 수 있습니다.

더 많은 답변은 히트맵 FAQ를 참고하세요.

번역: jh.lee@medibuilder.com with Claude Code