所有关于 WEB 可访问性
所有关于 WEB 可访问性
在深入研究 Web 可访问性之前,让我们先了解一下什么是可访问性。当遇到“可访问性”这个词时,我们首先想到的是无论任何条件都可以轻松访问任何东西。
维基百科说, 可访问性 是产品、设备、服务、车辆或环境的设计,以便残障人士可以使用。
什么是网络可访问性
网页无障碍 是每个人都可以轻松访问网络和互联网的方式。 “每个人”是指所有个人,包括那些有认知或身体残疾或限制的人。
简单来说,我们可以说,Web 可访问性意味着“有任何残疾或限制的人都可以使用 Web”。
为什么网络可访问性很重要
1 七个人中有一些残疾会妨碍他们在浏览网页时的体验。那是 ** 1,300,000,000** 人们。 这个数字很大!
因此,无论任何情况,让每个人都可以访问网站非常重要。
网络在教育、就业、医疗保健、商业等生活的许多方面都发挥着重要作用。至关重要的是,每个人都可以访问网站,以提供平等的机会。
Web 可访问性提高了市场范围,也改善了整体用户体验。因此,它可以对业务产生重大影响并有助于整体增长。
Web 可访问性还使搜索引擎更容易索引内容。
Web 内容可访问性指南 (WCAG)
Web 内容可访问性指南 (WCAG) 2 是通过 W3C流程 与世界各地的个人和组织合作,旨在为满足国际个人、组织和政府需求的 Web 内容可访问性提供单一共享标准。
WCAG 有助于了解如何使残障人士或有限制的人更容易访问网络。
WCAG 技术文件由无障碍指南工作组制定( 工作组 ) (以前的 Web 内容可访问性指南工作组) , 它是万维网联盟的一部分 ( W3C ) 无障碍网页倡议 ( 水 )。
Web 内容可访问性指南根据 FOR 原则 :
1. 可感知
2.可操作
3. 可以理解
4. 坚固。
这些指南的符合性分为三个级别:
- A级: 这是最低的一致性级别。
- AA 级: AA 级包括所有 A 级和 AA 级要求。许多组织都努力达到 AA 级。
- AAA 级: AAA 级包括所有 A、AA 和 AAA 级要求。
如何使网站可访问
让残疾人可以访问网站将使每个人都可以访问。现在让我们看看让每个人都可以访问网站的 10 种方法。
1. 颜色
色盲的人以不同的方式解释颜色。色盲分为三种主要类型。
- Protanopia(红色盲):人们难以区分红色
- Deuteranopia(绿色盲):人们难以区分绿色
- Tritanopia(蓝色盲):人们难以区分蓝色
因此,颜色与背景的对比度应符合 WCAG2 标准,这一点非常重要。
2. 图像的替代文本
图像、视频和信息图表等网站上的非文本内容也应该以文本格式提供,以便残障人士可以访问。 一个 **lt**
标签 或替代 (alt) html 属性可用于描述图像。建议编写更好的描述,以便屏幕阅读器用户能够理解。
<img src ="image-location" alt="图片说明" />
3. 键盘导航
残疾人完全依赖键盘。由于身体残疾,他们不能使用鼠标。在这种情况下,他们更喜欢使用键盘快捷键或箭头键访问内容。因此,重要的是您的内容以键盘为中心,这意味着网络上的所有内容都应该可以使用唯一的键盘访问。
4.媒体的隐藏式字幕
音频/视频内容应有相应的文字记录,以便残疾人可以访问内容。对于想要在嘈杂或受限区域消费内容的人也将有所帮助。文本记录还将使搜索引擎更容易索引内容。
5. 标题
标题在确定内容的上下文方面起着非常重要的作用。应该有一个小而描述性的标题来说明内容的内容。 Web 浏览器和插件也使用标题来促进页面内导航。根据重要性使用标题标签很重要,即。 h1 标记为最重要,h6 标记为最不重要。
6.使用语义HTML标签
残障用户使用屏幕阅读器阅读内容。语义标签有助于理解网页的基本布局。乱用 HTML 标签会混淆屏幕阅读器,因此使用特定标签非常重要。
7. 无障碍表格
表单在视觉和认知上可能很复杂,并且使用起来具有挑战性。无障碍表格更易于所有人使用,包括残障人士。
- 使用语音输入的人 可以通过语音命令使用标签更好地理解表单,以激活控件并将焦点移动到需要完成的其他字段。
- 使用屏幕阅读器的人 可以更轻松地识别和理解表单控件,因为它们与标签、字段集和其他结构元素相关联。
8.禁用自动媒体
无法访问自动媒体。对于无法访问媒体文件并且可能难以关闭自动媒体的人来说,这可能会很烦人。如果网络中有任何媒体文件,那么禁用自动播放功能并授予用户访问媒体的权限非常重要。
9. 使用 Aria 标签
可访问的富 Internet 应用程序 (咏叹调) 是一组简单的 HTML 属性,可以添加到任何标记中,这些标记定义了使残障人士更容易访问 Web 内容和 Web 应用程序的方法。这 角色
属性定义了特定的角色,如文章、按钮、警报。 Aria 属性还提供对象的描述,也可用于指定对象(如按钮)的活动或禁用状态。
<div id="percent-loaded" role="progress-bar" aria-valuenow="90"
aria-valuemin="0" aria-valuemax="100">
</div>
10.正确使用表格
没有适当结构标记的表格很难区分标题和数据单元格,这会造成可访问性障碍。还可以利用 标题
标记以提供标题,以便屏幕阅读器可以正确理解它,而不是为表格提供标题。这 范围
element 还可以帮助屏幕阅读器识别单元格是否是行、列或行或列组的标题。
<table>
<caption>重要事件</caption>
<tr>
<th scope="col">日期</th>
<th scope="col">事件</th>
</tr>
<tr>
<td scope="row">6月21日</td>
<td>我的生日</td>
</tr>
<tr>
<td scope="row">12 月 25 日</td>
<td>圣诞节</td>
</tr>
</table>
结论
通过网络或互联网访问每个人的内容非常重要。了解残疾人的问题,然后创建每个人都可以使用的可行解决方案,这将有助于通过每个人都可以使用的强大解决方案来迎合整个市场。
我这边就是这样。我尽力让它尽可能简单。我希望这可以帮到你。如果有任何改进博客的建议,请随时提出。
随时与我联系!
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明