mirror of
https://github.com/LCTT/TranslateProject.git
synced 2024-12-23 21:20:42 +08:00
76 lines
4.7 KiB
Markdown
76 lines
4.7 KiB
Markdown
[#]: subject: "7 open source modules to make your website accessible"
|
||
[#]: via: "https://opensource.com/article/23/4/drupal-modules-website-accessibility"
|
||
[#]: author: "Neeraj Kumar https://opensource.com/users/neerajskydiver"
|
||
[#]: collector: "lkxed"
|
||
[#]: translator: "geekpi"
|
||
[#]: reviewer: "wxy"
|
||
[#]: publisher: "wxy"
|
||
[#]: url: "https://linux.cn/article-15767-1.html"
|
||
|
||
7 个使你的 Drupal 网站无障碍访问的开源模块
|
||
======
|
||
|
||
![][0]
|
||
|
||
> 使用这些 Drupal 模块，使你的网站对每个人都可以无障碍访问。
|
||
|
||
随着网站的 <ruby>无障碍访问<rt>accessibility</rt></ruby> 继续成为人们日益关注的问题，网站所有者和开发人员需要确保他们的网站符合[美国残疾人法案][1]（ADA）。Drupal 是一种流行的开源内容管理系统（CMS），它提供各种工具和模块以确保所有用户都可以访问你的网站，而无论他们的能力如何。本文讨论了网站无障碍访问的重要性、ADA 合规性的基本要求，以及 [Drupal][2] 如何帮助你实现合规性。
|
||
|
||
### 为什么网站无障碍访问很重要
|
||
|
||
出于多种原因，网站无障碍访问很重要。首先，它确保残障人士可以访问和使用你的网站。这包括有视觉、听觉、身体和认知障碍的人。通过使你的网站可以无障碍访问，你不仅遵守了法律，而且还为所有用户提供了更好的体验。
|
||
|
||
此外，网站无障碍访问可以改善你网站的搜索引擎优化（SEO）并提高网站的可用性。搜索引擎优先考虑无障碍的网站，如果易于使用，用户更有可能在你的网站上停留更长时间并与你互动。
|
||
|
||
### ADA 合规性的基本要求
|
||
|
||
ADA 要求所有网站和数字内容都可供残障人士访问。ADA 合规性的一些基本要求包括：
|
||
|
||
- 为所有图像和非文本内容提供替代文本描述。
|
||
- 确保所有视频都有字幕和文字说明。
|
||
- 使用颜色对比和其他设计元素使你的网站更具可读性。
|
||
- 提供访问内容的替代方式，例如音频描述和键盘导航。
|
||
- 确保你的网站与辅助技术兼容，例如屏幕阅读器和盲文显示器。
|
||
|
||
### Drupal 如何帮助你实现合规性
|
||
|
||
Drupal 提供各种工具和模块来帮助你实现网站的无障碍和 ADA 合规性。以下是我认为最有用的七个：
|
||
|
||
- [无障碍访问检查器][3]：扫描你的网站以查找常见的无障碍访问问题并提出改进建议。
|
||
- [颜色对比分析器][4]：分析你网站的颜色对比度并做出改变以提高可读性。
|
||
- [块元素 ARIA 地标角色][5]：增强 WAI-ARIA 在站点标记中的使用。此模块允许你通过块配置表单将 ARIA 地标角色和/或 ARIA 标签直接分配给站点布局中的每个块元素。
|
||
- [Civic 无障碍访问工具栏][6]：提供辅助工具以帮助残障用户浏览网站并与之交互。
|
||
- [htmLawed][7]：通过限制和净化 HTML 确保符合 Web 标准和管理策略。
|
||
- [调整文本大小][8]：通过在页面上显示可调整的文本大小更改器或缩放功能来增强 Web 无障碍。
|
||
- [自动替代文本][9]：利用 [微软 Azure Cognitive Services API][10] 在没有替代文本时创建图像标题。
|
||
|
||
### 总结
|
||
|
||
出于法律原因和为所有用户提供更好的用户体验，确保网站无障碍访问和 ADA 合规性非常重要。从无障碍访问检查器到颜色对比分析器，Drupal 提供了多种方法来确保你的网站符合 ADA 标准。使用 Drupal 的工具和模块，你可以让每个人都可以访问你的网站，无论他们的能力如何，并提供更好的用户体验。
|
||
|
||
*（题图：MJ/accessibility illustration in high resolution, very detailed, 8k）*
|
||
|
||
--------------------------------------------------------------------------------
|
||
|
||
via: https://opensource.com/article/23/4/drupal-modules-website-accessibility
|
||
|
||
作者：[Neeraj Kumar][a]
|
||
选题：[lkxed][b]
|
||
译者：[geekpi](https://github.com/geekpi)
|
||
校对：[wxy](https://github.com/wxy)
|
||
|
||
本文由 [LCTT](https://github.com/LCTT/TranslateProject) 原创编译，[Linux中国](https://linux.cn/) 荣誉推出
|
||
|
||
[a]: https://opensource.com/users/neerajskydiver
|
||
[b]: https://github.com/lkxed/
|
||
[1]: https://www.dol.gov/general/topic/disability/ada
|
||
[2]: https://opensource.com/article/23/3/create-accessible-websites-drupal
|
||
[3]: https://www.drupal.org/project/editoria11y
|
||
[4]: https://www.drupal.org/project/high_contrast
|
||
[5]: https://www.drupal.org/project/block_aria_landmark_roles
|
||
[6]: https://www.drupal.org/project/civic_accessibility_toolbar
|
||
[7]: https://www.drupal.org/project/htmlawed
|
||
[8]: https://www.drupal.org/project/textsize
|
||
[9]: https://www.drupal.org/project/auto_alter
|
||
[10]: https://www.microsoft.com/cognitive-services
|
||
[0]: https://img.linux.net.cn/data/attachment/album/202304/30/162337kdiekuzchl2cx2m1.png |