網站無障礙設計入門指南：香港企業建立可用、可讀、可操作官方網站的實務規劃與執行方法

當客戶想在手機上查閱服務詳情，卻因字體太細、按鈕太密而無法操作；當採購人員需要以鍵盤填寫查詢表單，卻找不到游標位置；當影片只有畫面沒有字幕，部分訪客便會直接離開。這些不是小細節，而是影響企業信任、詢盤與轉換的使用障礙。這份網站無障礙設計入門指南，會以香港企業常見的官方網站、網店及機構平台為例，說明應先處理甚麼，以及如何把無障礙要求納入網站規劃。

網站無障礙設計不是只為少數人而做

網站無障礙設計的目的，是讓不同能力、年齡、裝置及使用情境的人，都能取得內容並完成所需操作。視障人士可能使用螢幕閱讀器，行動不便人士可能只用鍵盤瀏覽；也有人因身處嘈雜環境而需要字幕，或因陽光太猛烈而看不清低對比的手機畫面。

對企業而言，無障礙不是把網站做得「特別」，而是把基本體驗做好。清晰標題、易讀文字、有邏輯的導覽和明確的表單提示，同樣能減少一般訪客的理解成本。當客戶更容易找到產品、服務範圍、地址、聯絡方法及報價入口，網站自然更有機會支持商業目標。

不少機構會參考 WCAG 2.2 的原則，即內容應可感知、可操作、可理解及具相容性。不過，實際採用哪一級標準、是否涉及特定採購或合規要求，仍要視乎行業、服務對象、組織性質及網站功能而定。醫療、教育、金融、NGO 與公共服務相關平台，通常更需要在立項初期作出規劃，而不是在網站完成後才補救。

網站無障礙設計入門指南：先檢查四個高影響位置

若資源有限，企業不必一開始便重做全站。應先從最常被使用、最直接影響查詢或交易的頁面開始，例如首頁、服務頁、產品頁、聯絡頁、登入區及付款流程。以下四個位置，往往最值得優先處理。

文字、結構與替代文字

網頁標題不應只是把字放大或加粗，而要使用正確的標題層級。主題、段落與小節有清楚結構，螢幕閱讀器使用者才能快速理解頁面內容，也有助搜尋器判讀網站主題。

圖片則需要按用途提供適當文字說明。展示產品細節、流程圖、活動資訊或按鈕功能的圖片，應有具體替代文字，例如「藍色保濕精華 30ml」或「預約免費網站諮詢」。純裝飾圖片未必需要描述，否則反而增加閱讀負擔。重點不在於為每張圖堆砌關鍵字，而是讓看不到圖片的人仍能理解其用途。

色彩、字級與互動狀態

品牌色可以鮮明，但不能只靠紅、綠或任何單一色彩傳遞資訊。例如表單錯誤訊息若只把欄位變紅，色覺辨識有困難的使用者未必知道問題在哪裡。較好的做法是同時加入文字提示、圖示及清楚的欄位說明。

文字與背景應有足夠對比，按鈕、連結及輸入欄位亦要容易辨認。許多企業網站在桌面版看似精緻，到了手機卻因淺灰字、細字體或背景圖片而難以閱讀。RWD 響應式設計不只是畫面縮放，亦要重新檢查閱讀距離、按鈕大小、行距與內容優先次序。

鍵盤操作與導覽順序

不是每位訪客都使用滑鼠。網站上的主選單、彈出視窗、輪播圖、篩選器、日期選擇器及表單，都應能以 Tab、Enter 和方向鍵完成基本操作。使用者按 Tab 時，焦點位置必須清晰可見，不能「跳失」在畫面外，也不能被彈出視窗困住。

這類問題在套用現成主題、第三方外掛或複雜動畫時特別常見。視覺效果愈多，不代表體驗愈好。對以取得報價、填寫查詢或網上付款為目標的企業網站而言，穩定、直接和可預期的操作流程，通常比炫目的互動更能帶來成果。

表單、錯誤提示與交易流程

聯絡表單是很多企業最重要的轉換入口，但也最容易出現障礙。每個輸入欄位都應有清楚標籤，不能只使用欄位內的淡色提示文字。必填項目、格式要求及私隱同意內容要在送出前說明；若填寫出錯，系統應指出哪一欄有問題及如何修正。

若網站設有網店、會員登入或預約功能，更要測試付款頁、驗證碼、優惠碼和確認訊息。安全措施不可省略，但流程不宜令客戶反覆輸入資料或無法理解下一步。安全、便利與無障礙之間需要平衡，最佳做法是由設計、開發與營運團隊一同檢視，而非只由其中一方決定。

影音、多語言內容也要納入規劃

香港企業常同時使用繁體中文、英文，甚至簡體中文內容。多語言網站不只是把文字翻譯完成，亦要正確設定每個頁面的語言，讓閱讀工具以合適的方式發音。中文與英文混排時，標題、按鈕和表單欄位更要避免語意含糊，例如只寫「Submit」或「Click Here」，會令使用者難以判斷操作結果。

影片應盡量提供字幕；若內容主要依靠畫面展示，例如教學步驟、產品操作或數據圖表，便應補充旁白、文字稿或摘要。直播、訪談和宣傳短片的處理深度可按預算與使用情境決定，但關鍵服務資訊不應只放在影片內。否則使用者、搜尋器及日後負責更新內容的同事，都難以快速取得資訊。

不要把無障礙當成上線前的檢查表

最常見的做法，是網站完成後才以自動化工具掃描，再集中修正錯誤。工具確實有用，能協助找出缺少替代文字、標題結構不合理或對比不足等問題，但它無法完全判斷內容是否容易理解、鍵盤流程是否合理，或錯誤提示是否真正有幫助。

較有效的流程，是在網站策劃階段便定好內容架構與主要使用者任務，於設計稿檢查色彩及元件狀態，開發時使用具語意的程式結構，上線前再以鍵盤、手機及螢幕閱讀工具進行實測。網站交付後，CMS 後台也應讓同事能正確加入標題、圖片說明和連結文字，否則初期做得再好，內容持續更新後仍可能失去一致性。

對中小企來說，未必需要一次過處理所有舊文章和歷史圖片。可先為新頁面建立內容規範，再按流量、商業價值及投訴情況逐步改善舊內容。這樣較符合預算，也能讓改善工作與網站營運同步進行。

把可用性轉化為長期的品牌資產

網站無障礙設計並非單一設計功能，而是企業對客戶服務標準的延伸。一個容易閱讀、容易操作、資訊清晰而且在不同裝置上穩定運作的網站，會令客戶感到企業做事周全，也降低因操作受阻而流失詢盤的機會。

若企業正計劃建立新網站、重整品牌網站或加入網店與預約功能，最合適的時機不是上線前一星期，而是功能規劃剛開始的時候。先把使用者能否順利完成目標放在設計決策之前，日後無論擴充內容、加入多語言，還是提升搜尋能見度，都會有更穩固的基礎。