Mozilla在Firefox內建無障礙網頁檢測工具

無障礙設計是可以讓更多人存取網站的實際作為，從Firefox 61開始內建無障礙網頁檢測工具（Accessibility Inspector），幫助開發者製作出視覺障礙人士友善的網頁，這項功能在開發工具DevTools中是預設關閉的，開發者需要手動啟用，啟用後在DevTools的上下文選單也將會出現更多選項等其他額外功能。

無障礙目的在於盡可能避免因為使用者因為生理上的障礙，或是裝置、網路速度以及地理位置等外在情況，而被排除在存取網站之外。無障礙網頁檢測工具最主要的功能，便是協助開發向視障人士公開網頁資訊的功能。網頁瀏覽器的無障礙API可以揭示頁面上各種元素的功能資訊，像是文字、按鈕、連結或是表格等元素。而語意DOM元素的角色（Role）則預設暗示了這些元素的功能，但例如<div>等非語意標籤並沒有預設角色，則需要進行額外設定。

瀏覽器無障礙API會將這些角色與資訊以階層式的架構表現，這個結構被稱為無障礙樹（Accessibility Tree），形式跟DOM樹很像，只是有許多元素的限制以及紀錄不同的資訊，螢幕閱讀器輔助技術需要使用這項資訊，來告訴用戶頁面上的內容，並且使他們能與頁面互動。而Firefox的無障礙網頁檢測工具也同樣使用這個資訊，在DevTools上提供無障礙除錯的功能。

DevTools上的無障礙面板介面很簡單，主要分為兩部分，一半會以樹狀圖顯示現在網頁上的無障礙樹，開發者可以透過點擊箭頭來展開所有的子項目，以檢視這些元素是否存在正確的值。每個項目都有兩個屬性，分別是角色與名稱，角色通常指的是頁面上的元素的功能，諸如按鈕或是頁腳等，可以是瀏覽器預設也可以是使用者自訂的。而名稱則是該元素在頁面上的名字。面板的另一部分則是當前所選項目的更多詳細資訊，除了角色與名稱外，還會顯示值、DOMNode、描述或是屬性等。

Mozilla提到，從Firefox 61開始預設內建無障礙網頁檢測工具，但由於對於瀏覽器效能有負面影響，因此功能預設關閉，開發者需要自行到DevTools中啟用。而在啟用無障礙網頁檢測工具之後，Firefox中的上下文選單的選項會增加，開發者可以直接在網頁上點選右鍵檢視無障礙屬性，而且在無障礙頁籤中，當滑鼠游標停在無障礙物件上，將會在頁面上對應的物件上高亮度提示。