AA級無障礙網站 — part 1
簡介
何謂無障礙網站🤔
無障礙網站（Web Accessibility）是一個建置網站都需要注意的主題，簡單來說，就是一個賦予網站更好的操作環境，來使更多人可以瀏覽網站。
『更多人瀏覽我們的網站！』聽起來可不是棒呆了嗎？身為前端工程師，其中一項任務，就是讓網站的到訪率、曝光率提升，而所謂「無障礙網站」是在這設計上，更把殘疾人士所遇到的問題放到實作上，目的非常簡單——讓他們也可以和我們一樣瀏覽網站，舉例來說，像是手腳有殘疾的人士，無法使用滑鼠點擊，因此可以透過其他的裝置瀏覽網站；或是試著想想視力有殘疾，他們可以使用特殊裝置來瀏覽網站，像是語音朗讀的方式來「聽」網站。
簡單來說，是讓「所有人」，都用同等的方式對待，給「所有人」有相同的機會瀏覽網站。
為何要探討無障礙🧐
儘管我們生而不同，但我們都是人，因此，我們都擁有相同的人權
作為前端工程，除了網站基本的建置，更需要思考如何讓更多人瀏覽網站，只要透過用一些簡單的方法，注重一些細節，可以讓這世界知道我們對每個人的關心與注重。要實作無障礙網站簡單來說，其實講簡單點，就是增加網站HTML的一些內容，例如：<img src=”w3c_logo.png” alt=”這是w3c網站的logo”>，加入了 alt 這樣的替代文字，所以視覺障礙人士可以透過螢幕閱讀器來朗讀這張圖片，讓他們了解這部分的內容。
在MDN的無障礙網站簡介中，把身心障礙者族群做了詳細的解釋，也同時指出他們再上網時所需要的工具，另外其中一項重點，出這個議題注重的本質
不要光用自己使用電腦和 web 的角度去思考這件事：你並不是無障礙網頁的用戶
從「視覺障礙」、「聽覺障礙」到「行動障礙」，甚至到「認知障礙」族群，都是身為軟體工程師所需要考慮的要點，看MDN針對這些族群在上網時所需要使用的工具，讓我更了解在製作網站時，考慮的範圍需要更廣，也需要站在其他人的角度來建構網站
無障礙網站規則🧾
台灣目前的無障礙網路空間，目前規定以參照WCAG所制定，其中包含了「4原則12指引3等級66成功準則」，落落長的準則乍看之下我也是暈了陣子，對可能剛開始熟悉這樣領域的人慌亂，但其實把握基本的原則，從較高的層次去看，只要專注基本的要求，把握原則，我們都可以製作出一個高品質且友善的無障礙網站。
需要把握的基本原理，其實就是下面四點
🖍 可感知：對「所有人」，網站的元件（或是說網站的內容），都需要可以被使用者察覺。像是加入圖片的註解（alt），所以像是「視障人士」可以透過朗讀機知道圖片所要表達的含義、或是在影片檔上面加入字幕，讓「聽障」人是可以知道影片所要傳達的內容。
🖍 可操作：試著站在「行動障礙」的人是來看網站，他們是無法使用滑鼠做出精確的動作，那他們要透過其他輔助工具來瀏覽，引此網站的需要點擊元素，就不能限定只能使用滑鼠才可以操作。簡單的例子，就在網站上按按看tab，對於每個可點擊元素都可以依序對焦。
🖍 可理解：網站的內容和操作介面，必須要讓使用者理解，舉例來說，在網站的表單，在填寫後按下送出按鈕，需要對錯誤的欄位做進一步解釋，讓使用者了解需要更改的地方，讓網站所要執行的機制更加完整，讓使用者理解網站。
🖍 穩健性：關於穩健性原則，除了對網站標準的規範（例如W3C的規則）有一定程度的瞭解，也要對科技與網站相容性保持敏銳的心，甚至還需要做到身障人士所使用的輔助工具有所了解。
無障礙網站已經成為趨勢，想在舊有的專案加入無障礙，也不用需要整個打掉重練，我建議可以先從圖片是否加入alt等註解下手（可感知），接著再嘗試不使用滑鼠，看是不是可以對焦到每個需要的元素（可操作），在網站的所有按鈕上，問問其他人，他們預期按下按鈕所預期的動作（可理解），最後，針對W3C所需要提供的資訊，最基本的 HTML tag 檢查有沒有加上 !DOCTYPE （穩健性）。從這些地方開始著手，從這樣的更改，讓自己知道在實作網站時，還需要注意哪些項目，在開始實作新的專案，就可以不自覺得把「無障礙網站」實作出來囉！
希望透過這樣簡單的敘述，讓我們開始對無障礙網站有更深一層的認識！🎉
我們將在之後的篇章，針對台灣的無障礙網站分級做討論，並針對的「AA級無障礙」所要注重的項目和方法做分享。
