找我們做網站
↑
Seo · 網站分析與行銷工具

Hotjar 錄影(Recordings)教學:重播訪客在網頁上的操作

網站分析與行銷工具發布 2018.07.07更新 2026.10.02閱讀約 6 分鐘
Hotjar 錄影(Recordings)教學:重播訪客在網頁上的操作

重點整理
Hotjar 的 Recordings 會把訪客在網頁上的滑鼠移動、點擊與捲動錄成可重播的畫面,用來找出使用者卡關的地方。本文示範錄影設定與觀看方式;方案額度與介面已改版,以官網現況為準。

Hotjar 錄影模式(Recordings)介紹教學,紀錄網站訪客網頁使用軌跡,在上一篇網站熱點分析文章( Hotjar 網站熱點地圖-分析網頁中使用者最常點擊區域 )中筆者介紹了有關如何設定網站紀錄使用者行為模式熱點,以做出站內資訊區域使用程度比較,透過統計數據可以看到哪些區域是最門的位置有最多人停留觀看,藉此可以將想要呈現給使用者的資訊做位置修改和放置,讓重要訊息可以被更多使用者觀看,並藉此提升網頁轉換率( Conversion Rate )。
而在本篇教學中將介紹更詳細的使用者行為紀錄功能,也就是 Recordings 錄影模式,透過指定錄製重要的網站頁面,並設定錄製使用者行為的條件,Hotjar 這項功能可以將網站訪客在網頁上操作軌跡做螢幕影片的錄製,讓網站經營者可以透過使用者行為去分析網站內部問題,筆者做一個假設,如果説網站的商品頁面中,大部分被錄製的使用者在將商品加入購物車後,滑鼠的移動次數增多,或者網站錄製畫面的滾動次數增加,那麼就有多種可能性導致使用者的行為,比如説結帳按鈕做得不夠明顯,位置讓使用者難以找尋或者是使用者想要跳出當前商品介紹頁面繼續選購,但卻找不到回到商品目錄的連結,以上情況都具有造成使用者網站體驗不佳的可能性,因此筆者認為 Recordings 錄影模式 對於網站管理者而言是相當重要的一套工具。那麼廢話不多說,開始介紹這套 Hotjar 實用工具吧!
(小提醒:鵠學苑的所有教學均是以 Apple Mac OS X 系統 做步驟示範!)

Hotjar Recordings 錄影模式設定步驟

第一步:進入到 Recordings 的項目設定步驟中,同樣選擇基本免費方案,可以錄製100個使用者的網站操作影片。

Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡
Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡

第二步:如果使用免費版的功能在這一個設定中只能選擇 View all page,如果說網站頁數不多,基本功能就已夠用了,想要再進階的話在付費選擇方案後就可以自定義特定網頁或使用 JS 來指向網站庫存頁面文件。

Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡
Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡

第三步:這一步是設定錄製的條件,左方的是只錄製有點擊以及滾動頁面行為的使用者操作,中間的是只錄製超過30秒以上的影片,筆者建議兩者都勾選,因為就使用經驗來說,如果不勾選Hotjar就會連停留不動或只有10秒的使用者操作影片都會錄製,這些完全是無效的使用者分析資料,也只是白白浪費影片額度。

Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡
Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡

第四步:完成 Recordings 的設定了,點擊 Start Recording。

Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡
Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡

Hotjar Recordings 錄影模式範例展示

第一步:同樣進入到 Recordings 操作頁面,可以在右邊找 Filter 按鈕。

Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡
Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡

第二步:點擊後會彈出側邊選單,當行為錄製影片多起來的時候可以透過這個選單設定篩選條件來查看影片,增加資料分析效率。

Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡
Hotjar-Recordings 錄影模式,紀錄網站訪客網頁使用軌跡

第三步:以下是筆者在鵠學苑中做操作被 Hotjar 所錄製下來的使用者行為影片,提供給各位參考,影片中下方時間軸的部分會有不同的標示,白色直線代表滾動畫面、紅色圓點代表使用者有點擊行為,如果錄製的影片過長,不妨可以利用這些標示快速跳轉到該時間軸的位置,可以增加查看頁面資料分析的效率。

觀看錄影時要怎麼找出問題?

錄影數量一多,一部一部看很耗時間,可以先篩選再觀看:

  • 從重要頁面開始:例如結帳頁、表單頁,先看這些頁面的錄影。
  • 篩選特定行為:找出有「憤怒點擊」(同一處連續點擊)或快速離開的錄影,通常就是卡關的地方。
  • 比較裝置:手機和桌機分開看,很多問題只在手機版出現。
  • 記錄共通模式:單一訪客的怪異操作不一定有意義,多數人都卡在同一處才是要修的問題。

也可以搭配免費的 Microsoft Clarity 等工具交叉比對。

常見問題

Hotjar 錄影(Recordings)可以看到什麼?

Hotjar 錄影會把訪客在網頁上的滑鼠移動、點擊、捲動與換頁過程錄成可重播的畫面,可以看出訪客在哪裡停留、在哪裡反覆點擊或找不到按鈕。它記錄的是操作過程,不是用攝影機拍攝訪客。

Hotjar 錄影會不會錄到訪客輸入的個資?

Hotjar 預設會遮蔽訪客在輸入欄位中打的文字,錄影中只會看到被遮住的內容。若頁面上顯示了會員姓名、地址等資料,也可以在設定中把特定元素加上遮蔽。網站隱私權政策與 Cookie 同意也應說明有使用行為分析工具。

Hotjar 免費方案可以錄多少?

Hotjar 有免費方案,但錄影數量與功能的限制已多次調整,原文寫的數字是 2018 年的資料,已不適用。實際額度請以 Hotjar 官網的方案頁為準,流量大的網站要特別留意額度是否夠用。

結語

透過 Hotjar Recordings 錄影模式可以幫助我們詳細紀錄使用者瀏覽網站軌跡,協助站長更好的針對使用者網站體驗部分做改進,但同時筆者也要做提醒 Hotjar Recordings 對使用者操作的紀錄影片要記得不要隨意公開,尤其在個人隱私權及資訊安全越來越受到重視的現在,如果隨意挪用 Hotjar Recordings 所紀錄的影片做為它用,會有侵犯個人隱私權的問題,因此建議在網站中的隱私政策及使用條款這兩個頁面,都要加入為增進網站使用體驗在瀏覽過程會有紀錄使用軌跡的條文,並且要特別標明只使用於改善網站作法,不會移作它用。而更保險的作法是透過安裝 WordPress 外掛來設定彈出視窗,設定條文連結供使用者觀看並徵求紀錄使用軌跡同意,如果將來有隱私權問題時,才能有所依據,筆者並非專業法務人士,只是提供一個比較保險的作法供各位參考,相關的條文內容設立方式還是要請教律師事務所或公司內部的法務人員,鵠學苑無法在這方面提供相關幫助的。
後續鵠學苑會再推出其他有關 Hotjar 網站分析 的相關文章,因此也可以採用其它做法讓來對網站使用者體驗做分析

鵠學苑・鵠崙設計鵠崙設計 2014 年成立,專注 WordPress 網站開發,400 多個網站在我們自己的主機上運作。鵠學苑的文章由團隊實際操作後整理,工具與外掛的功能以撰文當時為準。
鵠崙設計

不想自己摸索,
就交給我們做。

外掛設定、主機效能、改版搬家,這裡寫的每一件事,都是我們每天在客戶網站上做的工作。留下需求,1 個工作天內回覆。