使您的扩展程序可供访问

对于许多用户而言,无障碍功能实际上就是界面;对于那些不将无障碍功能用作与您的扩展程序互动的主要方式的用户,无障碍功能往往非常实用。方法多种多样。至少,文字应具有高对比度。视频应带有字幕。图片应包含 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>

有关实现这些技术及其他方法的说明,请参阅支持无障碍功能