月归档:2013 年六月

404页面:轻量级公益的新尝试

来自stonehuang,于2013年6月22日在极客公园上的演讲。 源URL:http://www.geekpark.net/cast/view/183447?u=0&t=tencent 演讲嘉宾:黄希彤,腾讯QQ空间技术总监&腾讯志愿者技术公益分会会长

发表在 技术 | 留下评论

如何做盲人认可的无障碍

刚刚看到《腾讯QQ2013版盲人操作不便 盲协副主席:望QQ真正无障碍(全文)》http://news.163.com/13/0417/18/8SMCCKMA00014JB5_all.html 在今年年初的时候,我有幸和bryanchen、carinaliu两位同事做了一次QQ无障碍商务拓展宣传活动,去到一对盲人夫妇家里将QQ2008升级为2013并作无障碍方面的推广和搜集工作,在整个过程中,了解到盲人朋友是如何使用 桌面软件的,同时在升级与体验的过程中,也发现了盲人朋友操作中的困难,他们会依照2008的使用习惯来使用2013。所以上文中说到的一些情况我是亲身经历的。 为什么大家做了这么多的优化,而盲人朋友并不买账呢?不只是QQ2013。其他的产品,包括我曾经优化的一些产品也有类似的情况发生,那么问题的根源到底在哪? 认知方式: 盲人通过何种方式去认知我们的产品?通过“位置信息”。Tab键可以将焦点移动到下一个(下一组)可以聚焦的元素上。然后读屏软件会读出相应的内容,但是他们很难或者说是无法分辨当前聚焦的元素是单一的元素还是某一组功能相同的元素中的第一个元素(组中的其他元素一般可以通过方向键来切换)。一般盲人第一次接触软件或者网页的时候(更多的是软件,因为软件比较容易TAB一个循环),他们会一直按Tab键进行切换,知道回到最初的位置,他们通过这个行为来了解软件到都有什么样的功能,然后他们会记忆每个功能按几下,或者每个功能前后的功能是什么,通过记忆功能所在的位置来指引以后的操作,并且在以后的操作工程中不断强化这些记忆,以更加快速准确的找到他们希望的功能。通过几年的使用他们对软件功能位置的熟悉程度也许大大超过了开发人员自己的记忆。当有新版本出现的时候,一般都会有新功能的增加,这就“破坏”了盲人朋友原来的记忆,虽然我无法完感知他们的使用感受,但也许就像某一天突然间公交或地铁站牌发生了变化,但是在这之前并没有做到足够的宣传。 历史原因: 也许我们最开始根本就没有考虑到盲人这个群体,至少我负责的产品在最开始的时候没有想过,但是你不能阻止盲人使用你的产品。当我们意识到我们要为盲人做些什么的时候,盲人可能已经在“蹩脚和不完善”的产品环境中使用了很久,也了解如何使用相关的产品了。当我们依靠我们的经验与技术标准实现“客观”的无障碍的时候,肯定会与盲人“主观”的无障碍有区别。所以他们觉得不方便了。举个不恰当的例子,我们一直接受着某种教育,我们慢慢的就会习惯这个社会,后来有一个更加全面与包容的教育环境,我们反而感觉不舒服了(我指的是什么,估计大家会懂)。 这也提醒我们,也许我们之前(可能是由于时间或者当时的技术氛围决定)开发产品的流程是有弊端的:我们先开发产品,后来发现有这样一群用户,然后我们附加上了无障碍。而我觉得,我们应该从现在开始在最初做产品的时候,就把无障碍做为一个必要的条件加入进去,使产品从“历史”阶段就在无障碍方面进入正轨。从最开始就让用户在一个相对正确的环境中去使用。 读屏软件的局限: 不可否认的是,这种情况是比较普遍的,一个大用户群体的软件并不一定是一流的软件。国内读屏软件厂商整体的技术实现与产品功能还是有较大的上升空间,某些功能无论是明眼人还是盲人都觉得不太好用,但是他有很大的群体,他有很多历史的版本,他有技术的局限。他和我们的产品(第三方的产品),无法很好的对接。我们的产品和读屏软件的产品参照的技术方案规则,不会是相同的。当读屏软件的解释规则和我们开发产品基于的技术规则相冲突的时候,用户会如何认为?他们会说:“某某失效了”,“不支持某某读屏软件了”,“无法用读屏使用”等等。几乎没有任何一个用户会说,是因为读屏软件或我们没有支持某个技术规则。所以单独只说QQ2013不支持无障碍,这是不公平的。可惜没有办法,我们不能奢望用户去了解技术。对于如何解决这个局限,我曾经跟争渡读屏开发团队的朱兰强、杨永全两位老师聊过,其实他们也和希望和我们合作统一两边的技术标准,在读屏软件开发领域,读屏厂商可以算是权威,但从技术角度来讲,我们的技术应用经验会更加多一些。与厂商合作共同推动无障碍的标注,盲人会更加收益。这样就更加可以保证两边采用的是相同的标准。另外读屏软件的版本迭代是很漫长的,一年可能都没有一次。这就和我们的产品新功能有了一个真空期。 用户的情感: 首先要确定的有一点:用户说我们,提意见,甚至骂我们,其实都是因为爱我们,所以大家要淡定些。有人说盲人是比较敏感的,其实很多用户也是比较敏感的。“全盲的盲人,他们对网络的依赖性很强,所以腾讯这么去做很不应该。2013版QQ一出来盲人就用不了,而腾讯却认为它无障碍,所以从维权的角度说,2013版QQ一定要变成我们所说的无障碍,同时,考虑到(盲人)群体不会很快适应,所以也应该把2008版保留。……就是我们认为无障碍了,才能PASS,2008版必须保留。”“不应该”,“一出来就用不了”,“维权”,“一定”,“必须保留”。在语言中几乎全是决绝性的修饰。客观来讲这种绝对性的话语对解决问题是无益的,会给人高高在上、唯我独尊的感觉。软件自身的更新没有绝对的必要必须把某一个群体或者个体完全满意当作是发布条件。对于这样的较为敏感的客户,我们平时觉得“无所谓”的事情,在这部分用户群体中可能就会带来极大的意见。所以在产品开发上,我们要比之前谨慎一些,在宣传推广上的措辞可能也要谨慎一些,在看到这些言辞的时候看淡一些。我相信我们的努力会通过时间和事实赢得用户的,因为我们一直在努力。 操作层面: 界面颜色和位置可以帮助明眼人理解按钮与按钮的关系,窗体之间的关系,元素和元素位置之间的关系等等。区域进行切换的时候我们一般会采用Tab键,当眼睛发现焦点进入到一个相对封闭的面板中的时候,我们可能会下意识的按方向键来切换(这个操作你可以试着将鼠标拔去,单单用键盘来体验windows操作系统,看看如何管理文件夹、文件、运行软件等等)。盲人无法通过外在的表现来区分一个东西和一组东西,这就直接导致很多需要更改按键来操作的界面,他们可能无法体验,比如说QQ好友的树形面板(其实绝大多数的树形面板都是下面这种体验方式):按上下键切换节点,按右键展开这个节点,按左键收起。当盲人使用Tab键将焦点移动到树形面板的时候,如果给他以操作提示,就会使得用户使用更加方便。但是如何提示,如何让读屏软件提示,不单单是我们做为软件开发者单独可以决定的。另外,当到达一个组的时候,改组都包含什么样的功能,是否也可以简短的提示给用户,以节省他们遍历组内元素的时间。焦点管理是很重要的一点,明眼人通过视觉使用鼠标自主的切换焦点,而键盘用户,我们必须为他们设计一个完整的焦点顺序,点击某个按钮之后,再切换焦点的时候应该到什么样的位置。这个路径一定要是单一的,比如打开群贡献之后,再按Tab键应该进入群共享的面板而不是聊天窗口。让盲人感觉有序。理想的情况下是,每一个功能的开始和结束都应该是一个面包屑。 说明文档: 说明文档是可以最快让用户了解整个产品的,对于盲人用户更加重要,让他们在使用某一个功能的时候有章可循,同时也约束了他们的行为,也告知了我现在都支持什么样的功能和体验。我自己在每一个有无障碍的页面都添加了说明文档的链接,反馈还是比较理想的。 用户访谈: 在盲人反馈的群里,几乎每天都有着对产品优化的建议,但是这些建议又不相同。每一条建议都是基于每个用户的个人情感,可能我们满足了这个用户就让另外一个用户不爽了。对于每一条建议,特别是操作的建议,我们应该去详细分析到他的本质问题,是我们的序列设计的有问题,还是有焦点陷阱或者是提示不够。说明文档会解决和规范一部分类似的问题。 关于简版: 在盲人的群里讨论过这个问题,一方面一部分人觉得可以有简版的产品,因为盲人真的不必使用那么多的功能;另一方面有一部分盲人觉得不必有简版的,因为这要他们感觉他们的“特殊性”,不希望别人对他们另眼相看。不光是QQ,我们考虑有的时候我们的产品是不是真太臃肿了,我们为什么不能提供简版的产品,很多复杂的网页也有简易的手机版啊,甚至功能机上的很简单的版本也是存在的。是时间的原因,还是什么呢?是怕简单会替代了全面么?这个就是各个产品人员要考虑的事情了。不过我始终相信一条,再复杂的软件,我们也可以让这个软件有序并且使用方便,傻瓜软件不是我们希望的么? 以上都是抛砖引玉,希望可以得到交流,让我们的产品服务更多的人。

发表在 观点 | 留下评论

工作流程的新环节——无障碍设计

无障碍设计,不可能仅仅是一个环节,或者说,他应该是一到三个独立的单元作为整个工作流程中的某个环节;另外在重构和前端开发的具体实施中也会有“新增”的无障碍设计内容。 现阶段,在越来越多的产品和团队接纳并且将无障碍设计加入到工作流程之前,已有的工作流程大致如下: 原型设计——视觉设计——网页重构——前端开发 那么无障碍设计应该存在于现有工作流程中的那个环节呢?经过几次常规和紧急项目的实践,下面的流程是比较适合的。 常规项目: 原型设计——无障碍方案——视觉设计——网页重构——无障碍实施说明文档——前端开发——无障碍测试 紧急项目(前期没有时间进行无障碍设计): 网页已上线——主要功能分析——无障碍实施说明文档 各个环节主要的工作内容: 无障碍方案:基于确定的原型设计以及从全局到局部的顺序以文档的形式记录无障碍实施的计划,作为日后网页重构以及前端开发的注意事项提示,同时这个环节也会使相关人员了解整个页面功能、内容、交互的。应该标注的内容包括不限于:landmark、网页结构、各个widget的WAI-ARIA(角色、属性和状态、交互时如何变化),各个widget的焦点管理、可能存在的无障碍问题、适合的代码。无障碍方案的文档应该由一个了解交互、HTML、JS、无障碍等相关知识的人员来完成,我所在的团队和项目此环节由网页重构人员完成,无论是这对于他们理解网页、编码还是后期的脚本开发或者交由前端开发人员来说,网页重构做这以环节的任务还是很适合的。当然就想前面所说的一样,只要了解相关知识就可以所这个环节。但是基于accessibility API由DOM结构、js、WAI-ARIA构成,所以绝大部分的基础代码都是由网页重构环节部署,所以在现有的团队人员中,网页重构人员是可以“快速转型”的。该文档完成后应交付给交互设计师确定是否有对交互理解偏差的地方并且改正,然后交给前端开发人员使其在具体工作之前对整个页面的交互以及一些widget的状态改变和焦点管理做好基础的准备。 无障碍实施说明文档:网页重构时候依照之前的无障碍方案为网页加入了一些如landmark、aria的相关属性。网页重构结束之后,应该由网页重构人员书写一份详细的文档,交付给前端开发人员,帮助其准确的修改属性以及功能开发。包括不限于:脚本应该修改的属性、属性变换的逻辑、焦点管理方案、额外的无障碍功能(比如:网页大纲、强壮的快捷键功能、高对比度等等) 无障碍测试:依照无障碍方案测试页面,包括不限于:常见的无障碍问题、焦点管理、WAI-ARIA、常用读屏软件走查。 主要功能分析:作为一个已上线产品的补充步骤,在指定无障碍实施说明文档之前一定要先做主要的功能分析。对需求方、网页重构人员、脚本开发人员进行详细的了解,从而得出主要功能点以及交互逻辑,然后输出一份在已有代码上可行的方案,一个大的标准是,不可影响线上正常运营,采用小步快跑的模式,一个功能一个功能的无障碍修复。由于一定会修改代码,所以修改方案一定要和相关的编码人员共同协商以保证方案的可实施性。 欢迎讨论

发表在 技术 | 留下评论