有紀錄的 WCAG 對比度檢查應擷取確切的前景與背景顏色、顯示的對比度比例、適用 AA/AAA 的結果，例如一般文字最低 4.5:1 的 AA 要求、測試的尺寸與狀態，以及所做的每項調整。
記錄檢查不只是記下某組顏色通過而已。有用的紀錄可讓其他審查者辨識受測元件、重現結果、了解適用的 WCAG 門檻，並查看失敗後變更了哪些內容。色彩對比度檢查器提供比例及通過／未通過結果；您的文件流程則提供該計算的相關背景資訊。
這項區分很重要，因為檢查器會接受兩種顏色，但不會掃描網頁、辨識元素的字型大小，亦無法判斷文字後方是否有圖片或漸層。這些細節必須另行記錄。
對比度檢查紀錄應包含哪些內容
完整紀錄應保留足夠資訊，以區別原始設計與核准結果。請使用一致的紀錄格式，讓不同頁面與貢獻者新增的項目能一併審查。
| 紀錄欄位 | 應包含的內容 | 重要性 |
|---|---|---|
| 頁面或元件 | URL、路由、元件名稱與元素描述 | 精確辨識受測項目 |
| 互動狀態 | 預設、懸停、聚焦、作用中、已選取或停用 | 不同狀態可能使用不同顏色 |
| 前景顏色 | 以精確十六進位色碼表示的文字顏色 | 保留實際評估的顏色 |
| 背景顏色 | 以精確十六進位色碼表示的有效背景顏色 | 讓受測的顏色組合可供重現 |
| 文字細節 | 文字大小、字重，以及一般或大型文字分類 | 決定適用哪個門檻 |
| 對比度結果 | 檢查器顯示的精確比例 | 記錄計算結果 |
| 符合性結果 | 相關的 AA 或 AAA 通過／未通過標章 | 顯示適用檢查的結果 |
| 調整 | 原始顏色組合、修正後的顏色組合，以及變更的設計權杖或樣式 | 說明如何解決失敗問題 |
| 責任歸屬 | 測試者、審查者、日期，以及設計或程式碼版本 | 確立結果由何時及何人核准 |
不要以成功的修訂版本覆蓋初始的失敗結果。請保留兩個項目，讓紀錄呈現原始風險、所做決策與最終受測值。如果一項檢查涵蓋數種狀態，請為每組顏色建立不同的列，而非將不同的結果合併。
在 WCAG 對比度檢查器中記錄檢查
對於每組需要留下紀錄的前景與背景組合，請依循以下順序。
- 辨識元素及其狀態。 記錄頁面、元件、文字或介面用途、字型大小、字重，以及受測狀態。檢查器不會提供這些背景資訊，因此請在輸入顏色前先行註明。如果元素具有數種狀態，請分別記錄每個不同的顏色組合。
- 記錄預定的前景顏色。 從相關樣式、元件或設計權杖取得文字顏色的十六進位色碼並加以記錄。如果涉及透明度，請先解析實際顯示的有效顏色再進行測試，並另行記錄該解析結果。
- 在檢查器中設定前景。 開啟色彩對比度檢查器，使用色彩選擇器選取文字顏色，或將其十六進位色碼輸入前景控制項。
- 以相同方式設定背景。 使用色彩選擇器或輸入背景的十六進位色碼。檢查器會將這組顏色視為前景與背景進行評估，雖然最終的 WCAG 比例具有對稱性，但正確標示欄位對文件記錄仍然重要。
- 讀取精確結果。 記錄顯示的對比度比例及通過／未通過標章。不要在紀錄中將比例四捨五入，因為經過捨入的數值可能掩蓋兩個相近結果之間的差異。
- 辨識適用的門檻。 將顯示的結果與一般文字、大型文字或 UI 元件與圖形物件的規定要求進行比較。檢查器會回報相關門檻，但您必須分類內容內容，因為檢查器不會讀取頁面的排版或元素角色。
- 調整未通過的顏色組合並再次檢查。 如果結果未達到要求的等級，請變更設計中的前景或背景，並將修訂後的顏色輸入檢查器。持續進行，直到顯示的標章表示已符合所選等級。
- 撰寫完整紀錄。 在您的文件系統中記錄最終比例、適用標章、修訂後的顏色，以及所採取的行動。新增測試者、審查者、日期與版本，然後對其餘狀態或元件重複此流程。
檢查器會在瀏覽器本機執行計算，因此不必上傳顏色。這有助於測試私人色彩組合。請在您的文件系統中使用顯示的比例、通過／未通過結果與受測顏色組合，以保留永久紀錄。
記錄通過結果前先選擇門檻
WCAG 會依內容使用不同的對比度門檻。請先記錄類別，再判斷標章，以免將大型文字的有效結果誤認為一般文字的結果。
| 內容類別 | WCAG AA | WCAG AAA | 分類細節 |
|---|---|---|---|
| 一般文字 | 至少 4.5:1 | 至少 7:1 | 不符合大型文字定義的文字 |
| 大型文字 | 至少 3:1 | 至少 4.5:1 | 至少 18pt 的一般字體或 14pt 的粗體 |
| UI 元件與圖形物件 | 至少 3:1 | 未另行定義 | 包括相關圖示、表單欄位邊框與焦點指示器 |
這些數值遵循 W3C WCAG 2.1 最低對比度指引。大型文字是指至少 18pt（相當於 24px）的一般文字，或至少 14pt（約 18.66px）的粗體文字。如需協助依現有設計判斷類別，請參閱 依文字大小判斷色彩對比度：適用哪個 WCAG 門檻？。
只有將文字大小、字重與元素用途附加至紀錄後，通過標章才具有明確意義。例如，不要只為按鈕標籤記錄「通過 AA」。應記錄其為一般文字，註明大小與字重，然後記錄比例與標章。
對於表單邊框、圖示或焦點指示器，請套用獨立的非文字要求，而不是將其視為一般文字。此外，也應區分 WCAG 對比度與其他無障礙檢查：比例通過並不能證明介面可操作、標籤具意義，或色彩並非傳達資訊的唯一方式。
將結果轉換成可重複使用的稽核紀錄
固定的句子結構能讓紀錄更容易瀏覽與比較。請使用以下格式：
範例紀錄：頁面或元件：[位置]；狀態：[狀態]；文字大小與字重：[細節]；前景：[十六進位色碼]；背景：[十六進位色碼]；顯示比例：[精確比例]；適用結果：[標章]；初始結果：[通過或未通過]；所做的調整：[變更]；最終受測組合：[十六進位色碼值]；測試者、審查者、日期與版本：[細節]。
此範本能區分檢查器計算的內容與團隊決定的內容。檢查器提供比例與通過／未通過標章；您的紀錄則提供測試原因、適用的內容類別、實作行動與核准狀態。
請為內部狀態使用固定術語，例如「依受測結果通過」、「修訂後通過」、「未通過—待處理問題」或「需要人工審查」。這些是文件標籤，而非檢查器的額外輸出。請統一定義，讓日後的審查者能區分尚未解決的失敗與依不同標準刻意分類的檢查。
當修訂解決問題時，請保留原始與最終的前景及背景值。如果變更來自共用的 CSS 變數或設計權杖，請記錄其名稱及變更所在的版本。如此可避免日後更新色彩組合時，讓舊有核准結果看似也適用於從未受測的顏色。
處理無法以雙色比例判定的情況
檢查器測量的是一種純色前景與一種純色背景之間的亮度對比度。它不會測量色相差異，而且兩種外觀明顯不同的顏色仍可能缺乏足夠的亮度對比度。比例通過也不表示色彩是指出錯誤、選取狀態或必要行動的唯一方式；必要時，請將色彩與文字、圖示或其他提示搭配使用。
- 漸層： 請測試文字出現位置中最亮與最暗的背景點。由於單一比例無法代表整個漸層，請記錄這兩組受測組合。
- 半透明圖層： 請解析圖層堆疊後的有效顏色，並測試該有效組合。請在紀錄中保留透明度或覆蓋層的細節。
- 圖片上的文字： 請檢查文字周圍的代表性位置，尤其是背景最亮與最暗的區域。檢查器不會自動從圖片擷取顏色。
- 預留位置文字與停用狀態： 請將這些項目記錄為個別檢查，並套用適合其角色的要求。項目出現在紀錄中，並不自動表示每個狀態都適用相同的文字門檻。
- 細字型裝飾字體： 請記錄字重與視覺處理方式，即使數值達到門檻，仍應進行人工審查。亮度計算無法判斷所有可讀性問題。
面對上述任何情況，檢查器仍可用於測試每組已解析的顏色組合。周圍的人工審查，才能將計算結果與最終的呈現體驗連結起來。
審查並關閉文件
將項目標記為完成之前，請確認其他人不需要詢問缺少的資訊就能重複進行。檢查頁面與狀態是否已明確識別、兩個十六進位值是否均已提供、文字分類是否合理、精確比例是否已記錄，以及記錄的徽章是否符合該分類。
- 確認最終顏色與即將發行的實作相符。
- 讓未通過的結果連結至解決問題的設計變更。
- 找出是哪位審查者核准了分類與最終配對。
- 在品牌顏色、字體或元件詞彙變更時安排重新檢查。
通過的配對是該測試組合的證據，並不代表整個頁面都通過。完整的稽核軌跡會明確指出適用範圍，並協助團隊將後續工作聚焦於未測試的狀態、動態背景及尚未解決的失敗項目。
因此，簡明的最終交接可以陳述如下：「已將指定元件與狀態的前景色和背景色輸入色彩對比檢查工具，記錄顯示比例與適用徽章，並已修正及重新檢查任何未通過的配對；最終實作也已依指定的 WCAG 分類獲得核准。」
如需深入了解，請參閱 RGB 補色是否能保證無障礙對比？。