跳到主要內容
[教學]無障礙網頁編輯

校網無障礙網站 (AA等級) 編輯規範

💡政策說明與參考資源

國家通訊傳播委員會(NCC)函文通知,各級學校網站新設或改版時,應依「網站無障礙規範 2.0 版」檢測 等級AA以上 進行設計。

(一) 檔案格式

  1. 刊登在網頁上的檔案必須轉換成 開放文件格式 (ODF)可攜式文件 (PDF)
  2. 可編輯檔案:請另存為 .odt (文件)、.ods (試算表) 或 .odp (簡報)。
  3. 僅供瀏覽檔案:請另存為 .pdf 檔案再公告。
ODF檔案格式示意圖

【圖示:常見的 ODF 開放文件格式】

(二) 網址連結

網頁超連結不可僅顯示網址,必須加上 標題文字,讓視障者透過語音合成器讀出連結意義。

  • 正確範例: 教育部 (另開新視窗) (滑鼠移入會顯示完整標題)
  • 錯誤範例: http://www.edu.tw 或僅寫「點擊連結」。

設定步驟:

  1. 選取文字建立連結後,點擊「進階」。
  2. 於「標題」欄位輸入描述,例如:教育部 (另開新視窗)
超連結加標題設定步驟

(三) 圖片替代文字

所有圖片皆須設定 替代文字 (Alt Text),讓無法看見圖片的使用者能理解圖片內容。

  • 一般圖片:輸入具體描述,例如「校徽」、「運動會大合照」。
  • 裝飾用小圖/分隔線:替代文字可輸入 * 號。
圖片替代文字設定介面

(四) 純文字貼上

請勿 將 Word 或 Excel 內容直接複製貼上,會產生大量雜亂代碼。

  1. 點擊編輯器上的 貼為純文字格式 按鈕。
  2. 將內容貼入彈出視窗後再按確定。
純文字貼上按鈕示意圖

(五) 表格設定表頭

為了讓視障者清晰理解表格結構,表格必須設定 表頭 (Headers)摘要 (Summary/Caption)

範例:育成高中班級數
年級別班級數
一年級19
二年級19
三年級19

(設定方式:在表格屬性中設定「第一列為標題」)

(六) 影片與聲音

嵌入影片或聲音檔案時,如同圖片,必須提供對應的替代文字說明。

(七) 顏色對比度

文字顏色與背景顏色的對比值至少 要大於 4.5 : 1,以確保清晰可讀。

範例 1:黃底黑字 (清晰)
範例 2:藍底白字 (清晰)
顏色對比度測試結果

消息公佈欄

時間類別單位標題發佈點閱
跳至網頁頂部