来源:网络 作者:佚名
除此之外,英国政府网还有很多细节的处理值得学习。他们添加的标签描述都很清晰,焦点切换到列表的第一项时会告诉用户这个列表总共有多少个项目,下拉菜单目前是一个怎样的状态,让视障人士对于整个网站有一个布局感受,同时也大大提高了他们安全感。
提供多种验证码方式账号注册是用户开始业务办理的第一步,可是往往这一步就给了视障人士一个很大阻力。目前很多政务服务网注册流程的验证方式都只提供图形验证码,但屏幕阅读器是无法识别验证码中的文本信息。如果注册流程都有障碍的话,其他业务办理即使有做无障碍改造,对视障人士来说都是没有意义的。我们除了图形验证码之外,还应该提供多种验证方式让用户选择,如手机验证码、语音验证码等。
苹果网站的注册流程中,验证方式除了提供图形验证码之外,还会提供语音验证码。
快速访问内容对于只使用键盘导航的用户来说,在熟悉网站后,他们是希望直接访问页面内容的。但是很多网站的顶部导航存在多个菜单,在用户获取页面内容之前,他们需要逐个切换链接才可以去到页面内容部分,打开一个新的页面,又是重复这样的步骤。
面对这样的问题,我们可以提供更友好的解决方案。当用户开始使用键盘导航页面时,提供一个“跳至内容”的链接,直接跳过每个页面重复的内容,提高视障人士或者键盘使用者的操作效率。
在使用键盘导航时,Facebook 还提供了页面内模块和其他页面的导航菜单,让用户可以更快速地跳到指定的内容上,使用起来更高效。
4. 为听力障碍人士设计 为视频添加字幕网站上的视频都应尽可能配上字幕,让听障人士可以结合视频画面理解内容。在政务网站上,为办事指南的视频教程里添加字幕,也有助于听障人士更好地获取信息,更容易完成办事流程。除此之外,我们也可以提供详细的图文指南让用户选择。
5. 为运动障碍人士设计 支持键盘导航部分运动障碍人士如果无法控制鼠标,其实也是需要使用键盘来导航网站的,网站支持键盘导航不只是为了盲人用户而设定,对于其他的残障人士也是非常重要。
交互元素易于点击在设计控件时,也应该更加关注运动障碍人士和老年用户的使用体验,适当增加可点击的目标区域,让按钮、菜单选项和链接足够大,以便他们更容易操作。
6. 为读写障碍人士设计 图形、图片和文字结合的排版由于读写障碍人士对文字阅读有一定的难度,阅读方面会出现跳字漏行、增字等情况。网站上应尽量减少同一位置上出现大篇幅的文字,WCAG2.0 中也提到的单行宽度不超过 40 个中文字符或符号,保持简练的文字表达和清晰的内容,通过使用标题、图片和列表来分解内容,缓解他们的阅读压力,以便为用户提供心理休息和提高内容的可读性。
保持一致性的对齐方式整个网站都尽可能保持统一的对齐方式,英国政务网的每个模块的内容都采用左对齐的方式,遵循用户从左到右浏览习惯,让其更自然和高效。本来读写障碍人士对于阅读就有障碍,如果出现多种对齐方式,则会让他们更加眼花缭乱。
7. 为老年人设计 使用较大的字号为了确保老年人用户能清晰浏览网站,而且考虑到并不是每个用户都使用高分辨率的显示设备,大字号的界面对于他们来说是很重要的。同时,我们还需要避免出现拥挤的大段文字,尽量把信息进行合理的分解,增加留白空间,通过排版组合让用户更清晰明确地获取信息。
英国政务网的文字体系里,整理都选用了较大的字号,最小的正文也使用到 19px字号。
考虑到用户对于字号大小显示的不同需求,香港政府网的顶部导航还提供了字形大小的入口,指引用户在不同浏览器下如何设置字号大小,让他们可以设置最适合自己阅读的显示效果。
减少手动输入很多老年人达到了一定年龄,身体机能和记忆力会开始逐渐衰退,这使得他们操作网站界面变得更加困难,拼写输入就是其中一个很大障碍,我们应该尽量减少让用户手动拼写输入。在业务办理流程中,对于填写个人信息部分,可以优先从账号信息中拉取相关内容,其他信息补充部分,能提供选择项的内容都尽可能使用选择控件。
浏览路径简单明确为了老年人能更好地浏览网站内容,应该保持页面清晰的布局和模块划分,为他们提供一个简单明确的视觉动线,让整个网站的内容都是是直观和易于理解。
小结根据不同类型的用户群体,我们应该思考如何为他们设计和提供更高效的服务,让所有人都能平等、方便、无障碍地获取信息。
为视障人士设计
使用良好的颜色对比度
使用适合阅读的字号
使用颜色、图形和文字结合的方式传达信息
支持键盘导航
为非文本内容添加替代文本
为听障人士设计
为视频添加字幕
用标题、图片、列表等方式分解内容
保持内容清晰简洁
有逻辑的版面布局
为运动障碍人士设计
支持键盘导航
交互元素易于点击
为读写障碍人士设计
使用图形、图片和文字结合的排版
保持一致性的对齐方式
保持内容清晰简洁
为老年人设计
使用较大的字号
浏览路径简单明确
减少手动输入
交互元素易于点击
无障碍设计并不意味着会让网站变得不好看,相反,它会在我们思考的过程中融入一些条件限制。在这些条件限制中去探索如何让我们的设计能适用于所有用户,为每一个人设计,为每一个人提供更好的政务服务。
参考文献《Designing accessible products》 Adhithya
《Accessible Interface Design》 Nick Babich
《Designing for accessibility is not that hard》 Smashing Magazine
《Designing For Accessibility And Inclusion》 Pablo Stanley
《How to make accessibility easier for service teams》 Angela Collins Rees
《7 Things Every Designer Needs to Know about Accessibility》Jesse Hausler
《Web 内容无障碍指南 (WCAG) 2.0》
原文地址:Tencent CDC