ARIA是什么？

ARIA是W3C的?Web無障礙推進組織發布的可訪問富互聯網應用實現指南。WAI-ARIA是一個為殘疾人士等提供無障礙訪問動態、可交互Web內容的技術規范。是Web Accessibility Initiative - Accessible

Rich Internet Applications 的縮寫，WAI-ARIA是指無障礙的網頁應用技術。

主要針對的是視覺缺陷，失聰，行動不便的殘疾人以及假裝殘疾的測試人員。尤其像盲人，眼睛看不到，其瀏覽網頁則需要借助輔助設備，如屏幕閱讀器，屏幕閱讀機可以大聲朗讀或者輸出盲文。

而ARIA就是可以讓屏幕閱讀器準確識別網頁中的內容，變化，狀態的技術規范，可以讓盲人這類用戶也能無障礙閱讀！

• ARIA是W3C的一個獨立規范，幫助Web應用程序和Web頁面變得更具可訪問性

• ARIA主要是為了提升網頁的可用性，網頁對殘疾人士的無障礙化

• HTML5已經開始使用ARIA，并且W3C發布的很多其他標準也開始使用ARIA

• ARIA 是對 HTML 語義化的補充。它具備比現有的 HTML 元素和屬性更完善的表達能力，并讓你頁面中元素的關系和含義更明確

• ARIA 是一組特殊的易用性屬性，可以添加到任意標簽上，尤其適用于 HTML。

• ARIA 規范為瀏覽器和解析 HTML 文檔的輔助性技術提供了一種可以讓人們以多種方式訪問和使用 Web 的標準方法

為什么需要ARIA？

回答標題問題前我先問其他幾個問題？

• 如何讓盲人用戶知道當前瀏覽區域就是網站主導航？

• 如果讓盲人用戶知道點擊某個按鈕后出來的是彈框？

• 如何讓盲人用戶知道點擊某個按鈕后頁面另外一個區域的文字發生了變化？

• 如何讓盲人用戶知道您使用了li標簽是用來模擬標準select控件呢？

• 如何讓盲人用戶知道您模擬的select控件是單選呢還是可以多選呢？

在你現有的知識范圍內，您有辦法解決上面的問題嗎？有人會說，我使用HTML5, 恩，確實，HTML5的出現大大增強了網頁的可訪問性和無障礙閱讀，但是，其不是萬能的，例如無法讓盲人知道模擬控件的類型等。

因此，才需要ARIA.

ARIA是個是非主流？

ARIA是非主流嗎？ARIA規范一直在更新維護，瀏覽器方面IE8+以及其他所有現代瀏覽器都都已支持ARIA, 幾乎可以說是全方位支持。流行的JavaScript庫jQuery, 以及衍生的jQuery Mobile早早支持了ARIA

京東首頁

淘寶首頁

案例一：

案例二：

這可是標準的選項卡ARIA屬性應用（該用的屬性都有），OK，對于常用的選項卡，就套用淘寶網這里的結構吧，很標準的。就是增加幾個role屬性，增加幾個aria-屬性就可以了

ARIA組成部分

應用于HTML的ARIA有兩部分組成：?**role**?（角色）和帶?**aria-**?前綴的屬性，其作用：

• role (角色)標識了一個元素的作用, 其實就是描述一個非標準的tag的實際作用，比如用div做button，那么設置div 的 role="button"，輔助工具就可以認出這實際上是個button。

• aria-?屬性描述了與之有關的事物（特征）及其是什么樣的（狀態）HTML中的ARIA，其實就是描述這個tag在可視化的情境中的具體信息

?

轉載于:https://www.cnblogs.com/kunmomo/p/11557553.html

總結

以上是生活随笔為你收集整理的无障碍开发（一）之初认识的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。