無障礙設計（Accessibility, 常縮寫 a11y）到 2026 年已經不是「加分項」，而是設計師的職業基本功。歐盟無障礙法案、美國 Section 508、加州 AB 1757 等法規陸續上路，把 WCAG 2.2 AA 從建議變成法律要求。
📖 學（核心）
WCAG 的四大原則
無障礙網頁內容指南（WCAG）2.2 用四個原則（縮寫 POUR）撐起整個框架：可感知（Perceivable）——資訊要能被看到或聽到，例如圖片要有替代文字、影片要有字幕；可操作（Operable）——所有功能都能用鍵盤完成，不能只靠滑鼠；可理解（Understandable）——介面行為可預測、錯誤訊息講人話；穩健（Robust）——能被螢幕報讀器等輔助科技正確解析。多數專案 2026 年的目標是 AA 等級。
WCAG 2.2 新增的幾個關鍵要點
2.2 版新增 9 條成功準則，特別聚焦在互動細節：
焦點不被遮擋：元素獲得鍵盤焦點時必須完整可見，不能被固定式頁首、Cookie 橫幅或聊天視窗蓋住一部分。這是很多網站實際踩雷的地方。
目標尺寸夠大：按鈕與可點連結的點擊範圍至少要 24×24 像素，方便手指與運動功能受限的使用者操作。
少依賴記憶：例如不該要求使用者記住前一頁出現過的資訊才能完成操作。
為什麼不能最後再補
WCAG 2.2 處理的問題，多半不是收尾時能乾淨補丁的小事——它們根植於設計系統、元件決策、互動模型與內容流程。對比度不足、焦點順序混亂、表單缺標籤這些問題，越晚發現重做成本越高。最務實的做法是把無障礙當成設計的預設值：在元件層級就確保色彩對比達 4.5:1、每個互動都能用 Tab 走完、每張圖都先想好替代文字。
🧠 記
記住 POUR 四原則：可感知、可操作、可理解、穩健。 2.2 的三個高頻檢查點：焦點別被遮、點擊區 ≥24px、文字對比 ≥4.5:1。 核心心法：無障礙是預設值，不是收尾補丁。
✍️ 實踐
挑一個你常用的網站或自己做的頁面，只用鍵盤（Tab、Enter、方向鍵）操作一遍，看能不能完成主要任務、焦點框會不會被擋住。再用瀏覽器的對比檢查工具量一下主要文字的對比度是否達 4.5:1。把發現的問題列成清單。
🔗 延伸學習
💬 問 AI
我在設計一個網頁介面，想符合 WCAG 2.2 AA。請用白話解釋 POUR 四原則，列出 2.2 新增準則中最常被忽略的（焦點遮擋、目標尺寸、對比度），並給我一份可在設計與開發階段逐項勾選的無障礙檢查清單。