你已經把 Microsoft Clarity 裝好了，後台每天累積一堆工作階段錄影、熱圖一張接一張，看起來很厲害。但你打開後盯了十分鐘，腦中只有一個問題：這些東西到底要怎麼看、看出來之後又能改什麼？
這是幾乎每個第一次用 Clarity 的人都會卡住的地方。資料不缺，缺的是「從訊號到行動」的方法。
這篇文章專注一件事：把 Clarity 的熱圖、錄影、行為洞察，轉成你網站上一個個可以動手修的改善項目，並驗證它真的有用。看完你會有一套可重複的工作流程，而不是「亂看錄影殺時間」；至於安裝、內容遮蔽與 GA4 串接等設定，文末附了一節完整參考。
GA4 告訴你「發生了什麼」，Clarity 才告訴你「為什麼」
GA4、GSC 這類流量工具擅長告訴你發生了什麼：哪頁跳出率高、哪個關鍵字進來的人不轉換。但它們不會告訴你背後的原因。
使用者是在表單第三欄放棄的？是把不能點的圖片狂按三下？還是捲到一半找不到「立即諮詢」按鈕就走了？這些「人到底經歷了什麼」的問題，正是 Clarity 的主場。
所以正確的用法不是天天打開 Clarity 隨機看錄影，而是帶著一個具體問題進來找答案。先有假設，再用 Clarity 驗證或推翻它，效率會差十倍。
三大功能各自能挖出什麼洞察
熱圖：一眼看出注意力集中在哪、又冷在哪
熱圖是把成千上萬次互動疊加成一張「平均行為地圖」，適合快速判斷一個頁面的版面設計對不對。Clarity 主要提供三種：
- 點擊圖（Click map）：看使用者實際點哪裡。重點不只是「熱的地方」，更要看冷的地方。你最重要的 CTA 按鈕如果一片冰冷，代表它的位置、文案或視覺權重出了問題。同時注意有沒有人在「不能點的東西」上猛點（例如純裝飾的圖示、看起來像連結的粗體字），那是體驗誤導。
- 捲動圖（Scroll map）：用顏色顯示「有多少比例的人捲到這個高度」。它最有價值的用途是檢查捲動深度。你的核心賣點或 CTA 如果落在只有 20% 的人會看到的高度（俗稱「死區」），那再好的文案也是白寫。理想情況下，關鍵轉換點應該落在 50% 以上的人看得到的位置。
- 區域圖（Area map）：把頁面切成區塊，顯示各區塊吸引到的點擊佔比。適合用來比較「導覽列 vs 主視覺 vs 側欄」哪一塊真正抓住注意力，幫你決定版面取捨。
實務上建議桌機與手機分開看。同一個頁面在手機上的捲動行為、點擊熱點，往往和桌機差很多。這也呼應了 行動裝置 SEO 與 Mobile-First 的核心：手機體驗才是現在的主戰場。
工作階段錄影：別一支支看，用篩選器精準鎖定
新手最大的浪費，就是把錄影列表從頭往下一支一支點開看。一個有流量的網站一天可能上百支錄影，你不可能看完，也沒必要。正確做法是用篩選器（Filters）只看「值得看」的那幾支。
幾個高 CP 值的篩選組合：
- 依裝置（Device）：先看 Mobile，因為手機通常問題最多、流量最大。
- 依特定頁面（URL / Page）：鎖定你正在優化的那一頁（例如定價頁、聯絡表單頁），只看在那頁發生的工作階段。
- 依來源（Source / Channel）：例如只看從 Google 自然搜尋進來的人，了解 SEO 流量的真實體驗。
- 依「有錯誤的工作階段」：篩出含 JavaScript errors、Rage clicks 或 Dead clicks 的錄影。這些幾乎篩出來就是問題現場，命中率最高。
看錄影時別逐秒看，善用 Clarity 的時間軸與快轉，把空白等待的片段跳過，直接停在「使用者明顯卡住、反覆操作、突然離開」的瞬間。你要找的是異常行為，不是看完整支影片。
行為洞察儀表板：五個摩擦訊號各自在說什麼
Clarity 的 Dashboard 會自動把摩擦點量化成幾個「智慧事件（Smart events / Insights）」，這是你最該每週掃一次的地方。各訊號的含義與對策如下：
- Dead clicks（死點擊）：使用者點了一個沒有任何反應的元素。常見原因是「看起來可點但其實不可點」，例如非連結的圖片、樣式像按鈕的文字。對策：把它變成真連結，或移除誤導的視覺樣式。
- Rage clicks（憤怒點擊）：短時間內在同一處反覆狂點，是明確的挫折信號。通常代表按鈕壞了、載入太慢沒回饋、或彈窗關不掉。對策：檢查該元素是否真的可運作、是否有載入中的視覺回饋。
- Excessive scrolling（過度捲動）：使用者上下來回大幅捲動，常代表「找不到想要的東西」。對策：資訊架構或頁內導引（錨點目錄、區塊標題）需要加強。
- Quick backs（速回）：進到某頁後極短時間內就退回上一頁，代表「這頁不是我要的」或載入體驗差。對策：檢查該頁與入口連結的承諾是否一致（標題殺人？），以及首屏速度。
- JavaScript errors（JS 錯誤）：頁面執行時拋出程式錯誤，可能讓表單送不出、按鈕失效。對策：交給工程師依錯誤訊息修，這類問題往往直接吃掉轉換。
Rage clicks 和 JavaScript errors 是「先修為敬」的兩個訊號，它們通常對應到真正壞掉的功能，修一個常常能立刻救回一批流失的轉換。
速查表：看到哪個訊號，就往哪裡修
把上面的訊號整理成一張「看到什麼 → 可能是什麼病 → 往哪修」的速查表，遇到問題直接對照：
| Clarity 訊號 | 可能病因 | 修正方向 |
|---|---|---|
| Dead clicks 集中在某圖示／文字 | 元素看起來可點但其實沒連結 | 補上真實連結，或拿掉誤導的 hover／底線樣式 |
| Rage clicks 集中在按鈕 | 按鈕失效、點擊後無回饋、載入過慢 | 確認事件綁定正常，加上 loading 狀態回饋 |
| 捲動圖顯示 CTA 在死區 | 關鍵按鈕埋太深，多數人看不到 | 把 CTA 上移至首屏或重複放置於可見高度 |
| Excessive scrolling | 資訊架構混亂、找不到目標內容 | 加入頁內目錄、清楚標題、縮短關鍵路徑 |
| Quick backs 比例偏高 | 頁面內容與入口承諾不符、首屏慢 | 對齊標題與內容、優化首屏載入速度 |
| JavaScript errors 在表單頁 | 程式錯誤導致表單無法送出 | 依錯誤訊息交工程師修，並回測送單流程 |
GA4 找出問題頁，Clarity 找出根因
Clarity 真正的威力，是和流量工具搭配使用。單看 Clarity 你不知道「哪頁最該優化」，但 GA4 知道。標準打法是「GA4 找出問題頁，回 Clarity 找出根因」：
- 在 GA4 的頁面報表中，找出流量大但跳出率高、或轉換率異常低的頁面。
- 記下那頁的網址，回到 Clarity，用 URL 篩選器只看該頁的錄影與熱圖。
- 用行為洞察先掃該頁有沒有 Rage clicks、Dead clicks，再挑幾支「速回」的錄影看人到底卡在哪。
- 形成假設、修正、回 GA4 驗證跳出率與轉換是否改善。
關於 GA4 端怎麼找出這些問題頁、怎麼設定轉換事件，可以參考 GA4 應用實戰；想更深入把 GA4 數據與 SEO 結合，則看 GA4 與 SEO 整合分析。一個負責「廣度」、一個負責「深度」，合起來才完整。
每修好一個摩擦點，同時也在替 SEO 加分
別忘了，Clarity 裡的這些行為訊號，本質上就是 Google 在意的使用者體驗信號。Rage clicks、Quick backs 對應的就是糟糕的互動與 pogo-sticking；過度捲動與死區則和版面、Core Web Vitals 息息相關。
換句話說，你用 Clarity 修好的每一個摩擦點，同時也是在替 SEO 加分。
這層關聯在 頁面體驗與 UX 信號對 SEO 的影響 一文裡有完整說明：使用者體驗好，停留與互動信號就好，長期有助於排名。把 Clarity 的洞察餵回頁面優化，等於同時收割「轉換率」與「排名」兩份紅利。
把流程串成閉環：發現、假設、修正、驗證
把前面所有東西串成一個可重複的循環，這才是讓 Clarity 產生實際價值的關鍵。每一輪優化都照這個順序走：
- 發現訊號：每週掃一次行為洞察儀表板，或從 GA4 找出問題頁，鎖定一個最值得處理的摩擦點。
- 形成假設：看熱圖與 3–5 支錄影，寫下一句具體假設，例如「定價頁的 CTA 在死區，所以下單少」。假設要可被驗證，不要含糊。
- 動手修正：一次只改一個變因（移動 CTA、修按鈕、改文案），避免多項同時改而無法判斷誰有效。
- 驗證效果：能做 A/B 測試最好；不行就用「前後對比」，比較修改前後同樣天數的轉換率、跳出率，並回 Clarity 確認原本的訊號（如 Rage clicks）是否真的下降。
- 記錄並進入下一輪：留下改了什麼、結果如何，累積成你網站的優化知識庫。
提一個能大幅省時的功能：Clarity 內建的 AI 摘要（Copilot）可以幫你自動總結一段錄影或一批工作階段的重點，先讓 AI 點出「使用者在這段遇到什麼」，你再針對它指出的片段深入看。這在錄影量很大時特別好用，能把你從「大海撈針」解放出來。
附錄：安裝、內容遮蔽與 GA4 串接設定（完整參考）
還沒把 Clarity 裝起來、或想確認隱私設定有沒有踩雷，這一節把安裝到合規一次講清楚。Clarity 是微軟推出的免費行為分析工具且不設流量上限，和 GA4 互補：GA4 回答「發生了什麼」，Clarity 回答「為什麼會這樣」，兩者搭配才有完整決策依據。
三種安裝方式怎麼挑
Clarity 提供三大類安裝途徑，差別在於「技術門檻」與「日後維護彈性」。先看這張對比表，再決定你該走哪條路：
| 安裝方式 | 適合對象 | 技術門檻 | 優點 | 注意事項 |
|---|---|---|---|---|
| ① 手動貼程式碼 （貼進每頁 <head>） |
自架站、能改原始碼者 | 中 | 不依賴外掛、載入最直接 | 必須確保每一頁都有；改版易漏；無集中管理 |
| ② Google Tag Manager （GTM 範本或自訂 HTML） |
已用 GTM、需集中管理標籤者 | 中 | 一次設定全站生效、與其他標籤統一治理、改動免動原始碼 | 需先有 GTM 容器並正確發佈 (Submit) |
| ③ CMS 一鍵整合 （填 Project ID） |
WordPress / Shopify / Wix 等平台使用者 | 低 | 最快、零程式碼、平台自動注入全站 | 依賴平台外掛/整合品質；部分平台需先裝官方 App |
用 GTM 從頭安裝（最推薦長期維護）
建立帳戶很快：到 clarity.microsoft.com 用 Microsoft、Google 或 Email 帳號登入，建立專案 (Create new project) 後，到 Settings → Setup 取得這個專案的追蹤碼與 Project ID（追蹤碼裡那串字串就是 ID）。接著以最具彈性的 GTM 完整跑一遍（前提是你已有 GTM 容器並裝在網站上）：
- 登入 tagmanager.google.com 進入容器，點標籤 (Tags) → 新增 (New)。
- 點標籤設定，在社群範本庫搜尋「Microsoft Clarity」選用；找不到就改選自訂 HTML (Custom HTML)，把整段追蹤碼貼進去。
- 若用範本標籤，填入你的 Project ID。
- 觸發條件選 All Pages，確保全站每頁都載入。
- 命名標籤（例如
Clarity - All Pages）後儲存 (Save)。 - 點預覽 (Preview)，用 Tag Assistant 確認 Clarity 標籤有 fired。
- 確認無誤後提交 (Submit) → 發佈 (Publish)。
裝完務必驗證，否則可能等了三天才發現一筆資料都沒收到：用無痕視窗實際開幾頁、點幾下、捲一下，回 Clarity 後台看安裝狀態是否轉為「receiving data」、Dashboard 與 Recordings 是否開始出現工作階段。若遲遲沒資料，檢查 Project ID 是否正確、GTM 是否已 Publish（而非只 Save）、是否被廣告攔截器或網站 CSP（內容安全政策）擋掉。
內容遮蔽（Masking）：Strict／Balanced／Relaxed 怎麼挑
這是最關鍵的隱私設定。Clarity 會把錄影與熱圖中的文字以遮罩呈現，避免敏感資訊外洩，分三種模式：
| 模式 | 遮蔽程度 | 看得到什麼 | 適合情境 |
|---|---|---|---|
| Strict | 最高（幾乎全部文字遮蔽） | 版面結構、互動行為，但文字多被遮成色塊 | 醫療、金融、會員資料等高度敏感網站；隱私優先 |
| Balanced（預設） | 中（遮蔽輸入欄位等敏感內容，保留一般文字） | 大部分頁面文字可見，密碼/表單輸入自動遮蔽 | 多數一般網站的推薦設定，兼顧洞察與隱私 |
| Relaxed | 最低（僅遮蔽明確敏感欄位） | 幾乎所有內容皆可見 | 無敏感資料的內容型/行銷型網站，且已確認合規 |
取捨原則很簡單：遮越多，隱私越安全，但洞察價值越低；遮越少，看得越清楚，但合規風險越高。不確定時就維持預設的 Balanced（已自動遮蔽密碼、信用卡等輸入欄位），設定位置在 Settings → Masking。
IP 排除與 GA4 串接
IP 排除（IP blocking）：你和同事天天進自己的網站，這些內部流量會稀釋真實資料。到 Settings → IP blocking 加入公司、家裡的固定 IP，把內部流量排除在統計之外，資料才乾淨。
GA4 串接：到 Clarity 專案的 Settings → Integrations 找到 Google Analytics 整合，授權後選擇對應的 GA4 資源 (Property) 與資料串流 (Data Stream)。串好之後，就能在 GA4 報表中針對特定使用者或事件，直接跳轉觀看對應的 Clarity 工作階段錄影，把 GA4 的「數字」和 Clarity 的「畫面」接起來。GA4 端怎麼裝、怎麼設轉換事件，可參考 GA4 應用實戰。
GDPR 與 PII 合規要點
- 自動遮蔽輸入欄位：預設情況下，密碼、表單輸入等敏感欄位內容不會被記錄，這是 Clarity 內建的 PII（個人可識別資訊）防護。
- 納入 Cookie 同意：若你的網站受 GDPR、台灣個資法等規範，應把 Clarity 納入同意管理 (consent) 流程——使用者同意分析類 cookie 之前不要載入 Clarity；用 GTM 安裝時可搭配同意模式 (Consent Mode) 或同意觸發條件控制。
- 不主動蒐集 PII：不要透過 Custom tags 把姓名、Email、電話等個資直接打進 Clarity，這會違反使用條款也增加合規風險。
TOPCLASS 觀點
很多人把網站當成上線就不用再管的東西，但真正會賺錢的網站需要持續觀察使用者的真實動線：他們卡在哪個步驟、在哪個畫面前轉身離開。流量工具告訴你「發生了什麼」，Clarity 告訴你「為什麼」，兩者缺一不可。
GA4 看到「定價頁跳出率高」只是線索，Clarity 的錄影才會讓你親眼看到使用者在第三欄表單前皺眉放棄的那一刻。
如果你希望有人幫你把這套「發現訊號 → 形成假設 → 修正 → 驗證」的閉環真正跑起來、把數據變成可衡量的轉換成長，歡迎讓 TOPCLASS 與你一起，把網站從「能看」做到「能賺」。