导言
现在，很多人都在讨论无障碍设备的问题，就是为了让所有人都能方便地使用设备，包括视力不好的人、听力不好的人、肢体不便的人。在传统的设备开发中，我们往往只考虑到正常人的需求，但现在你应该学会如何开发无障碍设备。
困难
在设计无障碍设备的时候，我们会遇到许多困难，其中有以下几个方面：
视觉
人类有不同的视力，皆不同程度地受有不同种类和严重程度的视觉障碍影响，因此我们需要为不同程度视力障碍的人考虑。这就要求我们需要增加对屏幕阅读器和放大镜工具的支持，在设计UI界面的时候要避免过度滥用图像，保证文字清晰易读，并且使用高对比度的颜色方案。
听觉
同样地，人类有不同的听力，因此我们需要同时支持口头交流和文字交流两种方式。我们除了提供可访问的音量调节功能，还要设计易读的字幕和屏幕阅读器，支持语音识别/Siri等功能，提供音频传输提醒等。
肢体
肢体障碍会影响人的掌握设备和使用设备的能力。在设计无障碍设备时，我们需要考虑加强键盘和鼠标输入的支持，同时避免设计缺乏反馈、点击区域过小、无法使用的设备控件。
心智
心智障碍难以测量和描述。因此，我们需要在UI设计中考虑大纲和角色模型；对于运动和学习方面的发展，我们需要提供简单的可视化选项和连续指导。
突破
面对这些困难，我们可以通过以下方法来取得突破。
辅助技术
我们可以使用辅助技术来为无障碍设备的实施做准备，例如：
- 鼠标和键盘的辅助技术
- 计算机屏幕放大镜和缩小器
- 屏幕阅读器
- 文字转语音和语音转文字识别器
在设计过程中应当为这些辅助技术提供所需代码和功能。
JavaScript技术
我们可以使用JavaScript技术来实现对被障碍人群所需的有用的功能，例如：
- 支持键盘快捷键的web应用
- 区间导航连接到想要访问的页面元素
- 确定设备是否可见以扩展帮助和改变交互方式
无障碍HTML元素
HTML元素应包含适当的属性，例如：
- 控件的适当标题
- 为图像元素提供明确的格式说明 (alt 属性)
- 为表格表单提供标题、说明等元素
我们的代码示例：
-- -------------------- ---- ------- ------ ------ --------------------------- ------ ----------- ------------- ------------------------ ------ -------------------------- ------ --------------- ------------- ------------------------ ------ ------------- ----------- -------
label元素的'for'属性应该跟绑定的input元素的'id'属性一致，这有助于屏幕阅读器在访问我们的表单时提供更好的体验。
<img src="avatar.png" alt="头像">
这是一个图像，使用了 'alt' 属性使其即使在无法翻译为图像的情况下也能呈现。
结语
无障碍设备开发是一个全面的过程，需要我们从多个方面考虑。我们需要提供UI设计、可访问性、辅助技术、JavaScript与无障碍HTML元素四个方面的支持，同时尽可能保证用户体验。希望本文对你有所作为。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67823200935627c900fc2069
