우리 상세페이지, 잘 만든 걸까? 무료로 확인하는 방법

이런 분들이 보면 좋아요!

✅ 상세페이지를 새로 만들었거나 리뉴얼했는데, 잘 된 건지 확신이 없는 분
✅ 광고 클릭은 들어오는데 구매·문의로 잘 이어지지 않는 분
✅ 상세페이지를 고쳐야 하는데, 어디부터 고칠지 근거가 필요한 분
✅ 비싼 분석 툴 없이, 고객이 페이지에서 어떻게 움직이는지 보고 싶은 분

상세페이지는 대충 만들지 않습니다.

누구에게 팔지 정하고, 어떤 순서로 설득할지 짜고, 브랜드의 스토리를 담습니다.

나름의 전략과 논리가 다 들어가 있죠.

그런데 막상 오픈하고 나면 이런 질문이 남습니다.

"우리 상세페이지, 고객한테도 통하고 있을까?"

방문자 수, 체류 시간, 이탈률은 볼 수 있습니다.
하지만 이 숫자들은 고객이 페이지 안에서 어디까지 읽었고, 어디를 눌렀고, 어디서 멈췄는지는 알려주지 않습니다.

상세페이지를 개선할 때는 핵심 메시지가 있는 구간까지 고객이 도달하는지,
구매·문의 버튼에 반응하는지 함께 확인해야 합니다.

고객이 상세페이지를 어떻게 보는지, 무료로 확인하는 도구

바로 Microsoft Clarity(마이크로소프트 클래리티)입니다.

마이크로소프트가 제공하는 웹사이트 행동 분석 도구입니다.

이런 히트맵·녹화 도구는 대부분 유료인데,
Clarity는 유료 요금제 자체가 없이 가입만 하면 방문자 수 제한 없이 무료로 쓸 수 있다는게 강점이에요!

이 도구로 확인할 수 있는 건 크게 세 가지입니다.

① 고객이 어디까지 관심 있게 보는지 (스크롤 히트맵)
② 고객이 어디를 많이 누르는지 (클릭 히트맵)
③ 고객이 어디서 클릭을 놓치고 있는지 (헛클릭, Dead click)

이걸 알면 우리 상세페이지가 어디서 새고 있는지, 핵심 메시지를 어디에 둬야 하는지가 보입니다.

화면: Microsoft Clarity 공식 데모 프로젝트

시작하는 방법

⚠️ 먼저 내 사이트에 외부 추적 코드를 설치할 수 있는지 확인하세요.
스마트스토어·오픈마켓처럼 판매자가 코드를 추가할 수 없는 페이지에는 바로 적용하기 어렵습니다. 직접 관리하지 않는 사이트라면 제작사나 운영 담당자에게 설치 가능 여부를 물어보세요.

1. clarity.microsoft.com에 접속해서 마이크로소프트 또는 구글 계정으로 로그인합니다.
   

2. 새 프로젝트를 만들고, 프로젝트 이름과 내 사이트 주소를 입력합니다.
   

3. 설치 방법을 고릅니다.
   · 쇼피파이·윅스·워드프레스 같은 플랫폼이라면 "타사 플랫폼에 설치"
   · 그 외 사이트라면 "수동으로 설치"에서 추적 코드를 복사해 사이트의 <head> 영역에 붙여넣기
   · 구글 태그 매니저를 쓰고 있다면 태그로 추가하는 방법도 있습니다
   

4. 코드를 저장·게시한 뒤, 직접 사이트에 들어가 스크롤하고 몇 군데 눌러보세요. Clarity에 그 방문이 기록되면 설치 완료입니다. 계속 비어 있다면 코드를 넣은 위치와 게시 여부부터 점검하세요.

⚠️ 설치 방법은 한 가지만 쓰세요!
코드를 직접 넣고 태그 매니저로도 또 넣으면, 같은 방문이 두 번 기록될 수 있습니다.

설치 직후에는 화면이 비어 있는 게 정상입니다.
방문이 어느 정도 쌓인 뒤에 봐야 데이터의 정확도가 올라갑니다.

① 고객은 어디까지 관심 있게 볼까 < 스크롤 히트맵 >

어디서 보나요?
하단 메뉴 [열 지도] → 확인할 페이지 선택 → 상단 [스크롤]

어떻게 읽나요?
빨간색일수록 많은 사람이 도달한 구간, 파란색일수록 거의 내려오지 않은 구간입니다.
왼쪽 표에서 페이지 깊이별로 방문자의 몇 %가 도달했는지 숫자로도 볼 수 있습니다.

이렇게 활용하세요
혜택, 가격, 후기, 구매해야 하는 이유처럼 가장 중요한 메시지가 있는 구간이 몇 %에 도달하는지 확인하세요. 도달률이 낮은 구간에 핵심 메시지가 있다면, 그 메시지를 위로 올리거나 첫 화면에 요약을 먼저 보여주는 걸 검토해볼 수 있습니다.

화면: Microsoft Clarity 공식 데모 프로젝트

아무리 좋은 설득 문장도, 고객이 그 위치까지 내려오지 않으면 전달되지 않습니다.

② 고객은 어디를 많이 누를까 < 클릭 히트맵 >

어디서 보나요?
[열 지도] → 상단 [클릭] 드롭다운 → [모든 클릭]

어떻게 읽나요?
클릭이 많이 몰린 곳일수록 붉게 표시됩니다.
왼쪽 목록에는 클릭이 많은 요소가 순위대로 나옵니다.

이렇게 활용하세요
우리가 누르길 바란 버튼(구매·문의)에 클릭이 모이는지, 아니면 다른 곳으로 흩어지는지 보세요.
의도하지 않은 요소에 클릭이 몰린다면 고객이 그 정보를 더 궁금해한다는 신호일 수 있습니다.
그 정보를 보강하거나, 그 근처에 구매 버튼을 두는 걸 검토해보세요.

화면: Microsoft Clarity 공식 데모 프로젝트

③ 고객은 어디서 클릭을 놓칠까 < 헛클릭 >

헛클릭이란?
영문 명칭은 Dead Click으로 의미없는 클릭을 의미합니다.
링크나 버튼 기능이 연결되어 있지 않은 곳을 고객이 누른 기록이에요.
눌렀는데 아무 일도 일어나지 않은 클릭이죠.
고객은 "눌리겠지" 하고 눌렀는데, 페이지는 아무 반응도 하지 않은 겁니다.

어디서 보나요?
[열 지도] → 상단 [클릭] 드롭다운 → [중지된 클릭]

헛클릭이 몰린 곳에서 알 수 있는 것

• 눌릴 것처럼 보이는 요소가 있다
  버튼처럼 생긴 이미지, 밑줄·색이 들어간 텍스트, 아이콘처럼 보이는 그래픽을 고객이 버튼으로 착각한 경우입니다.
  

• 고객이 그 내용을 더 보고 싶어 한다
  상품 사진을 크게 보려고, 옵션·가격·후기를 더 보려고 누르는 경우가 많습니다.
  다만 숫자만으로는 확신할 수 없으니, 레코딩으로 실제 흐름을 몇 개 확인해보세요.
  

• 연결돼 있어야 할 링크가 끊겼다
  원래 버튼인데 헛클릭이 몰린다면, 작동 오류일 가능성이 큽니다.

화면: Microsoft Clarity 공식 데모 프로젝트

이렇게 활용하세요

1. 헛클릭 화면 왼쪽 목록에서 헛클릭이 많은 요소 순위부터 확인합니다.

2. 상품 사진에 몰린다면 → 사진을 눌렀을 때 크게 보이게 하거나, 상세컷을 더 넣어보세요.

3. 텍스트·아이콘에 몰린다면 → 그 정보로 이동하는 링크를 연결하거나, 버튼처럼 보이지 않게 디자인을 바꿔보세요.

4. 원래 버튼인 곳에 몰린다면 → 버튼이 제대로 작동하는지부터 점검하세요.

5. 헛클릭이 몰리는 곳은 고객의 손이 가는 곳입니다. 그 근처에 구매·문의 버튼을 두면 놓치던 클릭을 살릴 수 있습니다.

같은 자리를 짧은 시간에 여러 번 누르는 "빠른 클릭(Rage click)"도 함께 보세요.
고객이 답답해하고 있다는 신호일 수 있습니다. 대시보드에서 비율을 바로 볼 수 있습니다.

한 명씩 보고 싶다면 — 레코딩

하단 메뉴 [레코딩]에서는 방문자 한 명 한 명이 페이지를 어떻게 스크롤하고 눌렀는지 영상처럼 다시 볼 수 있습니다.

히트맵으로 이상한 구간을 찾았다면, 그 페이지의 레코딩을 몇 개 열어 실제로 어떤 흐름이었는지 확인해보세요. 히트맵이 여러 방문의 "패턴"을 보여준다면, 레코딩은 한 번의 방문에서 스크롤과 클릭이 이어진 "흐름"을 보여줍니다.

저장해두고 쓰는 상세페이지 점검표

보기 전에 알아둘 점

• 데이터 양이 적을 때는 조심하세요.
  방문이 적으면 몇 명의 행동이 전체처럼 보일 수 있습니다.
  수정 전후를 비교할 때는 기기와 광고 유입 조건이 비슷한 기간끼리 비교하고, 구매·문의 전환도 함께 확인하세요.
  

• 모바일과 PC는 따로 보세요.
  히트맵 상단의 기기 아이콘으로 나눠 볼 수 있고, 같은 페이지라도 보는 방식이 꽤 다릅니다.
  

• 이 도구는 "어디서"는 알려주지만 "왜"는 알려주지 않습니다.
  헛클릭이 많다고 곧바로 구매를 포기했다는 뜻은 아닙니다.
  보이는 행동을 단서로 가설을 세우고, 고쳐본 뒤 다시 비교하는 과정이 필요합니다.

상세페이지는 고객이 본 순서로 다시 봐야 합니다

전략과 스토리로 만든 상세페이지라도, 고객이 그 순서대로 보고 있는지는 따로 확인해야 합니다.

정리하면, 이 도구로 이런 걸 알 수 있습니다.

• 스크롤 히트맵 → 고객이 어디까지 관심 있게 보는지 → 핵심 메시지를 어디에 둘지

• 클릭 히트맵 → 고객이 어디를 많이 누르는지 → 구매·문의 버튼을 어디에 둘지

• 헛클릭 → 연결되지 않은 곳을 누르는지 → 어디서 클릭을 놓치고 있는지

• 레코딩 → 한 번의 방문이 어떻게 흘러갔는지 → 히트맵에서 찾은 구간의 실제 모습

상세페이지는 만든 사람의 논리가 아니라, 고객이 실제로 본 순서로 다시 점검해야 합니다.

그리고 여기까지, 전부 무료로 확인할 수 있어요!

이 정보가 상세페이지 성과를 올리는 데 작은 도움이 되길 바랍니다.