打造無障礙擴充功能

對於許多使用者來說，無障礙工具本質上就是使用者介面，而其相關功能通常對於不需要無障礙功能做為主要互動方式的使用者也很有用。這些技術的功能各不相同，文字應至少採用高對比度請為影片加上字幕。圖片應包含 alt 屬性。

但如同剛才說的，這只是最小值。其他技術將在下文說明。

實作無障礙功能有幾種方法，但最簡單的方法是使用標準 HTML 控制項，特別是輸入元素。下圖顯示這些控制項。

如要讓其他元素可供存取，請使用 ARIA 屬性。這些屬性可為螢幕閱讀器提供有關網頁中功能及目前控制項狀態的資訊。我們來看個例子

<div role="toolbar" tabindex="0" aria-activedescendant="button1">
  <img src="buttoncut.png" role="button" alt="cut" id="button1">
  <img src="buttoncopy.png" role="button" alt="copy" id="button2">
  <img src="buttonpaste.png" role="button" alt="paste" id="button3">
</div>

根據預設，在 HTML DOM 中，唯一可以接收鍵盤焦點的元素是錨定標記、按鈕和表單控制項。幸好，在 HTML 元素上設定 tabIndex 屬性，可讓該元素接收鍵盤焦點。例如：

<div tabindex="0">I can receive focus with the tab key.</div>

如需這些技術和其他功能的實作操作說明，請參閱支援無障礙功能。