色盲，又稱色覺辨認障礙，是指患者無法正常辨別顏色；而色弱則是指患者的辨色能力低於正常水平。雖然色覺障礙不會阻礙患者的肢體活動，但它確實對生活生活造成影響，甚至可能將患者置於危險之中。在產品設計過程中，我們通常只關注視力正常的使用者。那麼，如何在網頁和平面設計上運用通用設計原則，同時滿足色盲色弱患者及健全人士的需求呢？

根據全球統計數據，約有 8% 的男性及 0.5% 的女性患有色盲或色弱，即每 12 位男士中就有 1 位患者，因此在人生中我們很可能會遇上幾個患者。

色覺障礙可以分為三類：

1. 紅綠色盲
2. 黃藍色盲
3. 全色盲（包括色弱）

近九成患者屬於紅綠色盲，這表示他們無法區分紅色和綠色，而將兩種顏色都視為褐色。在日常生活中，我們經常用紅色和綠色表達相反的意思，例如危險和安全。然而對色覺障礙患者而言，僅憑顏色來判斷事物可以十分危險。

無障礙設計及通用設計

隨著社會不斷進步，為了確保殘疾人士*享有平的權利和生活質素，全球開始提倡無障礙概念 (accessibility)，由此產生了無障礙設計和通用設計。雖然這兩者在定義上有些許分別，但它們都是為所有人締造理想的環境。

* 殘疾並非僅限於永久性障礙、身體殘疾和視障，還包括情緒精神障礙、認知障礙、智力發展遲緩、學習困難等，以及暫時性的障礙。

無障礙設計 (accessible design)：源自無障礙 (accessibility) 一詞，指針對殘疾人士需求的設計。網頁無障礙設計包括調整字體大小、顏色對比、輔助功能、螢幕報讀機支援、鍵盤輸入、替代文字等。

通用設計 (universal design)：這種設計策略不僅讓殘疾人士受益，還適用於不同種族、性別、年紀、社會階層、文化、國家、語言、財富、體型的人群，是真正人人通用的設計原則。

現今的網絡產品需考慮不同地區、語言文化，甚至使用者的身體活動能力，因此通用設計越來越受到重視。雖然一般產品不強求設有方便視障人士使用的設計，但運用通用設計原則，可以讓視障人士和健全人士，甚至是跨地區的使用者能夠更快理解資訊，這正是良好用戶介面設計 (UI design) 的指標。

色盲色弱設計對策

如前所述，通用設計應適用於所有人。若色盲色弱患者能輕鬆使用介面，對於視力正常和老年人來說效果將更佳。在設計網頁或印刷品時，可留意以下幾點：

1. 使用高對比度配色

色盲色弱患者容易混淆彩度相近的顏色，但通常對明度和飽和度的細微差異更敏感。因此，配色不應只依賴顏色的彩度，明暗對比強烈才能使物件層次分明。如為彩度選色，鑑於多數患者為紅綠色盲，應避免使用正紅色和正綠色，以免患者將其視作同一顏色，可選擇偏黃的紅色和偏綠的藍色。

調整色彩搭配的步驟

1. 從黑白開始設計，不要被顏色的彩度影響
2. 將色彩空間由 RGB 轉換為 HSL 或 HSB
3. 首先調整明度（L 或 B 值），因為它對顏色對比度影響最大
4. 然後加強色相或冷暖色對比（H 值）
5. 用色彩對比工具檢查主體和背景的對比度（對比度請參考下面表格）

遵循 W3C 對比度標準的設計系統

W3C 的無障礙設計指引 — Web Content Accessibility Guidelines (WCAG) — 根據明度和文字大小來衡量圖文對比度，介面元件均在此限。通常介面設計達到 AA 級標準已經很足夠，而要達到 AAA 級則需要犧牲更多美感。調整文字對比度本身並不難，但要讓整個設計系統 (design system) 中的所有元件達到 AA 級並非易事。

例如，對色覺正常的人來說，文字欄位和表格的淺色外框只是裝飾，但對視障患者而言，這些外框很重要。要達到相關標準，就需要協調外框、背景顏色和文字等多種元素的對比度，這絕非易事。

對比度	AA 級 (基本)	AAA 級 (嚴格)
標準對比度（14pt 粗體或少於 18pt）	不少於 4.5	不少於 7
大型文字對比度（18pt 或以上）	不少於 3	不少於 4.5

2. 採用視障安全色彩

為了確保色彩對比度適合，除了檢查顏色的對比度之外，你還可以使用對色覺障礙者友好的安全色版。東京大學分子細胞生物學研究所針對色盲、色弱、綠內障和白內障等視障症狀，研究出視障安全色版，分為螢幕、印刷及塗裝色版。該方法的原理是用橙紅色代替紅色、藍綠色代替綠色，使紅綠色盲患者更容易分辨顏色。

此外，日本非牟利機構 CUDO 將色彩通用設計（Color Universal Design，簡稱 CUD）推廣至全球。安全色彩不僅可以應用於防災資料和路標，還可用於兒童玩具、教科書、家用電器和企業報告等日常用品，甚至連紙牌遊戲 UNO 也推出了專為色覺障礙者設計的版本，體現通用設計的精神。

3. 利用顏色以外的視覺提示

除了選擇高對比度的顏色組合之外，設計應該善用顏色以外的視覺提示，如線條、形狀和圖案，以幫助區分不同的內容。在色塊之間加入分隔線和外框也能增加對比，避免亮度相近的顏色混淆。

4. 加入 ALT 替代文字

WCAG 也建議為所有非文字內容提供文字提示。簡言之，圖片應包含 alt 替代文字；Image Map 應附加文字連結，並使用文字內容替代文字圖片等。在需要使用顏色傳達的情況下，如產品選色或在線狀態，除了標示顏色之外，還應加入文字描述或改變圖示形狀以表達訊息。

5. 避免依賴顏色引起的感覺

對於正常色覺的人來說，紅色很顯眼，但對紅綠色盲患者來說，紅色是不起眼的啡色，而粉紅色會被看成土黃色，很多顏色看起來也相似，甚至可能會誤認為是另一種顏色。因此，依賴色彩心理學－即顏色引起心理變化的理論—對色覺障礙者並不適用。在做重要或有時間限制的決策時，正常視力和視障人士都不應僅靠顏色做出重要的判斷。

例如視障患者可能會將警示牌的紅色誤看成深啡色，這樣一來，警示牌的警示功能便大打折扣，因此警示牌通常被設計成不常見的三角形以增強警示效果。

以前的交通燈只依賴顏色提示，色盲患者根本無法分辨「去」和「停」。現在透過加入表意的人像和動畫，形成了「三重保障」，對視障和正常視力者都有幫助。

嚴格對應方案

上述建議是根據綜合參考資料提出，W3C 發佈的無障礙設計指引 WCAG 有更詳細的要點，主要針對網絡和數碼內容。該指引分為三個等級，分別是基本的 A 級，一般的 AA 級和嚴格的 AAA 級。以下是一些有關 AAA 級值得注意的指引：

• 避免使用左右對齊的文字
• 行寬不多於 80 個字符或 40 個中日韓字符
• 段落行距不少於 1.5 倍
• 避免使用可能引起癲癇發作的內容，在 1 秒內閃爍燈光不超過 3 次
• 確保良好的內容架構，以便轉換為語音後仍保持文句通順

應用

嚴格遵循上述規則確實可能會犧牲一定的美感，要在無障礙設計和美觀之間取得平衡並非易事，但其實並非所有內容都需要採用無障礙設計，而是根據具體需求來決定。在公共設計領域，無論是大型的醫院路標，還是小型座檯月曆，站在視障人士角度考慮也是好的，尤其是對於重要的公共設施而言，無障礙設計更是不容忽視。具體應用範例可參考 Color Universal Design 將無障礙設計應用於圖表、地圖、日曆和路線圖的精采範例。

參考資料

• カラーユニバーサルデザイン推奨配色セット－東京大学分子細胞生物学研究所
• CUDO – Color Universal Design Organization
• W3C Web Content Accessibilities Guidelines (WCAG) 2.0
• Designing For, and As, a Color-Blind Person－Webdesign Tuts+