Qiao's Newsletter
Posts
#004 聊聊无障碍设计

#004 聊聊无障碍设计

想象一下,如果您今天使用的 90% 的网站或移动应用程序将您拒之门外。其他人继续体验手机银行的便利、社交媒体的连通性和网上购物的自由,但对你来说,它们是无法访问的。对于数千万残疾人来说,这是他们的日常经历。

Qiao Ya
May 16, 2023

Hi👋🏻，各位设计师朋友们！

欢迎来到 Qiao’s Newsletter 第004期，本期主题：聊聊无障碍设计

1️⃣ 聊聊无障碍设计

前言

在上周三，普通的一天下午，我的手机收到了一个叫“be my Eyes”的APP的通知请求，是一个盲人朋友发出的请求，虽然收到过很次通知，但是成功帮助到盲人朋友我这还是第一次。所以也引起了我对无障碍设计的一些思考。

"Be My Eyes"是一款面向视力受损或盲人用户的应用程序，目的是帮助他们处理日常生活中的各种任务。这款应用程序通过建立视力正常人和视力受损人之间的视频通话，让视力正常人能够帮助视力受损人进行视觉上的任务。

be my eyes IOS APP 界面

那天的视频电话，这位视障朋友遇到的问题是，某服务的电脑端应用的登陆界面，除了手机短信验证码操作，还有一个“滑块验证”操作，相信大家也经常遇到类似的“滑块验证”操作。对于我们大多数健全人来说，能非常轻松的完成，但是对于视障人群，这个操作比登天还难。

普遍存在的滑块验证操作示意

其实残疾人群体远比我们想象的多，CDC（美国疾病控制与预防中心）统计，美国成年人残疾比例为25%，也就是说每4个人中会有1个人某种方面的残疾人。由此我也产生个疑问，在我这个三线小城，我真没在公共区域见到过几个残疾人，除了一些乞讨者，可能是公共区域的无障碍设施太不完善，导致比如盲人，肢体残疾这类群体根本无法出门…

了解

维基百科对无障碍设计作出了详细解释。

在我的理解和经历里我把无障碍分为实体和虚拟两类，实体就是日常生活中所能接触到的一切实体物，比如公共设置（盲道，残疾人电梯/楼梯，无障碍红绿灯/斑马线—），还有盲文书籍，无障碍键盘，游戏手柄等。虚拟的就是UI/UX，手机操作系统等。实体的涉及到公共建设，建筑设计，城镇规划这些我不熟悉的领域，就不展开。

我们日常生活中除了盲道/无障碍电梯，能接触到最多的无障碍设计就是我们口袋里的手机操作系统，如果你是苹果用户，你是否打开过手机系统设置里面的【辅助功能】项，这里面的大多数功能基本是为残障人士服务的。

iOS系统设置里的辅助功能设置

苹果在官网对辅助功能有详细的介绍页面

辅助功能介绍

这几天特地试了一下“辅助功能”设置里面的“旁白”功能，这是针对视障人群的一个功能。开了这个功能之后，基本可以做到盲操作手机以及内置的一些APP，打开相机拍个照，某项功能设置，恢复一个iMessage消息等。

除了这些通过一些介绍了解到，“放大器”和“相机”可以为视障人群提供识别物体的服务，出现在取景框的人和一些物体手机会作出提示，还有借助了雷达实现了，如果手机摄像头面前出现一堵墙，随着距离的接近手机震动的频率会提升。AirPods耳机可以当助听器使用，会把声音放大两倍。“放大器”功能为老年人和轻度视力障碍人群提供便利，类似的功能还有很多。

思考

❝

在做了几年无障碍设计工作后，我发现我们此前对残障人士的假设八成都是错的。其实健全人和残疾人的区别，仅仅在于我们感知、接触世界的方式不一样而已。这是我从调查研究中学到的事实：盲人也和明眼人一样喜欢用相机记录和分享生活中的点滴，聋人也和听人一样喜欢用身体感受音乐带来的节奏感和韵律感

谷歌无障碍设计主管：夏冰莹

苹果公司的无障碍设计不仅是对美国严谨法律法规的响应，更是该公司自始至终的社会责任承诺和包容性的体现。这种承诺驱使苹果在产品设计中始终考虑到所有用户，包括那些有特殊需求的人群。

相对于国内市场，除了已经停产的“锤子手机”之外，大部分手机制造商似乎并未过多关注无障碍设计。他们在定制安卓系统中，主要集中在增加视觉效果和功能，而非全面考虑用户的需求。对于许多互联网巨头，比如腾讯、阿里和百度，他们在自家的手机应用（如微信、淘宝、天猫和百度）上的无障碍设计，通常只是简单地提供“老年版”或“大字版”，仅仅通过放大文字、卡片和图标来进行适应。

大量的图片和视频，以及缺乏文字标注的div元素，使得视力受损和色盲的用户群体难以使用这些服务。这种情况下，所谓的“无障碍”设计，其实并未真正实现其应有的目标。

我们能做的？

尽管许多中国的互联网科技巨头并未将重心放在无障碍设计上，且在目前中国的法规体系中，对此并没有明确的规定要求。这些大型企业往往不会主动为了满足这些非强制性的规定而投入资源。我理解，对于一个团队来说，无障碍信息建设的实现需要大量的人力、物力和财力投入。然而，作为个体，我认为我们可以改变思路，从不同的角度出发，推动中国的无障碍设计的进步。

❝

“残疾”这个概念实际上要广泛得多。你有没有过这样的经历：在一个嘈杂的餐馆里吃饭，结果听不清对面的朋友在说什么。这就是情境性的耳聋。你有没有过不小心把手指划破，结果好几天不能用那根手指，或者最近因为疫情出门戴口罩，所以无法刷脸解锁手机？这些都是情境性残疾（situational disability）或临时性残疾（temporary disability）。

谷歌无障碍设计主管：夏冰莹

作为个体用户：我们可以在日常使用手机应用程序时，如果发现对残障人群存在使用障碍的情况，就主动联系应用开发商，提出建议和反馈。举个例子，之前的“我的常州”应用在一次更新后，取消了手机短信验证的登录选项，只留下了密码登录的方式。然而，对于记忆力较弱或是中老年用户来说，这次变动使得他们暂时无法登录，只能通过“忘记密码”来重设密码，这个过程相当复杂。于是，我的一个程序员朋友向后台提交了建议，希望他们重新添加手机短信验证的功能，最后，他的建议被采纳了。

“我的常州”APP登陆界面（新）

作为平面设计师：我们的主要任务是以视觉为媒介，将信息准确无误地传达给用户。不论是画册设计，还是海报设计，形式感和视觉冲击力都是建立在一定的基础规则之上的。然而，许多平面设计和画册排版甚至连普通人都难以阅读，对于视障、色盲、认知障碍以及阅读障碍群体来说，这一问题尤为严重。

文字与背景的对比度说明

因此，在进行设计排版时，我们应该重点考虑以下几个方面：

我们需要保证页面排版有逻辑性，遵循从左至右，从上至下的排版规则。我们不应该为了追求形式感而让信息内容分散在各处。
我们需要清晰区分页面信息的层级，如一级标题，二级标题，正文内容，图片信息。在排版时，应注意这些信息的层级关系。
我们还需要在图片下方提供描述，以便读者了解图片内容。
在色彩使用方面，我们需要考虑到色盲或色弱群体。我们应避免在重要信息上使用低对比度的颜色，如在白色背景下使用灰色文字。文字与背景颜色的对比度
我们需要正确使用图标和插画。有时候，为了丰富画面，我们会为一些提炼的信息（如产品特点）添加小图标或插画。例如，如果一个工业产品的特点是“防火”，我们可能会加上一个表示“防火”的图标。然而，如果这个图标的表达不够准确，可能会导致误解。

作为UI、UX、网页设计师&开发人员：这块是现在最为规范，以及网上能找到最多信息资源的领域。

1.WCAG 是 Web Content Accessibility Guidelines（网页内容无障碍指南）的缩写。这是一套由 World Wide Web Consortium（W3C，全球信息网联盟）制定的网络内容无障碍标准。我们在进行APP程序，Web页面设计的时候，可以参考此规范，如果有无障碍任务要求的时候，应该按照此规范一条条比对设计稿进行走查。

按照这个规范做真的有用么？举个例子，比如开头那个联系我的盲人遇到的“滑动验证”在这个规范中就有明确规定，“1.1.1 Non-text Content [A] ”里面给了三条建议：

1.1.1 Non-text Content [A] 关于验证码的注意事项

如果上述提到的某国内服务APP能做到这几条中的一条，我相信这个盲人朋友就不会用到“be my eyes”这个服务了。

2.英国政府官网（GOV.UK）专门为几类障碍人群设计出版了“Dos and don'ts on designing for accessibility（无障碍设计的注意事项）”海报，文件在GitHub上开源，并且已经被翻译成20几个国语言。这个海报下载下来打成A4纸贴在案头，相信也能时刻提醒自己要关注这类边缘人群。