ux-heuristics

UX 啟發式框架

評估與改善使用者介面的實用可用性原則。使用者不閱讀，他們掃描；他們不做最佳選擇，而是滿意即可；他們不搞清楚運作方式，而是胡亂摸索。

核心原則

「別讓我思考」 — 每個頁面都應該不言自明。如果某個東西需要思考，那就是可用性問題。使用者的耐心與認知頻寬有限，因此設計應符合上述的掃描、滿意與胡亂摸索行為。

評分

目標：10/10。 稽核介面，對每個問題按下方嚴重性量表評級，然後根據快速診斷結果為介面評分：從10分開始，每項未通過的診斷列扣分，加權依據其觸發的最嚴重等級（災難性/重大列約扣2分，輕微/裝飾性約扣1分）。區間：9-10 = 無嚴重性3以上問題且≤1項未通過診斷列；6-8 = 有一些重大問題或多項未通過列；3-5 = 有災難性問題或許多未通過列；≤2 = 核心任務受阻。務必說明當前分數、最嚴重的問題，以及達到10/10所需的具體修正。

克魯格可用性原則

法則1-3是克魯格的三項可用性法則；#4，後車廂測試，是他的導覽定向檢查。

1. 別讓我思考

核心概念： 使用者腦中浮現的每個問號都會增加認知負擔，並分散對任務的注意力。

為何有效： 使用者有任務在身 — 他們不想費心解讀標籤或解碼花俏的行銷用語。需要的思考越少，完成任務的可能性就越高。

關鍵見解：

• 清楚的名稱永遠勝過巧妙的名稱
• 行銷用語造成摩擦；平實語言消除摩擦
• 不熟悉的分類迫使使用者停下來解讀
• 模糊的連結與按鈕導致猶豫

產品應用：

情境	應用	範例
導覽標籤	不言自明的名稱	「取得路線」而非「計算到達目的地的路線」
行動呼籲	使用者理解的動作動詞	「登入」而非「進入您的帳戶入口」
錯誤狀態	告訴使用者下一步該做什麼	「檢查您的電子郵件格式」而非「驗證錯誤」

文案模式：

• 行動導向按鈕：動詞 + 名詞（「建立帳戶」、「下載報告」）
• 避免行話：「儲存」而非「持久化」、「移除」而非「解除關聯」
• 如果標籤需要解釋，請簡化標籤

道德界線： 清晰應服務使用者 — 絕不利用平實語言作為掩飾不利條款的外衣。

參閱：references/krug-principles.md 當您需要完整的克魯格方法 — 掃描/滿意/胡亂摸索心理學、善意儲備、首頁與標語指引，以及零成本可用性測試協議（需要多少使用者、測試腳本）。

2. 點擊次數不重要

核心概念： 迷思說「使用者點擊3次後就會離開。」實際上，只要每次點擊輕鬆、明確且建立信心，使用者並不介意點擊次數。

為何有效： 每次點擊的認知努力比點擊次數更重要。使用者失去信心時會放棄，而不是因為點擊到沒耐心。

關鍵見解：

• 每次點擊應輕鬆、明確且建立信心
• 三次不用動腦的點擊勝過一次需要深思的點擊
• 淺層導覽搭配清楚標籤勝過深層導覽搭配模糊標籤

產品應用：

情境	應用	範例
結帳流程	讓每個步驟明確	清晰的步驟指示器搭配描述性標籤
設定	清楚的分類勝過扁平列表	「帳戶 > 安全性 > 變更密碼」（3次確定的點擊）
入門引導	小而明確的步驟	每個步驟一個明確動作的精靈

文案模式：

• 進度指示器：「步驟 2/4：運送詳細資料」
• 每個步驟的確認：「太好了，您的電子郵件已驗證。現在讓我們設定您的個人檔案。」
• 清楚的連結文字：「查看所有跑鞋」而非「點擊這裡」

道德界線： 絕不利用額外步驟來隱藏取消流程 — 每次點擊都應讓使用者朝目標前進，而非遠離目標。

3. 刪掉一半文字

核心概念： 刪掉每個頁面上一半的文字，然後再刪掉剩下的一半。簡潔讓有用的內容更突出，並尊重使用者的時間。

關鍵見解：

• 開心話（「歡迎來到我們的網站！」）浪費空間
• 沒人看的說明應移除
• 「請」和「懇請」等禮貌贅詞增加雜訊
• 較短的頁面意味著更少的滾動和更快的掃描

產品應用：

情境	應用	範例
登陸頁面	刪除歡迎文案，以價值為先	移除「歡迎來到...」段落
錯誤訊息	說明問題與修正，其餘免談	「密碼太短（最少8個字元）」
空狀態	行動導向、簡潔	「無結果。請嘗試不同搜尋。」

文案模式：

• 修改前：「請注意，您需要輸入密碼才能繼續下一步。」→ 修改後：「輸入密碼以繼續。」
• 修改前：「我們已收到您的訊息，並會盡快回覆您。」→ 修改後：「訊息已送出。我們將在24小時內回覆。」

道德界線： 簡潔不得省略關鍵資訊 — 關於定價、條款與資料使用的簡潔揭露是使用者的權利。

4. 後車廂測試

核心概念： 將使用者丟到任何隨機頁面（就像從後車廂被釋放到隨機地點）— 他們應能立即回答六個定向問題：這是什麼網站？這是什麼頁面？主要區塊有哪些？我這裡有哪些選項？我在層級結構中的哪裡？搜尋在哪裡？

為何有效： 良好的導覽提供持續的定向。無法辨識自己位置的使用者會感到迷失而離開。

將其作為導覽檢查：頁面標題必須與使用者點擊的連結相符，必須有「您在這裡」指示器（反白的導覽項目、粗體麵包屑），且區塊標題必須提供定向（「您的帳戶 > 帳單」而非僅「設定」）。

道德界線： 導覽標籤必須誠實反映網站結構 — 絕不使用誤導性標籤將使用者引導至行銷頁面。

參閱：references/krug-principles.md 當執行後車廂測試或設計導覽時 — 它將六個問題分別對應到回答該問題的頁面元素，以及麵包屑和永久導覽規則。

尼爾森10項可用性啟發式

1. 系統狀態的可見性

透過即時回饋讓使用者隨時了解狀況。每個動作都需要確認 — 上傳的進度條、提交的確認、載入的骨架畫面。無聲的失敗會破壞信任。文案模式：「儲存中...」→「已儲存」。

2. 系統與真實世界的匹配

使用使用者的語言：「登入」而非「驗證」、「搜尋」而非「查詢」。遵循真實世界的隱喻（垃圾桶、購物車）和自然順序（街道→城市→州→郵遞區號）。

3. 使用者控制與自由

提供明確的「緊急出口」。復原勝過「您確定嗎？」對話框 — 使用者會不經閱讀就點擊確認。每個流程都需要取消/退出，且返回按鈕絕不能失效。

4. 一致性與標準

相同的文字、樣式和行為在整個系統中代表相同的意思。內部一致性（您的應用程式）加上外部一致性（平台慣例：標誌左上角、搜尋右上角）。每個概念一個詞彙 — 到處都是「專案」，絕不與「工作區」混用。

5. 錯誤預防

在問題發生前預防：限制輸入（日期選擇器優於文字欄位）、自動完成、合理的預設值、「未儲存變更」警告。失誤（意外錯誤動作）與錯誤（錯誤意圖）需要不同的預防方式。

6. 辨識而非回憶

最小化記憶負擔 — 顯示選項，不要求記憶。麵包屑、最近搜尋、預填欄位、帶有解碼值的下拉選單。工作記憶約容納7個項目；辨識遠比回憶容易。

7. 使用彈性與效率

同時服務新手與專家：鍵盤快捷鍵、批次操作、儲存搜尋、指令面板（Cmd+K）。漸進揭露讓初學者保持簡單，同時專家可存取完整功能。

8. 美學與極簡設計

每個元素都必須證明其存在的價值 — 當所有東西都在爭取注意力時，沒東西能脫穎而出。顯示當下重要的，隱藏不重要的。每個頁面一個主要行動呼籲。

9. 協助使用者辨識、診斷並從錯誤中恢復

錯誤訊息需要三個部分：發生什麼事、為什麼、以及如何修正。使用平實語言（「連線失敗」而非「ECONNREFUSED」）、具體說明（「密碼必須8個字元以上」而非「無效」）、絕不責怪使用者、保留他們的輸入。

10. 說明與文件

說明應可搜尋、以任務為導向（「如何...」而非技術參考）、且具情境性（工具提示、行內提示、導覽導覽）。

參閱：references/nielsen-heuristics.md 當針對特定啟發式進行稽核時 — 它將10項啟發式分別展開為良好實作/常見違反/嚴重性表格，附帶文案模式與道德界線。

嚴重性評分量表

對稽核中發現的每個問題進行評級：

嚴重性	評級	描述	優先級
0	非問題	意見分歧，非可用性問題	忽略
1	裝飾性	輕微困擾，影響低	有時間再修
2	輕微	造成延遲或挫折	排程修正
3	重大	顯著任務失敗	盡快修正
4	災難性	阻止任務完成	立即修正

權衡三個因素：頻率（發生頻率）、影響（發生時的嚴重程度）、持續性（一次性或持續）。

參閱：references/audit-template.md 當執行完整的啟發式評估時 — 一個結構化的每畫面模板，以一致格式捕捉問題、嚴重性與建議修正。

常見錯誤

錯誤	為何失敗	修正
神秘肉導覽	無標籤圖示強迫猜測	在圖示旁加上文字標籤
太多選擇	決策癱瘓拖慢使用者	減少至7加減2個項目
無「您在這裡」指示器	使用者在層級中感到迷失	在導覽和麵包屑中反白目前區塊
無行內驗證	提交、錯誤、滾動循環令人沮喪	在失焦時驗證並提供具體訊息
不明確的必填欄位	使用者對哪些是必填感到困惑	標示選填欄位，而非必填
文字牆	沒人閱讀密集段落	用標題、項目符號、空白間隔
標籤中的行話	使用者不懂您的內部語言	對所有標籤進行使用者測試，使用平實語言
無載入指示器	使用者認為系統當機	顯示旋轉圖示、進度條或骨架畫面
極小的觸控目標	行動使用者不斷誤點	最小44x44像素觸控目標
僅懸停顯示資訊	行動與鍵盤使用者錯過	不要將關鍵資訊藏在懸停背後
無復原	使用者不敢採取任何動作	為所有非破壞性動作提供復原
糟糕的錯誤訊息	「無效輸入」什麼都沒告訴使用者	解釋哪裡錯了以及如何修正
低對比文字	對許多使用者來說無法閱讀	WCAG AA最低標準（4.5:1對比）
導覽位置不一致	使用者找不到導覽	固定位置，每個頁面相同位置
返回按鈕失效	違反瀏覽器契約	絕不劫持或破壞瀏覽器歷史

參閱：references/wcag-checklist.md 當稽核無障礙設計（對比、鍵盤、螢幕閱讀器、焦點）時 — 一份完整的WCAG 2.1 AA檢查清單，附帶測試工具。參閱 references/cultural-ux.md 當為全球受眾設計時 — RTL版面、顏色含義、表單/姓名/日期慣例，以及本地化陷阱。

快速診斷

問題	若否	行動
我能立即知道這是什麼網站/頁面嗎？	使用者迷失	加入清楚標誌、頁面標題、麵包屑
主要動作是否明顯？	使用者不知道該做什麼	視覺層級、單一主要行動呼籲
導覽是否清楚？	使用者找不到路	執行後車廂測試，加入「您在這裡」指示器
我能找到搜尋嗎？	目標導向的使用者受阻	頁首中可見的搜尋框
系統是否顯示正在發生什麼？	使用者失去信任並重新點擊	載入狀態、確認、進度
錯誤訊息是否有幫助？	使用者卡住	平實語言搭配具體修正
使用者能否復原或返回？	使用者不敢行動	到處提供復原、取消和返回選項
是否無需懸停也能運作？	行動/鍵盤使用者被排除	懸停互動的可見替代方案
所有互動元素是否都有標籤？	使用者猜測圖示含義	文字標籤或描述性工具提示
是否有任何東西讓我停下來想「嗯？」	認知負擔過高	簡化 — 如果需要解釋，重新設計

啟發式衝突

啟發式有時會互相矛盾。當發生時：

• 簡潔 vs. 彈性：使用漸進揭露
• 一致性 vs. 情境：一致的模式，情境化的突出
• 效率 vs. 錯誤預防：偏好復原勝過確認對話框
• 可發現性 vs. 極簡主義：主要動作可見，次要隱藏

參閱：references/heuristic-conflicts.md 當兩個啟發式方向相反且上述四條規則無法解決時 — 提供權衡範例的解決框架。

暗黑模式辨識

暗黑模式故意違反啟發式以操縱使用者：強制續約（難以取消）、蟑螂旅館（易進難出）、確認羞辱（基於罪惡感的選項）、隱藏成本（結帳時意外費用）。

參閱：references/dark-patterns.md 當您懷疑設計是在操縱而非服務使用者時 — 完整分類、道德替代方案及相關法規。

何時使用每種方法

方法	時機	時間	發現
啟發式評估	在使用者測試之前	1-2小時	重大違反
使用者測試	在啟發式修正之後	2-4小時	真實行為
A/B測試	最佳化時	數天至數週	統計驗證
分析審查	持續進行	30分鐘	模式與問題

延伸閱讀

基於 Steve Krug 和 Jakob Nielsen 開發的可用性原則：

• "Don't Make Me Think, Revisited" by Steve Krug
• "Rocket Surgery Made Easy" by Steve Krug（DIY可用性測試）
• "10 Usability Heuristics for User Interface Design" by Jakob Nielsen（Nielsen Norman Group）

關於作者

Steve Krug 是一位可用性顧問，其著作《Don't Make Me Think》（2000年，2014年修訂）是網頁可用性領域最廣泛閱讀的書籍。他證明了可用性測試不需要實驗室或大筆預算 — 只需觀察少數真實使用者嘗試完成任務即可。

Jakob Nielsen, PhD 是 Nielsen Norman Group 的共同創辦人，也是10項可用性啟發式（1994年）的作者，該框架至今仍是全球最常用的啟發式評估框架。《紐約時報》稱他為「網頁可用性大師」。