数字包容和社会影响是我们工作的重要组成部分 一节, 除了一些数字项目, 我们做的活动和用户研究工作, 我们认为分享一些技术建议和资源来帮助人们开始无障碍测试是很有用的. 这是 全球无障碍宣传日 5月19日星期四, 因此,我们将以下8个步骤放在一起,用于测试您正在构建的内容的可访问性.
为什么这很重要??
可悲的是,许多人认为网页可访问性是专业的,或者有点“有就好”。. 我们都听到过同样的评论:
“有多少人知道呢? 那 问题确实有影响?——黛布拉,42岁.
“我觉得挺好的。”——罗斯,28岁.
“我不认为这是个问题。”——史蒂夫,32岁.
当我们谈论这个话题时,我们经常想到一些极端的例子. 我们考虑的是那些手脚不灵活的人, 我们想到了那些生活在视力衰退中的人, 我们想到的是(对不起,妈妈)老年人. 考虑到这些人当然是件好事,但我们也很容易忘记,提高网站的可访问性也会提高网站对所有人的可用性.
在输入用户名后,您是否经常使用tab键快速导航到密码框? 你有多少次因为手机上最微弱的阳光让你把亮度调到最大,只是为了能读一些基本的文字而难以阅读东西? 有多少次你会因为弹出窗口的顶角上那个小十字太小而错过它?!
So yeah; web accessibility does affect you, whether you realise it or not.
“很棒的故事,伙计,但我刚刚花了10万美元买了一个网站,却无法访问.”
别担心,我是来帮忙的.
在一节,我们明白,可访问性有时可能是一个硬性推销, 因此,我们建立了一个简单的测试清单,以帮助在最短的时间内产生最大的影响. 我们把测试时间限定在两个小时内, 这样,当你试图向股东或高级管理层(或任何控制现金的人)推销你的想法时,你的工作就更容易了。.
步骤1 -选择样本
为了充分利用接下来的两个小时,您需要选择站点的一个示例区域来运行测试. 始终尝试并考虑业务关键路径. 也许可以考虑使用谷歌分析之类的工具来找出流量最高的页面. 典型的例子可能是:
- 主页
- 全球最大的博彩平台
- 内容页
不要试图选择太多的页面,因为你最终要么会耗尽时间,要么会影响你选择的页面的质量.
步骤2 -运行自动化工具
自动化工具只需点击一个按钮就能识别出各种各样的问题. 我们建议使用一些自动化的工具来获得尽可能多的覆盖率. 的 WAVE可达性检查器, ecker辅助工具 还有一套 来自SiteImprove的优化工具 有几个方法能给你带来真正的好结果吗.
在工作中, 我们邀请具有广泛能力和数字信心水平的用户参与共同设计, 原型和可用性测试环节, 但是将手工测试与自动化工具结合起来是有真正价值的.
步骤3 -启用文本大小调整
许多视障用户并不依赖屏幕阅读器技术. 相反,他们可能会放大网页上的文本大小,使文本更容易阅读. 为了验证这一点,我们使用了两种不同的方法.
- 使用浏览器设置调整大小:使用内置的浏览器设置, 用户应该能够在页面上调整文本的大小. 这被大多数现代浏览器使用,并且很容易在浏览器设置中找到
- 缩放文本:这个Chrome扩展是一个流行的辅助功能附加组件,将强制文本调整大小. 我们测试了200%的变焦 网页内容易读性指引.
步骤4 -使用标签索引
对于不能或不喜欢使用鼠标的用户, 谁转而依靠TAB导航来使用网站, 我们需要确保TAB索引是合乎逻辑的,并且仅使用TAB和enter键就可以完全导航页面.
为了让用户能够成功地做到这一点,我们需要注意以下几点:
- 逻辑排序(从上到下,从左到右的页面布局)
- 保持良好的悬停状态,以便用户知道他们在页面上的位置
- 不要错过或跳过任何关键部分
- 绕过重复块的能力.g. 每个页面的标题菜单相同)
步骤5 -总是添加替代文本
应为所有图像提供描述性的“alt文本”. 它应该与页面的内容或目的相关并具有功能性. 这可以通过使用内置的浏览器工具进行测试,或者在运行屏幕阅读器时将鼠标悬停在图像上. 如果没有识别或描述没有帮助, 这就不符合无障碍标准. 当您添加说明性图像时,您将用户排除在您想要的体验之外.
第六步-检查颜色对比
整个网站的文字需要有足够的颜色对比度. 该比率将根据文本的大小而变化. 尽管大多数自动化工具会 尝试 为了识别色彩对比问题,在我们的经验中有很多实例被遗漏了. 由于这个原因,颜色对比应该始终包含在您的手动测试中. 简单地取一个有问题的颜色代码样本,并通过诸如 WebAim的对比检查器,以确定它们是否可访问.
步骤7 -正确构建表单
用户应该能够使用屏幕阅读器和tab键完成和提交任何表单. 屏幕阅读器读取的表单说明应该清晰,并向用户提供上下文. 应该标识必选/可选字段, 错误信息应该是清晰的, 指导性的,并把重点放在页面上. 完成此测试的最简单方法是打开屏幕阅读器,不看就完成表单.
步骤8 -考虑弹出窗口和模态窗口
很明显, 这并不总是与所有的网站设计相关,但弹出窗口或模态窗口可能是你网站上最令人沮丧的可访问性问题之一. 当模态窗口打开时, 用户应该能够通过TAB键浏览相关元素, 但它们应该始终锁定在模态中,不应该与父页面交互.
这就是你的8个步骤.
总之
这被设计成一个简短的审计. 这并不能帮助你找到网站的所有可访问性问题, 但它会在很短的时间内产生很大的影响. 话虽如此,你显然需要意识到结果. 以及我们自己设计和开发数字产品, 我们提供会谈, 培训和测试,以帮助您构建更好的产品. 如果你想让我们为全球最大的博彩平台数字社区设置一些东西来帮助你提高你在网页可访问性方面的知识和技能, 请联系: hello@nexerdigital.com