购物车图标
10月20日

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

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

经过
Tsvetelina Miteva.
听这篇文章

当最初创建网络时,它意味着提供对信息的平等访问,并将所有人删除对每个人的沟通障碍。然而,今天,超过十亿人的残疾人(关于世界人口的15%)。随着全球老龄化和医疗进步延长了患有疾病或伤害的人的生活,这种差距只会变得更大。

所以,你可以做什么?


首先识别问题

某些最常见的损伤这会影响人们使用Web的方式包括:

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

对于一些,有特殊的辅助技术帮助他们导航Web。例如,盲人经常使用屏幕读者:将显示文本转换为合成语音或可刷新的盲文的技术。有机障碍的人可以使用与操纵杆类似的斗型和SIP系统 - 但是用呼吸控制。他们认识到SIPS或PIFF,并将它们翻译成鼠标点击或键盘字符。

“Web Access”是包含“设计和开发的网站,工具和技术的伞术语,所以残疾人可以感知,了解,导航和与网络互动并贡献它。”尽管如此,Web Accessibility还会使没有残疾的人们享受:

  • 在移动电话,智能手表,智能电视和具有小屏幕或不同输入模式的其他设备上。
  • 有临时残疾的人,如破碎的手臂或丢失的眼镜。
  • 有情境限制的人 - 明亮的阳光或不允许音频的环境中的人。
  • 人们慢,有限,甚至昂贵的带宽连接。


为什么地址可访问性?

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

•可访问性增强品牌声音

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

•可访问性扩展市场外展

残疾人是一个被忽视的市场的一部分,但它不是一个利基。排除消费者部分的设计将无法达到其全部市场潜力。残疾人往往经常由企业提供欠缺和/或误解。但是在辅助功能的帮助下,其中许多人都可以很好地成为忠诚的用户或客户。

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

在许多国家,如美国,欧盟,英国,以色列和日本,这是一个法律要求,不要因为残疾而歧视别人。事实上,可访问性诉讼正在上升。2017年,美国联邦法院提交的此类诉讼的数量约为800例。只需两年后,案件数量接近超过2,200。

•可访问性刺激创新

产品和服务的可访问性往往为普通用户提供了意外的问题,并提高了可用性。


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


清单:14个步骤让您的网站无障碍

蒂姆伯勒斯·李先生 - 李先生 - 更像是互联网的父亲 - 在90年代初重点介绍了Web可访问性,而且它仍在发展到这一天。1999年,W3财团发布了第一套网络可访问性指南从那以后已经更新了几次。基于这些指南,我们将一般的清单放在一起,以确保您的网站可访问。

1.启用图像的Alt标签

alt标签不仅仅是改善搜索评级。他们也可以使用浏览器的屏幕阅读器在视觉上受损的访客。如果您的网页有没有将信息添加到内容的装饰图像,则添加一个空的Alt文本字段(ALT =“”),以便辅助技术忽略它们。

2.不要使用autoplay

自动播放内容可能是刺激性的,并且可以访问残疾人的真正障碍。对于具有认知障碍的用户来说,自动启动的视频,声音和动画可能会令人痛苦地影响他们集中注意力的能力。自动播放也可以使用屏幕阅读软件的人完全无法访问的网站。

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

可访问的媒体播放器提供用户界面,当页面缩放时,如果页面缩放,并且使用屏幕阅读器时,请通过语音接口运行。

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

语音的文本版本,如字幕,以及其他重要的音频内容允许具有听力障碍的人员可以访问不同的媒体。

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

标题远远超过大胆的标题。它们为网页提供了稳固的结构。

从辅助性视点,代码中的结构应与视觉演示符合对齐,并称作为页面的“目录”。确保您的标题级别遵循文档概述,因此屏幕阅读器可以识别标题并读出内容。

For example, an

tag would designate a subsection within an

section—meaning you should never come across an

that isn’t preceded by an

.


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贡献。

欢迎乘坐!我们很兴奋,拥有你。
哦,哦,出了什么问题。尝试再次提交表格。