小企業如何檢查顧客流程中的文字與介面色彩對比？

按顧客實際路線檢查

只看調色板樣本不足以檢查對比。顧客實際走過首頁、商品或服務詳情、表格、確認畫面和錯誤修正，每一段都有不同背景上的文字、多種狀態的控制元件，以及傳達意思的圖示。先選一條真實可行的桌面與手機操作路線，記下每組可見顏色及元件的用途。別漏掉橫幅、優惠價、必填提示、停用按鈕和浮層。若只測設計系統的預設按鈕，可能忽略顧客看不清錯誤訊息或鍵盤焦點的位置。

應把 WCAG 2.2 的 AA 成功準則當作不同問題處理。1.4.3 涵蓋文字及文字圖片：一般文字對背景至少要有 4.5:1 對比，大型文字門檻為 3:1。1.4.11 則涵蓋辨認介面元件或有意義圖像所需的視覺資訊，通常要與相鄰顏色有至少 3:1 對比，並留意準則列出的例外。兩個數值針對不同資訊。按鈕內的標籤仍屬文字；按鈕邊框或狀態指示可能屬非文字。把整個按鈕只套用一個門檻，會混淆要求。

按文字實際顯示狀態測試

要量度文字前景色與它背後實際相接的背景色。深色標題在白底可能合格，放到淺色卡片上卻可能不合格。佔位文字、次要說明、連結標籤、表格指示和錯誤內容，只要顧客需要閱讀作決定，顯示時便應按文字測試。看起來粗體不等於符合大型文字定義；應依 WCAG 的條件核對實際字體大小與粗幼。附帶文字、停用元件及商標文字的例外範圍有限，普通操作說明不會因視覺上較次要，就自動成為可豁免的附帶文字。

以結帳頁作例子：送貨指示用淺灰字，提交按鈕文字用深藍色。應在各自真正的背景上分別量度。若送貨指示不符合一般文字門檻，可加深字色或修改背景，並在實際顯示大小重測；指示告訴買家何時收貨，不能把它說成裝飾而逃避修正。提交按鈕則要多做一步：標籤文字可能已達 4.5:1，但按鈕外形與旁邊面板顏色過近，令顧客看不到可按位置。這屬另一項非文字對比問題。以上是假設顏色，未實際量度前不聲稱任何具體比值。

找出元件靠甚麼被看見

對每個輸入框、按鈕、核取方格和已選分頁，都問：顧客靠哪個視覺特徵知道它在哪裏，以及目前是甚麼狀態？答案可能是邊框、底色、勾號、底線或焦點提示。量度這個必要特徵與相鄰顏色，而非與調色板裏無關的顏色相比。W3C 的非文字對比指引對這些必要線索設 3:1 門檻。若輸入框只靠細灰邊辨認，就比較邊框與頁面；若核取方格靠勾號表明已選，就比較勾號與周圍底色。可點擊範圍很大，也不代表邊界一定看得見。

互動狀態不能只靠一張截圖檢查。元件在預設狀態可能合格，取得鍵盤焦點、被選取、滑鼠經過或出錯時卻失效。鍵盤使用者要看得到焦點；錯誤狀態亦不能只讓能分辨紅色的人察覺。WCAG 的「色彩使用」準則另外要求顏色不能成為傳達資訊或提示操作的唯一視覺方法。可按情況加上清楚標籤、形狀不同的圖示、邊框或說明文字，再測試新增線索本身的對比，並確保訊息閱讀次序合理。色彩對比與資訊設計相關，但並非同一項測試。

讓有意思的圖像保持可讀

圖表、狀態圖示或流程圖可能傳遞旁邊文字沒有說出的資訊。先找出理解內容所必需的部分，再按非文字準則測試它們與相鄰顏色的對比。純裝飾照片是另一回事；WCAG 沒有要求自然照片中每一種顏色都達到某個數值。品牌標誌亦有列明例外。但教學箭嘴即使放在宣傳圖片內，也不會因此自動獲豁免。若圖表以多條不同顏色線表示資料，除了要讓標記可辨，還應提供文字標籤或資料表，避免讀者只能靠分辨顏色理解。

對比檢查工具適合量度清楚的兩色組合，但計算結果取決於輸入顏色是否正確。實際頁面可能有漸層、半透明浮層、照片背景及程式切換的狀態，仍要目視檢查。半透明面板蓋在圖片不同位置，文字背後的有效背景會變；應選可能出現的最不利位置核對，必要時改用穩定的文字底面。截圖取色工具也不能當唯一權威：字邊抗鋸齒及顯示條件會影響取樣像素，而 WCAG 的相關指引要求按情況參考作者設定或瀏覽器使用的顏色。

按用途修正，重測整條路線

若多頁共用同一設計色票，可從來源修正，但要檢查它出現的每個位置。加深次要文字色可能令說明更清楚，也可能在深色卡片上造成新問題。每項失敗應記下網址、畫面闊度、元件狀態、前景色、背景色、量得比值及適用準則，再選能保留原本用途而達標的替代色。部署後重測實際頁面，包括手機浮層和表格回饋。數字量度要配合鍵盤操作及實際閱讀流程；比值合格不能證明指示清晰，更不能發現流程漏了必需元件。

完成標準應具體：指定顧客路線上，所有必要文字與非文字線索都已識別；預設與重要互動狀態的相關配色已量度；失敗項目已在實際輸出修正並重測。保留精簡審核紀錄，下次更換活動色盤或頁面範本時，便可沿同一路線再檢查。若第三方控制小工具，應記錄受影響狀態並提供可重現例子，而非默默接受無法看清的結帳步驟。目的是讓顧客在每一階段，包括出錯時，都能閱讀並完成操作；首頁取得一個綠色分數並不足夠。

把審核結果變成可持續的設計選擇

色彩變數應記錄用途與已測試配對，而不只是流行色號。可分別定義主頁面上的內文、卡片上的次要文字、按鈕上的操作標籤，以及在不同背景上的焦點提示。活動團隊即使沒有改前景色，只要更換背景，配對已經改變。應在設計檔或樣式指引記下核准組合、使用情境及適用準則，讓沒有專門知識的編輯建立新落地頁時也有可用選項，減少重複犯錯。

不同語言版本要分開測試。英文與繁體中文的字串長度和換行位置不同，文字可能移到圖片區域，或令按鈕延伸至另一種背景。英文桌面設計稿通過測試，不能證明中文版手機流程也合格。應在代表性闊度打開每種語言，觸發相同表格錯誤和選取狀態。翻譯後提示文字變長，也要確保它沒有被裝飾層遮住。數值門檻沒有改變，但讀者實際遇到的像素及相鄰顏色可能因排版而不同。

可按受阻任務安排修正先後，但不能因此改寫標準。看不清付款錯誤或無法辨認已選送貨選項，通常應先於次要裝飾細節處理；其他適用的失敗仍要保留在修正清單。指定負責人，修改顏色或布局，然後沿同一路線重測。如可行，請不熟悉頁面的人完成任務，他們可能發現設計者已習慣自行推斷的缺失線索。這種觀察應記為使用者回饋，不能代替 WCAG 的量度檢查。