電商網站觀察訪客軌跡的免費螢幕錄影工具 – Microsoft Clarity

圖片來自 Microsoft Clarity 官方介紹

觀察訪客在網站上的瀏覽動線、畫面捲動、滑鼠的移動軌跡與點擊,可以幫助電商業者了解網頁設計布局上的缺失,並進一步調整優化,便能讓網站的使用體驗能持續變好,提高轉換率,近期來已逐漸被電商業視為必備工具項目之一了。

提到螢幕錄影工具,一般人應該都是聯想到 Hotjar,Hotjar 的功能是強大的,但畢竟它的商業模式是 Freemium (免費增值商業模式),可以免費使用,不過免費的方案是有不少限制的,包括每日 2,000 pageviews,300 個錄影檔 …

除了 Hotjar 以外,還有其他選擇嗎?

當然有,例如 Google Optimize 也提供了使用者行為的分析,不過既然已經使用了一堆 Google 的服務了,若能使用不同廠商的服務來分工,除了可避免所有工具或服務都被單一廠商所綁架,也可能有交叉比對驗證的功能性。

螢幕錄影工具的選擇,目前看起來比較值得一提的是 Microsoft Clarity (https://clarity.microsoft.com/),微軟前幾天發佈了免費且符合GDPR的用戶行為分析工具 Clarity,對頁面加載時間的影響極小,雖然功能尚未完整,但已含有最重要的螢幕錄影功能,而且目前尚未有使用流量的限制,對於 Hotjar 免費方案不滿足的使用者,可以評估採用 Microsoft Clarity 的可能性。

Clarity 的安裝方式也很簡單,與 Google Analytics 安裝追蹤碼的方式大致相同,就是將 Clarity 提供的一段 JS 追蹤碼,埋入網站的 段落中即可,如果您是採用 CMS 架站,您就可以直接利用網站提供 Custom JS 的功能,或是在放置 Google Analytics 追蹤碼的地方,直接放在 GA 的追蹤碼之後即可。

在 OpenCart 可用 Google Analytics 模組安裝 Clarity 追蹤碼

Clarity 在安裝之後,官方宣稱可能需要 2 個小時之後,才能呈現收錄的資訊,不過個人實測第一個網站,收到紀錄進來的時間約是在 50 分鐘之後,目前提供的分析功能,主要分為 3 個大項。

Dashboard
Dashboard 是數據總覽分析表,包含了工作階段數、平均頁數、平均捲動深度、互動時間、無效點擊(這個有趣)、熱門頁面、參照來源 … 等等,雖然沒有 GA 的深度及廣度,但主要的指標聚合在一個畫面,也提供了快速理解的功能。
其中有部分數據還可以直接點擊查看該區隔的 heatmaps(熱點地圖) 與 recordings(螢幕錄影)。

Recordings
Recordings 就是訪客的螢幕錄影回播功能,預設會遮蔽重要的輸入資訊,例如信用卡號或密碼,強調注重隱私。畫面左側會呈現每個工作階段的資料區塊,包含了瀏覽頁數、時間、點擊數、裝置別、OS別、國家別等等。
左側的資料區塊有提供 Filter(篩選)及 Sort(排序)的功能,點擊左側您想撥放的資料區塊,就會在右側出現訪客視角的畫面錄影重播,並標示出滑鼠的軌跡與點擊,並提供了跳過無互動時段的功能,節省你觀看了時間。

Heatmaps
Heatmaps 是用來呈現網頁被點擊的熱區,前端工程師或美編應該很需要這項功能,可以藉此檢討版面的編排設計,找出不該被點擊的地方卻一直被誤點,該被點擊的地方卻一直被略過等等。

(抱歉剛上線 收到的資料還不多 …)

個人主觀評論
Clarity 目前還稱不上功能強大,不過仍可安裝 Clarity 來搭配其他流量分析工具使用,對於需要 heatmaps(熱點地圖) 與 recordings(螢幕錄影)功能的人,對比 Hotjar 免費方案的限制,Clarity 也不失為一個好選項,就算您暫時仍不打算安裝 Clarity,建議也應該關注 Clarity 的發展,畢竟微軟在軟體界有舉足輕重的地位,若微軟願意投入資源好好發展 Clarity,相信仍有能力將 Clarity 打造成功能強大的分析工具。

Microsoft Clarity 微軟官方介紹 https://blogs.bing.com/webmaster/october-2020/Microsoft-Clarity-is-now-Generally-Available

=====================================================
MarTech 行銷科技洞察社團 - GA4、SEO、GTM、Search Console、Looker Studio、社群、內容、廣告
OpenCart 台灣技術支援 - OpenCart 網站代管、客製、維護
OpenCart 台灣電商社團 - 台灣 OpenCart 使用者交流
=====================================================