Click/Tap 히트맵

Click/Tap 히트맵이란? Click/Tap 히트맵은 사용자들이 웹 페이지의 어떤 요소에서 얼마나 많이 클릭하거나 탭하는지를 시각화하여 보여주는 도구입니다. 이를 통해 사용자의 행동 패턴과 관심 영역을 파악할 수 있습니다. 히트맵 조회하기Reporting Heatmaps > [Click/Tap] 을 클릭하면 클릭/탭 이벤트에 대한 히트맵 및 데이터를 확인할 수 있습니다. 리포트의 좌측: 히트맵 영역캡처 화면의 링크/버튼에 대한 클릭/탭 데이터무효클릭/탭(링크/버튼이 아닌 영역에 대한 클릭/탭)리포트의 우측: 지표 영역요소별 클릭 순위 통계 및 상세 지표통계 및 분석 정보는 각 히트맵 별로 상위 10위 까지의 데이터를 보여줍니다. Click/Tap 통계 이해하기 Click/Tap Count페이지 내에서 클릭/탭이 발생한 컨텐츠 정보를 순위별로 나타냅니다.클릭/탭 통계는 링크 및 버튼 요소만 집계하여 분석합니다. Unique Click/Tap (순클릭/탭) 순 클릭/탭이 발생한 컨텐츠 정보를 순위별로 나타냅니다. 클릭/탭 통계는 링크 및 버튼 요소만 집계하여 분석합니다.Note Click/Tap Count와 다른 점은? 중복 클릭/탭을 제외한 순 클릭/탭으로서, 실제 클릭을 일으킨 방문 PV 순위를 보여준다는 데에 있습니다. Click/Tap Count Rank링크나 버튼 같은 클리커블 요소의 순위를 확인할 수 있습니다. 상위 10개 콘텐츠를 기본으로 제공하며, '더보기'버튼을 통해 이벤트가 발생한 모든 컨텐츠에 대한 정보를 확인할 수 있습니다. Click/Tap 지표 이해하기 Click/Tap Rate - 전체 클릭 횟수 대비 Click/Tap Count 비율 - 해당 페이지에서 발생한 전체 클릭/탭 이벤트 중, 해당 컨텐츠의 클릭/탭이 차지하는 비중을 이해할 수 있습니다. Scroll to Click/Tap - 스크롤이 도달한 PV 대비 클릭/탭 한 PV 비율 - 컨텐츠가 화면에 노출된 사용자에 한하여 해당 컨텐츠가 선택된 비율을 나타냅니다. 특정 위치에 있는 컨텐츠의 스크롤 도달률은, 해당 컨텐츠의 성질이 아닌 다른 UI의 구성에 의하여 영향을 받게 됩니다. 따라서 다른 위치에 노출된 사용자 규모를 기반으로 컨텐츠 별 클릭 성과를 비교해 볼 수 있습니다. Note Scroll to Click/Tap 이해하기 - Scroll to Click/Tap이 높은 컨텐츠는, 사용자에게 노출되었을 때 클릭률이 높은 요소입니다. - 반대로 Scroll to Click/Tap 비율이 낮은 컨텐츠는, 사용자에게 노출되었을 때 클릭률이 낮은 요소입니다. Click/Tap PV Rate - 전체 PV 중, 클릭한 PV 비율 = Unique Click/Tap = 순 클릭/탭 - 해당 컨텐츠를 클릭/탭한 실제의 PV 규모를 확인할 수 있습니다. Click/Tap PV Rate는 중복된 클릭/탭을 제외하고 집계됩니다. 중복된 클릭/탭이 제외되기 때문에, 전체 PV 중에서 실제로 클릭/탭한 PV와 클릭/탭하지 않은 PV의 규모를 각각 정확히 파악하는데 참고할 수 있습니다. Note Click/Tap PV Rate 활용하기 - 중복된 클릭/탭을 제외하는 이유는, 순 클릭/탭을 집계하기 위해서 입니다. 순 클릭/탭의 수치를 배경으로 한 분석과 통계치는 1 PV가 동일한 컨텐츠를 한 번 또는 여러 번 클릭/탭하더라도, 해당 컨텐츠를 클릭/탭한 PV에 끼치는 영향은 1로 동일하다는 전제하에 집계됩니다. - 페이지가 전환되지 않아 반복적으로 클릭이 가능한 컨텐츠를 클릭/탭한 실제 PV 규모를 확인할 수 있습니다. Hover → Click Time - 마우스 Hover 후 Click 되기 까지의 평균 시간 - 마우스가 Hover로 접근 후 Click 하기 까지의 시간차를 뜻합니다. 사용자들이 마우스로 Hover 함으로써 컨텐츠를 눈으로 확인하고, 선택을 결정하기 까지의 시간 차이를 의미할 수 있습니다. Hover to Click - Hover 한 Count 대비, Click Count 비율 - 해당 컨텐츠에 마우스로 접근한 횟수 대비, 클릭으로 연결된 비율을 의미합니다. - 사용자가 해당 컨텐츠에 마우스로 접근하여 관심을 보이고 확인한 정도에 비하여, 실제 관심과 목적에 의한 선택의 비중이 얼마나 되는지 확인할 수 있습니다. Dbl. Tap Rate - Double Tap Count / All Double Tap Count(%) - 더블 탭 이벤트가 발생한 분포 중, 해당 컨텐츠에 대한 비중을 확인할 수 있습니다. 히스토리(그래프) - 조회 기간 동안, 해당 요소의 Click/Tap 추이 - 조회 기간에 따른 해당 요소/컨텐츠 별 카운트의 변화를 Line 그래프로 보여줍니다.

벤치마크 데이터 확인하기

벤치마크 데이터란? 뷰저블 서비스에 누적된 웹사이트 데이터를 기반으로 뷰저블 AI가 8가지 산업군으로 분류하여 추출한 업계별 평균 데이터입니다. *뷰저블 AI가 분류하는 8가지 산업군 제공되는 업계 평균 데이터 벤치마크 데이터에는 1세션당 페이지수, 평균 체류시간, 전환, 이탈, 롤백, 새로고침 등의 업계 평균 데이터가 제공됩니다.*아래 이미지 예시를 참고해주세요! 1. 1세션당 페이지수 *1세션당 페이지 수는 무엇인가요?1세션은 웹 사이트에 접속한 이후 복수의 페이지를 둘러보며 취한 행동을 말합니다.즉, 1세션당 페이지 수는 사용자가 한 세션 동안 방문한 페이지의 숫자를 의미하며, 이를 통해 사용자가 웹사이트에서 얼마나 많은 페이지를 탐색했는지 알 수 있습니다. 2. 평균 체류 시간 3. 전환 4. 이탈 5. 롤백 6. 새로고침 벤치마크 데이터 확인하는 방법 벤치마크 데이터는 뷰저블 Journey Map에서 제공되는 데이터로, Journey Map 랭킹(Ranking) 리포트와 트렌드(Trend) 리포트에서 확인하실 수 있습니다. 1. 랭킹 (Ranking) 리포트 저니맵 대시보드에서 Ranking 리포트를 클릭해주세요. 랭킹리포트의 상단에서 벤치마크 데이터를 바로 확인할 수 있습니다. 2. 트렌드 (Trend) 리포트 저니맵 대시보드에서 Trend 리포트를 클릭해주세요. 트렌드 리포트에서 각 시퀀스별 이탈을 업계 평균 데이터와 비교할 수 있습니다.*시퀀스는 무엇인가요?시퀀스는 사용자가 웹사이트를 탐색하는 동안 거치는 일련의 페이지나 이벤트를 의미합니다. 이를 통해 사용자의 행동 패턴을 분석하고, 특정 경로를 따라가는 사용자의 경험을 시각화할 수 있습니다. ▼벤치마크 데이터를 바로 확인해보고 싶다면!▼

Live Heatmap(라이브 히트맵)의 Exposure Rate(노출도) 수집 기준

데이터 수집 기준 라이브 히트맵은 조회 당일(오늘) CTA Selector 기준으로 데이터를 표시합니다. 해당 요소의 위치나 id값 등이 변경되었다면 조회 기간별 데이터가 상이하게 보일 수 있습니다. 라이브 히트맵에서 Exposure를 잡는 기준 (1) 표준태그를 감싸고 있는 패딩 요소가 기준으로 노출되는 부분을 체크합니다. 해당 패딩 요소의 정중앙을 다른 표준태그의 패딩 요소가 가리지 않아야만 노출이 되었다고 인식(조건 A)(2) 페이지 방문자 (1PV) 발생 → 페이지 스크롤링 → (조건A)컨텐츠가 랜더링되어 노출 → Exposure로 잡힙니다.

Live Heatmap 이미지 다운로드

Live Heatmap의 타임캡슐 기능으로 현재 보여지는 Live Heatmap의 화면을 pdf로 다운로드 받으실 수 있습니다. ⓘ 로그인 필요 페이지의 경우 캡처 서버가 접근할 수 없어 로그인 화면이 캡처되거나 로딩지연되면서 다운로드가 불가한 점 참고해 주세요. <다운로드 방법>1. 네비게이션 바 우측에 '다운로드 버튼(타임캡슐)'을 클릭해 주세요. 2. 그리고 분석 기간을 선택하신 후 'PDF 다운로드' 버튼을 클릭해 주세요. 3. 해당 기간으로 캡처가 진행되며, PDF로 다운로드하여 조회가 가능합니다.

Live Heatmap이 실행되지 않습니다. 케이스별 해결 방법을 알려주세요.

1. 라이브 히트맵 실행 시 기능 네비게이션 바가 뜨지 않고 웹페이지만 구동되는 경우(1) 코드 설치 유무를 확인해 주세요. (2) 스크립트 차단 여부를 확인해 주세요 (URL 뒤에 붙는 뷰저블리 파라미터가 제거되었는지 확인)ⓘ Live Heatmap 실행 시 페이지 내 설치된 뷰저블 코드가 인식할 수 있도록 파라미터를 전달하는데, 해당 페이지가 파라미터를 붙여서 접속하면 강제로 없애버리도록 구현된 경우일 수 있습니다. - Live Heatmap(뷰저블리)을 오픈한 브라우저에서 개발자도구 > [Console] > Errors 리스트 중에서 Refused 된 beusably 찾기: beusable_viewer, beusable_navigation_off, beusably_lang, beusably_token (3) 랜딩 url과 등록 url이 일치하는지 확인해 주세요.접속시 등록 url 뒤에 붙은 파라미터가 제거되는지접속 시 실제 이동되는 url이 변경되는지순서대로 접근해야하는 페이지인지 -> 랜딩페이지가 '결제수단'인 경우 : 장바구니>배송지>결제수단로그인 이후 가능한 페이지인지 -> 로그인 후 라이브 히트맵 접속 2. 라이브히트맵 실행 시 리다이렉트 반복, 오류 얼럿 뜨는 경우등록한 URL에서 예외 적용되지 않은 파라미터가 추가 발생 시 오류 처리하도록 개발되었을 가능성이 있습니다. -> 해당 URL에 Live Heatmap 관련 파라미터가 추가되어도 오류 처리되지 않도록 차단 해제 후 다시 실행 부탁드립니다. <뷰저블의 라이브히트맵 파라미터>beusable_viewer (알파벳/숫자 조합)beusable_navigation_off (알파벳)beusably_lang (알파벳)beusably_token (알파벳/숫자/기호조합) 3. 502 Bad gateway Error 뜨는 경우 보안망 이슈로 인한 문제일 수 있습니다. -> 사내 프록시에 *.beusably.net 도메인 등록 요청을 부탁드립니다. 4. 사이트 구조 상 URL 직접 입력 시 페이지 데이터 조회되지 않는 경우ⓘ Live Heatmap은 등록된 URL로 바로 접속하여 히트맵을 표현하기 때문에 URL 직접 접근 시 페이지를 바로 띄울 수 없는 구조라면 Live Heatmap에서도 데이터 표현이 어렵습니다. <케이스 예시> 새 창 팝업 형태로 페이지를 띄울 때, 사이트에서 팝업에 필요한 데이터를 조회해서 넘기는 형태일 때한 번이라도 해당 팝업 페이지에 진입한 이력이 있다면 데이터를 불러오지만, 이력 없다면 빈 페이지 노출시키게 됩니다. -> 해당 페이지에 진입한 이후 > 라이브히트맵 실행 > 라이브히트맵 파라미터 부분 복사(beusable_viewer 부터~) > 해당 페이지 URL 뒤에 복사한 파라미터를 붙여넣어 주세요. 5. 모바일 라이브히트맵에서 데스크탑 URL로 리다이렉트 되는 경우데스크탑 URL이 모바일 URL로 리다이렉트 되어, 모바일 라이브 히트맵으로 접속하였을 때 모바일이 아닌 데스크탑 UI가 보이게 되는 현상입니다. -> 에이전트를 모바일로 변경하여 라이브히트맵에 재 접속하신 후 모바일 라이브히트맵이 정상 구동되는지 확인해 주세요. 6. 보안 이슈로 뷰저블리 차단된 경우 (1) 라이브 히트맵 실행 시 파라미터도 삭제되지 않으나 실행되지 않는 현상이 발생합니다. 개발자도구 → Console 에서 beusably 검색하여 차단여부 확인 → 차단해지 필요 (2) 콘솔창에서 CSP 차단이슈로 아이프레임 실행이 차단되었는지 확인 - 라이브히트맵 실행 → 개발자도구 → Console에서 다음과 같은 메시지 여부를 확인 Content-Security-Policy: frame-ancestors 'none';*개발자 도구 이미지 X-Frame-Options 'deny';*개발자 도구 이미지-> 아이프레임 차단으로 라이브 히트맵 실행불가 현상발생 중으로, 등록된 페이지 도메인의 차단을 해지하여 아이프레임 사용 허용 필요. 7. 라이브 히트맵 실행 시 브라우저에서 '권한이 없습니다' 라고 팝업 발생하는 경우(1) 크롬에 설치된 확장 프로그램과의 충돌 가능성 -> 크롬의 확장 프로그램을 사용 정지하거나 삭제 부탁드립니다. (2) 브라우저 보안 업데이트(3rd파티쿠키 지원 중단)로 인한 뷰저블 쿠키값 관련 이슈 (2020.03.24) ⓘ 조치 방법 <Chrome 브라우저>해결 1. 크롬에서 외부 쿠키에 대해 사용 불가한 옵션 풀기(1) 크롬에서 chrome://flags/#same-site-by-default-cookies 접속(2) [SameSite by default cookies] 항목을 [Disabled]로 변경(3) [Relaunch] 실행 해결 2. 크롬에서 타사 쿠키 차단 해제하기(1) 크롬에서 chrome://settings/content/cookies 접속 (크롬 설정 → 개인정보 및 보안 → 사이트 설정 → 쿠키 및 사이트 데이터 메뉴)(2) [타사 쿠키 차단] 토글 [비활성화] 하기 <Safari 브라우저>해결. 사파리에서 모든 쿠키 차단 해제하기(1) Safari 환경설정(2) 개인정보 보호(3) [모든 쿠키 차단] 해제하기

A/B 테스팅 가능 범위 문의

A/B 테스팅을 진행해보려고 하는데, 뷰저블 방식에 대해서 몇가지 문의드려요.1. 히트맵 기능 관련 문의 전체 페이지를 대상으로 테스트하는것이 아닌 일부 요소 (ex 버튼, 배너) 를 AB 테스트 하는경우에도 히트맵 기능이 유용하게 쓰일수 있을지 문의드립니다2. 하나의 페이지에 시점을 다르게 설정한 AB 테스트가 가능할까요? 예) 하나의 페이지에 1~15일 까지 A타입 UI를 적용, 16~30일 까지 B타입 UI를 적용하여 비교 분석 3. AB 테스트 조건값을 설정/변경한 뒤 수집된 데이터는 몇시간 뒤에 확인 가능한가요?4. 테스트 가능 범위는 UI 변경사항 모두 테스트 가능하다고 보면 될까요?5. 다변수실험(MVT) 가능여부 상호 배타 실험 가능 여부 (ex) A 테스트를 보는 사용자에게는 B가 노출되지 않도록 설정이 가능할까요?

GA에서의 PV와 히트맵에서의 PV가 다른 이유

안녕하세요. 현재 GTM에 뷰저블 태그를 입력하여 무료 기간으로 사용중입니다.향후 실제 적용시 비용 등을 확인하기 위해 GA와 뷰저블 히트맵의 PV를 체크하는데 너무 많은 수가 차이가 나고 있습니다.혹시 이 부분 어떤 이유인지 알 수 있을까요? 아래 스크린샷은 동일 기간, 동일 페이지에 대한 PV입니다.

GNB 개편 성과 분석 리포트, 다들 어떻게 쓰세요?

안녕하세요, 저는 이커머스 서비스를 운영하고 있는 서비스기획자입니다.저희 제품 카테고리가 좀 변경/추가되면서 GNB를 좀 개편하게 되었는데요.얼마전 GNB 개편 전/후레이아웃 성과를 분석하라는 과제를 진행하게되어 저희가 이용 중인 뷰저블을 활용해서 분석 및 리포트를 작성해보려고 합니다.리포트 작성은 처음이라서, 혹시 요런 내용의 분석리포트를 작성해 보신 경험이 있으신 분께 분석팁을 좀 얻고 싶어서요~!일단 제가 좀 살펴본 바로는 아래 히트맵을 통해서 세 지표를 중심으로 GNB 메뉴별로 분석해보는 것인데요.- Click 히트맵 : Click PV Rate, 노출대비 클릭률(Scroll to click)- Scroll, Exposure 히트맵 : 도달률/노출률좀 하다보니 이게 어떤 기준으로 클릭률이 높다/낮다를 판단할 수 있는지 좀 애매한 부분도 있어서ㅠㅠ 어떻게 구분해서 분석하시는지 좀 궁금해요.꿀팁 좀 부탁드립니다.ㅠㅠ

모바일 히트맵이 필요한데 iOS, AOS 모두 지원하나여?

뷰저블 이제 사용하려고 검토 중이라 질문이 많네요 ㅎㅎ 저희가 모바일 히트맵이 필요한데 뷰저블에서 iOS, AOS 모두 지원하는게 맞죠~?

SPA로 제작된 웹사이트에서는 뷰저블을 어떻게 이용해야될까요?

SPA(single page application)로 제작된 웹사이트를 운영하고 있습니다. 뷰저블 코드가 로드되어야 페이지 단위로 인식이 가능하다고 해서, URL이 변경되든 안되든 SPA의 각 화면들을 분리해서 리포트로 등록하지 못한다고 하네요, 대신 도메인을 Start match 로 등록해서 라이브히트맵 분석을 이용하라는 안내를 받았습니다. 일단 등록은 했는데,, 어떻게 하면 뷰저블로 SPA 웹사이트 분석을 잘 할 수 있을까요?

UX Case Study [2] : 분석 목적에 따라 히트맵 / 주요 지표 활용하기

안녕하세요, 뷰저블 UX Reseacher입니다. 지난 포스트( https://forum.beusable.net/ko/post/456 )에서는 웹페이지 UX 분석을 위한 첫 단계로 '페이지 등록 절차' 대해 다뤘다면,오늘은 분석 목적에 따라 활용할 수 있는 다양한 기능들과 지표 활용 방법에 대해 설명해 보려고 해요. 일반 가이드에는 없는, UX Researcher만의 해석 꿀팁들이 담겨있으니 주목해 주세요! :) 1. PC/Mobile : Click/Tap Heatmap 유효클릭/탭 : 사용자의 전환율 파악 가능무효클릭/탭 : 사용자의 pain-point 파악 가능무효 클릭이란, 링크가 아닌 곳에 클릭이 발생한 경우를 말함 [Desktop] Click Heatmap ☻ 분석 팁!분석에 활용되는 주요 유효 클릭 지표와 해석 방법지표정의분석 TipClick(Tap) RateClicks/페이지 내 전체 clicks(%): 전체 페이지 내 클릭(탭) 비중전체 관심 중, 해당 콘텐츠에 대한 비중으로 해석Click/(Tap) PV Rate(%)Click PV(Unique Click)/전체 PV(%): 해당 콘텐츠를 클릭한 PV의 규모 도달률/노출률 대비 Click PV Rate를 확인하면, 실제 해당 콘텐츠의 전환 성과로 볼 수 있음 Hover to Click RateClicks / Hover (%): 관심을 가진 사람 중 클릭으로 이어진 비중 낮다면? 왜 관심으로 이어지지 않았을지 검토 필요높다면? 고객의 니즈에 부합한 콘텐츠로 해석 Hover to Click time Hover한 사람이 클릭까지 걸린 시간 짧다면? 결정까지 어려움이 없었다고 해석길다면? 사용자가 망설였거나, 이해하지 못했을 가능성Scroll to Click/Tap(%)특정 콘텐츠/영역에 도달한 사용자 대비 해당 요소를 클릭한 사용자의 비율 사용자 도달 대비 전환 효율Double tap rate전체 더블 클릭 대비 해당 요소에 발생한 더블 클릭 비중100%라면? 해당 요소에만 더블 클릭이 발생했다고 해석로딩 속도가 느리진 않은지 클릭이 원활하게 이뤄졌는지 점검 필요 2. PC : Move Heatmap - 사용자들의 관심도 파악 가능[Desktop] Move Heatmap Move 히트맵을 Click/Scroll 히트맵 지표들과 교차 분석하면 인사이트를 쉽게 얻을 수 있어요! 클릭 vs 호버호버 > 클릭 : 관심이 많으나 전환으로 이어지지 않은 콘텐츠호버 < 클릭 : 관심이 적으나 많은 전환으로 이어진 콘텐츠클릭 = 호버 : 관심도 많고 전환도 높은 콘텐츠 [Desktop] Click vs Move Top 10 요소 비교 도달 vs 호버사용자 도달률이 낮은데 높은 관심의 콘텐츠 확인사용자 도달률이 높은데 낮은 관심의 콘텐츠 확인 3. PC/Mobile: Scroll Heatmap (1) 히트맵 색상 컨텐츠 영역까지 얼마나 많은 사용자가 도달했는지 파악 가능주요 컨텐츠까지의 도달률이 너무 낮다면, 위치 조정 등을 통해 우선 스크롤 노출률/도달률 자체를 높이는 방안 검토 필요 (2) Attention Graph (도달률X체류시간)구간별로 얼마나 숙독/주목했는지(체류시간) 파악 가능캐러셀이나 자동 애니매이션처럼 컨텐츠가 많은 구간인데 오히려 주목도가 낮아지거나 비슷하다면, 컨텐츠 개수나 영상 길이를 줄이는 방안 검토 필요 신규/재방문, 유입경로별 주목도를 비교해보면 각 그룹별 관심도 차이를 확인할 수 있음페이지 내 상대적인 주목도를 표현한 것이기 때문에, 다른 두 그룹의 체류시간을 비교할 땐 각각의 구체적인 수치를 계산하여 비교가 필요함 [Desktop] Scroll Heatmap내 주목도 그래프 > 주목도가 낮아지는 구간 (3) 페이지 효율 Average Fold를 기준으로 상/하단 영역의 클릭/호버수 비교를 통해 페이지 효율을 파악만약 페이지 하단의 길이가 더 짧은데 클릭/호버 인터랙션이 더 많다면, 하단의 효율이 더 좋다고 판단할 수 있음 페이지 효율을 확인할 수 있는 지표 (4) 스크롤 중단율사용자가 어느 구간에서 가장 많이 중단하는지, 이탈률이 가장 높은 콘텐츠 구간을 구체적인 픽셀로 확인이 가능함구간별 막대 길이(도달률)의 차이가 클 수록 중단율이 큰 구간으로 해석할 수 있음스크롤 중단율이 가장 높은 구간을 확인할 수 있음 4. Mobile: Zoom/Swipe Heatmap (1) Zoom 어떤 컨텐츠/영역에서 더 자세히 또는 확대해 보고싶은 니즈가 있었는지 파악 가능이커머스 사이트에서 특정 상품 상세 이미지에 Zoom in 인터랙션이 발생했다면 추가 이미지 제공이 필요하진 않을지 검토 필요 (2) Swipe 어떤 컨텐츠/영역에서 여러번 스와이프가 일어났는지 파악 가능상/하 스와이프: 화살표가 수가 많다면 해당 영역을 여러번 재탐색 했다고 해석할 수 있음 좌/우 스와이프 : 스와이프가 일어날 곳이 아닌데 발생했다면? 착각을 주고 있진 않은지 UI 점검 필요 5. Path Plot 사용자 그룹별 탐색 과정, 경로를 비교할 수 있음 평균 사용자 그룹: 평균적인 활동 범위를 가진 그룹FANs 사용자 그룹 : 적극적으로 페이지(서비스)를 탐색한 그룹상위 25%의 높은 활동률을 보이는 그룹으로 ‘잠재 고객’으로 이해할 수 있음전환한 사용자 그룹 : 설정한 그룹 중 전환한 사용자의 탐색 흐름 어떤 콘텐츠를 살피고 전환했는가 파악전환하지 않은 사용자 그룹 : 설정한 그룹 중 전환하지 않은 사용자의 탐색 흐름 사용자들의 pain-point 파악[Desktop] 평균 그룹 vs FAN 그룹의 Path Plot 비교 ☻ 분석 팁!Fans group & Non-Conversion로 세그멘팅하여,충성도는 높지만 전환하지 않은 유저들의 특징 파악하고자 할 때 활용할 수 있음 6. Live Heatmap SPA 구조의 페이지 혹은 햄버거 메뉴와 같이 동적인 요소, 페이지 길이가 가변적일 때 데이터 확인 & 컨텐츠의 효율 측정 가능[Desktop] Live Heatmap > 숨어있는 레이어와 햄버거 메뉴의 노출 및 클릭 지표 (1) 노출률 요소가 사용자 화면에 노출된 비율만약 페이지 길이가 가변적이라 스크롤 데이터 확인이 어려운 경우 라이브 히트맵의 Click PV Rate/노출값으로 대체 가능노출 자체가 너무 적다면, 레이아웃 변경 등을 통해 노출 자체를 늘리는 것을 먼저 검토 (2) 관심율 호버 PV/노출 PV (%)해당 콘텐츠를 본 사용자가 어느정도의 관심을 보였는가컨텐츠에 대한 소비 효율을 확인할 수 있음 7. User Analytics (1) 유입경로(직전 URL로 구분)사용자의 특성과 니즈 파악 가능도메인 상이 여부에 따라 내부/외부로 구분외부 유입 중 각 유입(검색/SNS 등) 채널별 비중은 어떤지 확인 각 유입(검색/소셜)이 전체 중 차지하는 비중은 얼마인지 확인 가능 (2) 전환경로내부 유입이 많은 경우내부에서 어떤 정보를 획득하고 다른 페이지로 전환된 유저인지 파악 가능외부 유입이 많은 경우 어떤 곳에 관심을 보이는지, 외부 사용자 특성 파악 가능 8. Segmentation (1) Referrer(유입경로)직전 URL로 구분됨유입 경로별로 사용자의 특징 비교 가능 (2) 신규/재방문 사용자신규/재방문 사용자 별로 히트맵의 특징 비교 가능 콘텐츠 제공 목적, 타겟에 따라 신규/재방문 유저를 구분하여 볼 수 있음 (3) Segmenting CTACTA를 클릭한/클릭하지 않은 사용자에 따른 특징 비교 가능 구매로 전환한 사용자와 그렇지 않은 사용자 비교 분석클릭한 사용자가 유입된 직전 URL 마케팅 효과 측정 or 마케팅을 집행할 채널을 정할때 활용 9. Funnel / Session 리포트 (1) Funnel 분석개선하고자 하는 프로세스를 퍼널로 등록하여 페이지별 전환율 확인 ‘최종 목적지까지의 전환율’ 향상을 위한 개선점 파악 가능각 페이지별 이탈률을 계산하여 이탈률이 가장 높은 구간의 페이지를 발견하고 개선점 찾아보기경로별 User Flow를 확인하여 예상대로 유저들이 움직이는지 파악 가능 뷰저블 홈페이지 Funnel 등록 : 메인 > Features > Pricing(최종 목적지) (2) Session Report 개별 사용자 상세 탐색 분석전환된, 전환되지 않은 유저들의 개별 흐름을 확인하여 pain-point 분석 가능 [Session Report] Features 페이지에 방문한 한 고객의 탐색 흐름 오늘은 다양한 뷰저블의 기능들을 지표 해석에 실제로 활용하는 꿀팁들을 알려 드렸는데요, 직접 한번 활용해보시고 분석 결과 해석에 어려움이 있거나, 다른 현업자들의 의견이 궁금하다면 댓글과 포럼 게시판에 남겨주세요! :)

SPA가 뭔가요? SPA의 개념부터 분석 방법까지 알아보자!

😃안녕하세요, 뷰저블 팀입니다.😀 오늘은SPA가 무엇이고 방문한 웹 사이트가 SPA인지 확인하는 방법에 대해서알아보겠습니다.1. SPA가 무엇인가요?SPA는 Single Page Application의 약자로 URL이나 페이지가 바뀐 것 같더라도 실제로는 콘텐츠만 갱신되는 형태의 단일 페이지를 말합니다. 일반적으로 우리가 방문하는 웹 사이트는 보통 MPA (Multi Page Application)인데요, 이는 사용자가 한 페이지에서 다른 페이지로 이동할 때 새로운 페이지의 정적 리소스를 다시 다운로드하는 방식을 사용합니다. 즉, MPA는 여러 페이지의 연결로 이루어져 있기 때문에 콘텐츠를 추가하고 싶으면 원하는 만큼 페이지를 추가할 수 있으나 페이지 이동 시 새롭게 리소스를 가져오기 때문에 느린 이동 속도를 가지게 됩니다. 하지만, SPA는 하나의 페이지로 이루어져 있습니다. 때문에 사용자의 인터랙션으로 요청된 새로운 콘텐츠에 대해서 전체 페이지를 다시 불러오지 않고 해당 콘텐츠만 변경되는 특징을 가지고 있습니다. 이 특징 덕분에 새로고침이 발생하지 않아 로딩 시간이 굉장히 빠른 것이 장점입니다. 2. SPA 페이지는 어떻게 확인하나요?현재 내가 방문한 웹 사이트가 SPA인지 MPA인지 확인하고 싶다면 아래 방법을 따라 해보세요!이번에는 예시를 보여드리기 위해 ‘Beusable 공식 홈페이지’와 ‘뷰저블 포럼 페이지’에서 SPA 페이지 확인 방법을 실행해보겠습니다. 먼저, Beusable 공식 홈페이지에 들어가 개발자도구 > Sources 탭 > Page 탭을 열어봅시다. 이 때 다른 페이지로 전환하는 버튼을 누르게 되면(A페이지)(B페이지로 전환 했을 때)오른쪽에 보이는 Page 탭에서 리소스가 다시 새로고침되고 있습니다!따라서 Beusable 공식 홈페이지는 MPA 페이지군요! 다음으로 뷰저블 포럼 홈페이지에 들어가 동일한 방법으로 개발자 도구를 열어봅시다. 이 후 다른 페이지로 전환하는 버튼을 누르게 되면(A페이지)(B페이지)MPA 방식처럼 리소스가 새로고침되지 않는 모습을 보여주고 있습니다.이처럼 전환 버튼을 눌렀을 때 url은 변경되지만 리소스가 새로고침되지 않는 뷰저블 포럼 페이지는 SPA 페이지라고 볼 수 있습니다. 3. SPA 페이지를 뷰저블로 분석하고 싶어요!뷰저블 히트맵은 MPA 방식의 웹사이트 기준으로 PV를 측정하는데요, 사용자가 A페이지에서 B 페이지로 진입해 페이지 리소스가 새로고침될 때 B 페이지의 1pv를 수집하게 됩니다. 하지만 SPA 방식의 웹 사이트는 페이지가 하나이기 때문에 처음으로 진입한 페이지에서만 1PV가 측정되고 이후에 다른 페이지로 전환해도 리소스가 새로고침되지 않기 때문에 진입 이후의 페이지에서는 PV가 측정되지 않는다는 단점이 있습니다. 때문에 웹 사이트가 SPA 방식으로 구성되어 있다면 히트맵 상단 우측에 있는 SPA 토글을 체크해야 원하는 페이지의 데이터가 수집할 수 있습니다. SPA 분석 토글을 체크하면 URL이 바뀌는 것을 기준으로 PV를 측정하기 때문에 SPA 페이지에서도 정확한 PV 측정이 가능해질 수 있습니다.지금까지 SPA가 무엇인지, SPA 페이지 확인 방법과 히트맵 분석 방법에 대해서 알아보았습니다!이 포스팅을 통해 SPA에 대한 궁금증이 풀리셨기를 바랍니다! 또 SPA 페이지는 원래 A/B Testing 기능이 지원되지 않았는데조만간 UX Writing이 지원되는 기능 업데이트가 있을 예정입니다.SPA 기능 업데이트에 대한 포스팅도 놓치지 말고 많은 관심 부탁드립니다! 😊

UX Case Study [5] : '유입/전환 경로' 분석을 통해 고객 니즈 파악하기

안녕하세요, 뷰저블 UX Researcher입니다. 오늘은 시리즈의 세 번째 주제인 '유입과 전환 경로 분석을 통해 고객 니즈를 파악하기'그리고 그 니즈를 충족하기 위한 방법에 대해서 다뤄 보려고 해요. 1. 분석할 페이지와 분석 목적 파악요즘엔 인터넷/통신사 요금제, 특히 렌탈 상품을 판매하는 서비스에서 결합 상품 결제 시 할인을 제공하는 경우가 많은데요,이런 서비스를 제공하는 사이트의 '결합 요금 견적 받기' 페이지에 대한 분석을 진행해 보려고 해요. '견적 받기' 페이지에 진입하는 고객들은 구매까지 이어질 가능성이 있는 '잠재 고객'으로 해석할 수 있기 때문에,그들이 이탈하지 않고 결제까지 이어질 수 있도록 하는게 무엇보다 중요해요.따라서 이번 페이지의 분석 목적은 '견적 받기' 페이지에 진입한 고객의 니즈를 파악하고 그 니즈를 충족시키는 최선안을 도출해 보려고 해요. 2. 분석할 대상 파악하기페이지에 진입한 고객의 관심사를 파악하고자, 첫 번째 방법으로 (1) 페이지의 유입/전환 경로를 분석하고,두 번째로는 (2) 유입 비중이 높았던 페이지에서의 고객 탐색 여정을 분석해 보려고 해요. 3. 분석 결과 해석 및 인사이트 도출 (1) '결합 요금 견적 받기' 페이지의 유입/전환 경로 분석'요금 상품 상세 페이지(PDP)'를 통해 가장 많이(34%) 유입되었고, 이들은 '카드 혜택' 페이지로 가장 많이(3.7%) 전환된 것을 확인할 수 있었어요.즉, 요금 상품 상세 페이지에서 '결합 요금' 버튼을 클릭하여 견적내기 페이지에 진입한 고객들은 '카드 혜택'에 대한 정보를 얻으려는 니즈가 있음을 확인할 수 있어요. [User Analytics] 유입/전환 경로 (2) 유입 비중이 높은 페이지의 고객 탐색 여정 분석하기유입 비중이 34%로 높았던 '요금 상품 페이지(PDP)'에서 '결합 요금 견적 받기' 버튼을 누른 고객의 탐색 여정을 확인해보니, '카드 혜택' 정보가 적힌 곳에서 가장 오래(7.7초) 머무른 후, 견적내기 페이지로 이동한 것을 볼 수 있었어요. [Path Plot : 결합 요금제 견적내기' 를 클릭한 고객의 요금 상세 페이지 내 탐색 여정] ► 분석 내용 요약이로써, '요금 상품 페이지'에서 '결합 요금 견적 받기' 페이지로 이동한 고객들이'제휴 카드' 할인 정보를 얻고자 클릭한 것을 다시 한번 탐색 여정을 통해 다시 한번 확인할 수 있었어요! 4. 개선 인사이트그렇다면 '견적 받기' 페이지로 이동한 고객들은 '제휴 카드 정보를 얻고자' 하는 니즈를 충족했을까요?아쉽게도 아닐 것 같아요. 왜냐하면 견적내기 페이지에서는 '제휴카드 혜택'에 대한 상세 정보를 제공하고 있지 않았어요. 즉, 많은 고객들이 '제휴 카드' 할인에 대한 정보를 얻고자 '견적내기' 페이지에 진입하지만이에 대한 정보를 얻지 못하고 '카드 혜택' 페이지로 전환해 버리는 것으로 해석할 수 있었는데요, '견적 받기' 페이지에 보다 상세한 '카드혜택' 정보를 제공(툴팁 또는 팝업 레이어 형태)한다면고객들이 불필요하게 다른 페이지로 전환하지 않고도 바로 원하는 정보를 얻어 더 빠른 구매 결정을 유도할 수 있겠다는 인사이트를 얻을 수 있었어요! UX 컨설팅을 진행하다보면 페이지별로 고객 니즈를 파악하고 또 그 니즈가 충족되고 있는지 분석을 요청하시는 경우가 많은데요, 이번 편에서 다룬 내용으로 다양한 사이트의 고객 니즈를 직접 분석해 보시고 분석 결과 해석에 어려움이 있거나, 다른 현업자들의 의견이 궁금하다면 댓글과 포럼 게시판에 남겨주세요! :)

UX Case Study [3] : 신규 고객의 컨텐츠 소비 효율 극대화하기

안녕하세요, 뷰저블 UX Researcher입니다. 지난 게시글까지는 분석을 시작하기 위한 페이지 등록과 뷰저블의 다양한 기능/지표 해석 방법에 대해 설명해 드렸다면,이제부터는 분석 목적과 대상을 파악한 후 결과를 해석하고 인사이트를 얻는 과정까지 실제 활용할만한 사례들로 같이 살펴볼게요. 그 첫 번째 주제는 신규 고객의 컨텐츠 소비 효율을 극대화하기 위해 분석을 진행했던 사례입니다. 1. 분석할 페이지와 분석 목적 파악분석할 페이지는 한 이커머스 사이트의 '스토리' 페이지입니다.제품 사용 팁, 사용자들의 리뷰 등을 제공하는 스토리 페이지를 기획/디자인한 담당자라면, 준비한 컨텐츠들이 실제로 고객들에게 소비되도록 하는 것이 그들의 최종 목표겠죠? 그래서 이번엔 '신규 고객'들의 컨텐츠 소비 효율을 극대화할 수 있는 방안을 찾는 목적으로 분석을 진행해 보려고 해요. 2. 분석할 내용 파악하기우선 현재 신규 고객들의 컨텐츠 소비 효율 분석을 위해(1) 신규 고객들의 특성(2) 신규 고객들의 컨텐츠 탐색 & 전환 패턴을 파악하고,개선안 도출을 위한 원인 및 니즈 분석을 위해,(3) 신규 고객들의 인터렉션 분석(4) 신규 고객들의 관심도가 높은 컨텐츠를 파악해 보려고 해요. 3. 분석 결과 해석 및 인사이트 도출 (1) 신규 고객들의 특성 파악방문자들이 어떤 특성을 가지고 있는지 알기 위한 방법 중 하나로 그들의 유입 경로를 확인하는 방법이 있어요.Reporting Heatmap의 Referrers를 통해 디바이스별 TOP 10 유입 경로를 분석해 보면,모바일은 외부 유입이 85%, 그 중에서도 검색 채널을 통한 유입이 절반 이상이였고,데스크탑은 내부 유입이 91%로 대부분 사이트 내 다른 페이지를 본 후 진입한 고객이였어요. (2) 신규 방문자들의 컨텐츠 탐색 & 전환 패턴 컨텐츠 탐색 패턴스크롤 히트맵의 Attention 그래프를 통해 고객들이 특정 구간/컨텐츠에서 얼마나 주목하는지 확인할 수 있는데요. 각 디바이스별 페이지 내 주목도 그래프 추이를 살펴보면, 모바일에선 Average Fold를 지나면서 그래프가 급감 후 감소하는 추세를 보이는 반면, 데스크탑에서는 상대적으로 페이지 내 그래프의 기울기가 일정 수준 유지되고 있었어요. 그래서인지 전체 페이지 체류시간도 모바일(50초)에 비해 데스크탑(2분 30초)에서 2배 이상 길었어요. 전환 패턴또 각 디바이스별로 가장 많이 클릭한 요소를 확인해보니 모바일은 '햄버거 버튼'이였고, 데스크탑은 '더보기' 버튼이 1순위로 높았는데요, 이러한 사실을 통해서도 모바일에선 페이지를 빠르게 훑어보고 햄버거 메뉴를 통해 다른 페이지로 이탈해버리는 반면,데스크탑에선 페이지 내 컨텐츠를 상대적으로 더 많이 소비하는 패턴으로 해석할 수 있었어요. [모바일, 데스크탑 : 주목도 그래프 (Attention graph) & 체류 시간] 그렇다면 외부 검색을 통해 진입하는 모바일 신규 방문자들의 소비 효율이 낮은 이유를 분석하고,신규 방문자의 소비 효율을 더 극대화할 수 있는 방안에 대해 알아볼까요? (3) 신규 방문자들의 모바일 인터랙션 분석모바일의 스와이프 히트맵을 통해 확인해보니, Average fold 상단 영역에서 무효 스와이프가 발생했네요!이를 통해 모바일 고객들은 더 많은 컨텐츠를 기대하고 이 영역을 스와이프했으나 실패한 것으로 유추해볼 수 있었는데요,모바일 신규 고객에게도 탐색 의지는 있었으나 실패 경험을 겪고 햄버거 버튼을 통해 다른 페이지로 이탈해 버린 것으로 해석해 볼 수 있어요. [모바일 스와이프 히트맵(Swipe Heatmap)] (4) 신규 방문자들의 관심도가 높은 컨텐츠를 파악마지막으로, 페이지에 방문하는 '신규 방문자'의 소비 효율을 높이는 목적을 가진 만큼,재방문자에 비해 신규 방문자는 어떤 컨텐츠에 관심을 가지는지 두 히트맵을 비교할 수 있는 Comparing Referrers 기능으로 두 그룹의 관심도를 살펴봤는데요.데스크탑 신규 방문자들은 최하단의 '리뷰 영역'에서 페이지 내 주목도가 감소하지 않는 것으로 보아, 리뷰 영역을 관심있게 살펴보는 것으로 해석할 수 있었어요. [데스크탑 : 재방문 vs 신규 유저 주목도 그래프 비교] 분석 내용 요약외부 검색 채널을 통해 진입한 모바일 고객의 소비 효율이 데스크탑에 비해 상대적으로 떨어지는데, 모바일 상단에서 발생하는 실패 경험이 그 원인 중 하나일 것으로 유추신규 고객들은 상대적으로 '리뷰' 영역에서 관심도가 높은 것을 확인 4. 개선 인사이트(1) 모바일 상단 영역 캐러셀로 변경모바일도 데스크탑처럼 상단에서 더 많은 컨텐츠가 노출되도록 상단 영역을 캐러셀 UI로 변경하여 페이지 체류시간과 소비 효율을 늘려보는 방안을 검토하거나, (2) '리뷰 영역' 레이아웃 변경신규 고객의 관심도가 높았던 '리뷰 영역' 레이아웃 변경을 통해 전반적인 스크롤 도달률과 컨텐츠 소비 효율을 늘려보는 방안 검토해 볼 수 있어요. 새로운 서비스 출시나 개편 등으로 신규 고객의 컨텐츠 소비 효율을 극대화하고자 하는 담당자 분들께서는 이번에 소개해 드린 분석 방법을 한번 활용해 보시면 어떨까요? 분석 및 결과 해석에 어려움이 있거나, 다른 현업자들의 의견이 궁금하다면 댓글과 포럼 게시판에 남겨주세요! :)

URL 구조 이해하고 분석 매치유형 활용하기 (1/3)

URL 구조 이해하고 분석 매치유형 활용하기 (1/3) 😊 안녕하세요, Beusable 팀입니다! 😊오늘은 이러한 상황을 해결해보고자 " URL을 이해하고 어떤 상황에서 각 매치유형을 사용해야 하는 지 " 알아보려고 합니다. URL 구조 이해부터 매치유형 활용까지! 분석 페이지 등록할 때 필요한 꿀팁이 가득하니 이번 포스팅 내용에 주목해 주세요! 🙂 매치유형을 활용하기 위해서 각 URL의 구조를 예시를 통해 살펴보겠습니다. URL의 구조를 알아봅시다! URL은 프로토콜, 도메인, Path, 파라미터, 프래그먼트로 구성되어 있습니다.각각의 구성 요소들을 살펴볼까요?먼저 프로토콜은 컴퓨터 간 정보 주고 받을 때 통신 방법에 대한 규칙을 표기한 것 입니다. 기본적으로 http와 https를 대표적으로 많이 사용하는데요, http는 html 문서를 주고 받을 수 있는 프로토콜로 일반적인 웹 사이트에서 가장 많이 사용됩니다. https는 http의 보안이 강화된 버전으로 보안이 필요한 서비스에서 주로 사용하는 것을 볼 수 있습니다. 도메인은 숫자로 된 IP 주소와 다르게 사용자가 기억하기 쉽게 보통 서비스 명으로 불리는 컴퓨터 주소입니다. 도메인 전체에는 국가나 기관의 정보를 보여주는 상위 도메인명, 도메인 이름과 도메인에 속한 호스트 정보가 기입됩니다.상위 도메인명국가와 기관에 따라 다른 상위 도메인명을 사용합니다. (국가 구분의 예) 캐나다 구글 사이트 : www.google.ca의 'ca' 한국 구글 사이트 : www.google.kr의 'kr' (기관 구분의 예) 영리 목적의 기업 : 네이버 www.naver.com의 'com'비영리 목적의 삼성재단 : www.samsungfoundation.org의 'org' 도메인명숫자로 표현된 IP 주소를 쉽게 기억할 수 있는 영문으로 표현한 것이 도메인명입니다. (예시)naver, youtube, beusable 호스트명도메인의 하위 개념으로 서브도메인, 보조도메인으로도 불립니다. (예시)music.naver.comblog.naver.commail.google.com Tip! 뷰저블 히트맵에서는 서브 도메인이 다르면 상위 도메인과 도메인명이 같아도 다르게 인지 하는데요, 예를 들어 모바일 버전의 네이버 URL인 ‘m.naver.com’과 데스크탑 버전의 네이버 URL인 ‘www.naver.com’을 서로 다른 도메인으로 인지하기 때문에 뷰저블 히트맵에 분석 페이지를 등록하실 때 각각의 페이지를 별도로 히트맵에 등록해주셔야 합니다! Path는 파일 도메인에 해당하는 웹 서버 기준으로 제공하고자 하는 페이지가 속한 폴더명과 파일명이 나타난 경로입니다. Path는 도메인 이후 /(슬래쉬) 뒤에 표시 됩니다. 컴퓨터의 파일 경로처럼 생각하면 좀 더 이해가 쉽습니다! 파라미터는 가변적 콘텐츠 처리할 때, url을 구분하려고 할 때, 파일 디렉토리 및 파일명 역할을 할 때 필요한 정보로 보통 ?(물음표) 뒤에 표시가 됩니다. 이름과 값으로 구성된 세트가 1개 이상 존재 시 "&"로 구분합니다.위의 예시를 해석하면, 앞선 도메인과 path의 경로에 따라서 ~top100.nhn의 페이지를 보여줄 때 "domain은 OVERSEA로, duration은 1h로 설정한 정보를 제공한다" 라고 볼 수 있습니다. Tip. 파라미터의 사용 용도파라미터는 필터링 기능처럼 웹 사이트에 접속 했을 때 특정 정보가 미리 입력되어 있도록 하는 기능을 합니다. 이에 따라 사용 용도가 크게 3가지로 나누어질 수 있습니다. 1. 가변적 콘텐츠를 처리하기 위한 정보쿼리 스트링으로도 불리는 파라미터는 페이지의 콘텐츠가 정보에 따라 가변적으로 변하는 경우에 많이 사용됩니다.예를 들어, 검색 결과 페이지에서 파라미터를 통해 원하는 검색어 정보를 URL에 함께 전달할 수 있습니다. 이 때, 초기 화면이 아닌 지정된 검색어 정보가 있는 콘텐츠와 레이아웃으로 구성된 웹 페이지를 볼 수 있습니다. 예시)https://shopping.naver.com/luxury/cosmetic/category?menu=10009886네이버 쇼핑 페이지에서 Path까지만 입력하면 ‘쇼핑-럭셔리-코스메틱’까지의 페이지가 열람되지만 파라미터까지 모두 입력하면 ‘쇼핑-럭셔리-코스메틱’에서 파라미터에서 지정한 검색어 정보인 ‘스킨케어’로 설정된 페이지가 나옵니다. 2. URL을 구분하기 위한 정보URL을 여러 매체를 통해 홍보한 경우 어떤 방식으로 유입되었는지 확인하기 위해 각 매체 URL에 파라미터값을 추가할 수 있습니다. 예시)예시로 제시된 두 URL은 모두 구글에서 ‘쿠팡’을 검색하면 나오는 페이지입니다.https://www.coupang.com/ 검색을 통해 들어온 쿠팡 사이트의 URL은 다음과 같지만,https://www.coupang.com/?src=1042016&spec=10304903&addtag=900&ctag=HOME&lptag=쿠팡&itime=20230818174015&pageType=HOME&pageValue=HOME&wPcid=1...동일한 페이지 이지만 ‘구글 광고’로 제시된 쿠팡 사이트로 들어온 사용자의 유입 URL은 다음과 같습니다. 이러한 파라미터의 기능을 활용해서 광고로 유입된 사용자를 분석해 광고 효과를 측정해볼 수 있습니다. 3. 파일 디렉토리 및 파일명 역할을 하기 위한 정보파라미터는 파일디렉토리 및 파일이름과 유사한 역할로도 쓰이는 경우도 있습니다. 예시)‘미디어오늘’의 메인 사이트: http://www.mediatoday.co.kr/?mod=main&act=index '미디어오늘'의 회사소개 사이트: http://www.mediatoday.co.kr/?mod=company&act=introduce Tip. 패스와 파라미터는 어떻게 구분하나요?앞서 말씀드린 것처럼 패스는 웹 서버가 제공하고자 하는 페이지가 속한 파일 경로와 파일명이 나타난 경로이고, 파라미터는 URL의 매개변수로써 URL에 추가적인 정보를 설정할 수 있는 기능이 있습니다.이 두 가지 요소를 쉽게 구분하기 위해서는 /(슬래쉬)와 ?(물음표)를 잘 보시면 됩니다! Tip. UTM Parameter는 무엇인가요?여러분! 혹시 뷰저블 히트맵에 있는 Campaign 세그먼트 기능을 아시나요?뷰저블 히트맵의 Campaign 토글을 누르면 다음과 같은 팝업을 볼 수 있는데요!여기서 말하는 UTM Parameter는 무엇을 말하는 것일까요? UTM Parameter는 Urchin Tracking Module의 약자로, GA에서 특정 캠페인 및 콘텐츠의 성과 측정을 위해 URL 뒤에 파라미터의 형태로 추적을 위한 코드를 붙이는 기법입니다. UTM Parameter을 활용하면 사용자가 어디서, 어떻게 유입이 되었는지 상세한 분석을 할 수 있다는 장점이 있습니다! 다음은 UTM 파라미터의 종류와 그 내용을 간략히 표로 정리해 보았습니다.종류내용예시Source광고 매체명 (어느 매체로 유입이 되었는지)google, naverMedium유입을 유도한 마케팅 방식Banner, cpc, email newsletterCampaign어떤 캠페인의 광고인지 (캠페인명, 슬로건, 프로모션 코드)jan_event, feb_eventTerm키워드 정보 or 타겟팅 정보 (어떤 키워드로 들어왔는지)beusable 등Content어떤 광고 내용에 의해 유입이 발생했는지ecocampaign, watercampaignCampaign 토글 버튼을 통해 설정한 각 UTM Parameter을 선택하여 등록 URL에 진입한 사용자의 데이터를 쉽게 조회해보세요~! 프래그먼트는 뷰저블 히트맵에서는 페이지의 특정 요소에 대해 지시 가능한 기능으로 여러 콘텐츠가 나열된 페이지의 특정 위치 정보를 사용자에게 함께 전달하고자 할 때 유용하게 사용됩니다.페이지에서 content 영역을 지시해 URL 클릭 시 바로 content 영역으로 스크롤 된 페이지를 확인할 수 있습니다. 오늘은 URL의 개념과 구조에 대해서 설명해보았는데요, URL에 대해서 이해하면 앞으로 활용할 매치유형에 대해서도 쉽게 이해하실 수 있습니다! 다음 포스팅은 URL 구조의 이해를 기반으로 페이지 등록 매치 유형에 대해 설명 드리도록 하겠습니다. 앞으로의 포스팅도 기대해주세요!😆[출처]데이터 분석을 위한 기초, URL 이해하기: https://brunch.co.kr/@beusable/237 URL 분석하기 (1/2): https://forum.beusable.net/ko/post/892 URL 분석하기 (2/2): https://forum.beusable.net/ko/post/893 웹 데이터 분석의 기본, 파라미터를 아시나요? | 뷰저블: https://www.beusable.net/blog/?p=3798 시리즈 이어서 보기▷URL 구조 이해하고 분석 매치유형 활용하기 1/3▶URL 구조 이해하고 분석 매치유형 활용하기 2/3: https://forum.beusable.net/ko/post/1317 ▶URL 구조 이해하고 분석 매치유형 활용하기 3/3: https://forum.beusable.net/ko/post/1320