购物车图标
10月20日

您的网站是否可访问?走向包容的14个步骤

采取积极主动的方法,创建一个更加同情的网站并观察您的观众成长。

经过
Tsvetelina Miteva.
听这篇文章

当最初创建网络时,它意味着提供对信息的平等访问,并将所有人删除对每个人的沟通障碍。然而,今天,超过十亿人的残疾人(关于占世界人口的15%).随着全球老龄化和医疗技术的进步,疾病或受伤人群的寿命不断延长,这一差距只会越来越大。

那么你能做什么呢?


从认识到问题开始

的一些最常见的障碍影响人们使用网络方式的因素包括:

  • 视觉
  • 听力
  • 神经学
  • 身体的
  • 精神的

对一些人来说,有特殊的辅助技术帮助他们浏览网页。例如,盲人经常使用屏幕阅读器:将显示文本转换为合成语音或可刷新的盲文的技术。有运动障碍的人可以使用吸痰系统,这是一种类似于操纵杆的工具,但需要用呼吸来控制。它们能识别小口或噗噗声,并将其转换为鼠标点击或键盘字符。

“网络访问”是一个总称,包括“网站、工具和技术的设计和开发,使残疾人可以感知、理解、浏览、与网络互动,并为之做出贡献。”尽管如此,无障碍网页也有利于没有残疾的人:

  • 适用于手机、智能手表、智能电视和其他小屏幕或不同输入模式的设备。
  • 有暂时性残疾的人,如手臂骨折或眼镜丢失。
  • 有情境限制的人——那些在明亮的阳光下或不允许播放音频的环境下的人。
  • 人们慢,有限,甚至昂贵的带宽连接。


为什么地址可访问性?

在使互联网成为平等机会的地方,使您的网站可以访问许多实际好处。

•易用性提高了品牌话语权

现在比以往任何时候都更重要,重要的是要纳入括号。拥有无障碍网站告诉世界您要注意到所有客户和荣誉最佳实践。这使得客户可以更具吸引力支持和推荐您。

•易用性扩展了市场拓展

残疾人是一个被忽视的市场的一部分,但这并不是一个利基市场。把一部分消费者排除在外的设计将无法充分发挥其市场潜力。残疾人往往得不到足够的服务,或者被企业误解。但在易用性功能的帮助下,他们中的许多人很可能成为忠实用户或客户。

•可访问性最大限度地减少了法律风险

在许多国家,如美国、欧盟、英国、以色列和日本,法律规定不得因残疾而歧视他人。事实上,可访问性诉讼正在上升。2017年,美国联邦法院受理的此类诉讼约800起。仅仅两年后,病例数量几乎增加了两倍,超过2200例。

•可访问性刺激创新

产品和服务中的可访问性通常可以为普通用户解决意想不到的问题,并提高可用性。


案件:在iPhone的早期演变中,Apple开始考虑到触摸屏设备对盲目客户有所帮助的影响。迭代幕后几年,公司投资其资源开发除了基于手势的基于手势的屏幕读者的前身。有了它,用户可以与屏幕上的对象进行交互,直观地从音频线索中衡量其位置和上下文。在发布的几周内,Apple从盲人联合会的盲人联合会的特别值得表达,用于设计第一个完全可访问的触摸屏界面。


清单:让你的网站易于访问的14个步骤

蒂姆·伯纳斯·李爵士——更广为人知的是互联网之父——在90年代早期就强调了网页可访问性,直到今天它仍在发展。1999年,W3联盟发布了第一套网页可及性的指导方针从那以后,它已经更新了好几次。基于这些指导方针,我们整理了一个总的检查表,以确保您的网站是可访问的。

1.为图像启用alt标签

Alt标签不仅提高了搜索排名。它们也适用于使用屏幕阅读器和浏览器的视力受损的访问者。如果你的网页有装饰图像,但没有添加信息的内容,添加一个空的alt文本字段(alt=""),这样辅助技术就会忽略它们。

2.不要使用autoplay

自动播放内容既让人恼火,也会阻碍残障人士访问。自动启动的视频、声音和动画会让有认知障碍的用户感到痛苦,影响他们集中注意力的能力。自动播放也可能使使用屏幕阅读软件的人完全无法访问一个网站。

3.启用多媒体文件的控件

可访问媒体播放器提供了一个用户界面,当页面被放大时,它可以通过语音界面在不使用鼠标的情况下工作,并具有屏幕阅读器。

4.为多媒体文件提供标题

语音的文本版本,如字幕,以及其他重要的音频内容,使听力障碍的人能够接触到不同的媒体。

5.遵循带有头条新闻的严格大纲层次结构

标题不仅仅是粗体的大标题。它们为网页提供了一个坚实的结构。

从可访问性的角度来看,代码中的结构应该与视觉表示一致,并作为页面的“目录”有意义。确保你的标题级别遵循文档大纲,这样屏幕阅读器就可以识别标题并读出内容。

例如,一个

标签将在

区域内指定一个小节,这意味着你永远不会遇到一个

之前没有

.


6.不要将图像用于文本

如果视力受损的访问者可以选择放大图像,他们就会变得模糊和像素化(矢量图像在放大时不会失去质量)。放大后的文本必须正确显示,所以在选择字体、设计排版和布局时要牢记这一点。

丹麦皇家美术学院能见度设计中心对文本易读有一些启发性和引人注目的研究。

7.允许缩放而不会影响布局

具有损害愿景的用户可能更愿意将其浏览器文本或缩放放大到页面内容中以使其更易于阅读。浏览器以两种方式之一完成此方法:仅适当地放大字体大小,或放大整个页面并应用响应式样式。代码不应干扰浏览器的放大内容的默认设置。

8.确保物体和背景之间的高对比度

一些颜色和颜色配对可能会让游客感到色盲。(见对比检查Webaim.org-IT是用于衡量易读性的宝贵工具。)不要犹豫,将Lightbox功能添加到图像 - 通过填充屏幕并调光页面的其余部分来突出显示图像的叠加效果。

9.确保颜色不用为提示或传达信息的方式

对于视力低下、色觉不足或色盲的人来说,他们很难在充满色彩的内容中找到自己的方向。确保颜色不是传达信息的唯一提示(例如,避免像“选择红色圆圈继续”这样的指示)。

10.避免快速闪烁的动画和视频

闪烁的灯可能会触发癫痫的用户中的癫痫发作。为避免这种风险,请确保闪烁或闪烁的Web内容以缓慢的速率移动。这定义的阈值一秒钟内不超过三个闪光。

11.为表单中的所有字段提供名称

易访问的表单易于理解、完成和提交。用户必须清楚地识别指令、提示、必需的表单字段和字段格式要求。错误恢复应该是直观的和描述性的。

12.为链接添加描述性的标题

确保你的内页标题是简短和描述性的。这可以帮助使用屏幕阅读器的用户在登陆页面时就知道自己在浏览什么页面。

13.确保所有指向文档的链接都符合文档的类型和大小

如果你链接到一个文档,确保你说明了它是什么类型的文档(DOC或PDF)和文件大小。这将有助于慢速连接或带宽有限的人。

14.设计一个凝聚力和轻松的导航

确保可以使用键盘导航网站(检查网站可以使用“选项卡,”Shift + Tab“和”输入“键)导航。查看文本中的页面仅浏览器以确认该网站有意义并显示正确。

不熟练使用鼠标的人可能会使用方向键或辅助技术(例如,语音控制导航)。检查您的项目中的阅读和导航顺序是否清晰和直观。删除任何使用定时按键的功能,比如双击,以确保网站的所有部分都可以在没有鼠标和/或触摸板的情况下访问。

创建您的Accessible网站

Web访问是一个不断开发和不断发展的主题,其中包含此检查表,您可以使用一些基本解决方案,您可以参考微调您的网站。

总而言之,了解其他人正在面临的问题,并尽可能多地练习同理心,在您设计和开发您的网站时。有关更多提示,请查看这些资源:

这篇文章由Tsvetelina Miteva是Readymag的设计作家Tsvetelina Miteva贡献。

欢迎加入!我们很高兴你能来。
哦,出问题了。请再次提交表单。