無障礙設計是什麼？
無障礙設計，英文叫 Web Accessibility，縮寫 A11y，意思是讓網站能被各種人使用——包括視力受損的人、聽力困難的人、行動能力受限的人，以及使用輔助技術的人。
但這裡有一個很多開發者和設計師不知道的事：無障礙設計其實對所有人都有好處。
文字對比度高了，不只是色弱的人受益——在太陽光下用手機看網站的人也受益。
鍵盤可以操作整個網站，不只是行動不便的人受益——喜歡用鍵盤快捷鍵的人也受益。
圖片有說明文字，不只是視障者受益——圖片載入失敗的時候所有人都看得到文字說明。
無障礙設計和 SEO 的關係
Google 的爬蟲基本上就是一個「看不到圖片、聽不到聲音」的訪客。
當你為視障者優化網站（文字替代、清楚的標題結構、鍵盤導航），同時也在幫 Google 理解你的網站內容。無障礙設計好的網站，在 SEO 上往往也更有優勢。
最重要的五個無障礙設計基礎
1. 圖片一定要有 alt 文字
每一張圖片都應該有 alt 屬性，說明這張圖片在做什麼。
好的 alt 文字：描述圖片的內容和功能。
壞的 alt 文字：「圖片」「圖1」「banner.jpg」
純裝飾性圖片（例如背景紋理）：alt="" 留空，告訴螢幕閱讀器跳過。
2. 文字和背景的對比度
WCAG（網頁內容無障礙指引）規定，正文文字的對比度至少要達到 4.5:1。
你可以用 WebAIM 的 Color Contrast Checker 工具免費測試你的配色。最常見的問題：淡灰色文字放在白色背景上、白色文字放在淡色圖片上。
3. 標題結構要有邏輯（H1 → H2 → H3）
一個頁面只能有一個 H1，通常是頁面的主標題。
次要標題用 H2，子標題用 H3，不要為了視覺效果跳著用。
不要因為「這個地方想要大字體」就用 H1，不要因為「這裡標題太大」就改用 H3 然後用 CSS 放大——標題標籤是語意結構，不是字體大小的工具。
4. 互動元素要能用鍵盤操作
所有可點擊的元素（按鈕、連結、表單欄位）都應該能用 Tab 鍵移動焦點，並用 Enter 或 Space 觸發。
快速測試方法：打開你的網站，完全不用滑鼠，只用鍵盤，看看你能不能完成主要的操作（填表、點選選單、提交）。
5. 連結文字要有意義
「點擊這裡」「了解更多」這類連結文字，對螢幕閱讀器完全沒有意義——它無法知道「這裡」是什麼。
好的連結文字應該說明目的地或動作：「下載完整報告（PDF）」「查看所有服務方案」「安排免費諮詢」。
PageSpeed 報告裡的無障礙分數
如果你用 PageSpeed Insights 測試你的網站，裡面有一個「無障礙功能」分數（滿分 100）。
這個分數不直接影響 SEO 排名，但反映了 Google 對你網站品質的評估。目標是 90 分以上。
最常見的扣分項目：
圖片缺少 alt 文字
表單欄位缺少 label
對比度不足
按鈕沒有 aria-label（只有圖示、沒有文字說明）
無障礙設計的最小可行做法
如果你現在沒有時間做完整的無障礙檢核，至少先做以下三件事：
第一：所有圖片加上有意義的 alt 文字。
第二：用 Color Contrast Checker 確認你的主要文字顏色通過 4.5:1 對比度標準。
第三：用 WAVE（wave.webaim.org）免費工具掃描你的網站，它會標示出最嚴重的問題。
這三件事加起來不超過一小時，卻能讓你的網站對更多人更友善，也更容易被搜尋引擎理解。