良好作業模式1.7 – 提供足夠的顏色對比度 (基礎級別)
在視覺呈現的網頁內容與其背景顏色之間應有適當的對比度,至少:
- 文字文本為 4.5:1
- 互動元素或圖形物件 (對使用者有意思的) 為 3:1
其背景使內容易於閱讀
場景1
| 修正前 | 修正後 |
|---|---|
![]() |
![]() |
| 在以上示例中,按鈕「繁體中文」及未勾選狀態的切換按鈕「講座」、「工作坊」與背景的顏色對比度欠佳,有礙閱覽。 | 顏色對比度提高後,按鈕文字及切換按鈕更易於閱覽。網上提供了各種檢測顏色對比的工具,可協助流動應用程式開發人員進行顏色對比度測試。 |
場景2
| 修正前 | 修正後 |
|---|---|
![]() |
![]() |
| 啟用深色模式後,標題文字、按鈕文字與背景沒有足夠的對比度,導致閱讀困難。 | 修正後,標題文字和按鈕文字可以方便使用者閱讀。 |
W3C WCAG 參考: 1.4.3 對比度 (最低)、1.4.11 非文字對比
















































