無障礙網站工具


無障礙是一種為了一些行動不便的人士所設計的規範,照著這些規範處理網站,就可以讓這些人可以靠自己上網瀏覽網頁並取得資訊,這篇先介紹一下工具如何使用。

首先是台灣負責處理這塊地協會網站
https://accessibility.moda.gov.tw/

除了可以在這邊查詢到規範與教學以外,也可以在這邊申請標章的審核,取得以後可以拿到一個標章認證的連結可以放在網站上。

規範教學的講義連結
https://accessibility.moda.gov.tw/Lectures

工具

Freego:
最基本的檢測工具,用來掃瞄並產生網站的報告檔案,如果要申請標章的話必須使用的工具
注意這工具進行的掃描並沒有包含全部規範,還是有需要手動確認的部分。
https://accessibility.moda.gov.tw/Download 在下載專區中下載最新版本,目前是網站無障礙規範(110.07)

Freego畫面如下
Freego
只要設定網址和等級就可以開始掃描,其他還有使用的瀏覽器等等可以設定。

掃描完後如果有錯誤,可以點兩下錯誤的行會跳出詳細的問題,同時也可以進行單頁的重新掃描。
Freego

全部頁面通過後就可以產生用來申請標章的報告檔案
Freego

Wave:
可以檢查出畫面問題的工具,不少freego無法檢查的部分可以用這個補助,個人認為這兩個合用就差不多了,剩下就是自己注意一下什麼標籤該加上去等等。
這個工具用瀏覽器附加元件的方式存在
https://wave.webaim.org/extension/
安裝並啟動就可以看到那些有問題的部分(會標出紅/黃圖示),在側邊則會寫出是什麼問題,唯一的缺點就是目前只有英文介面。

其他的工具已經很久沒用了,只在下方列出
顏色補助https://color.review/
檢查工具https://github.com/veler/DevToys
官方教學與推薦工具https://accessibility.moda.gov.tw/Accessible/Category/3/1

Tags : html 無障礙網站