写点什么

与你同行,才能无障碍 (二)

  • 2019-12-18
  • 本文字数:1296 字

    阅读完需:约 4 分钟

与你同行,才能无障碍(二)

多角度技术解决方案完善手淘无碍化


淘宝技术工程师闭着眼睛做无障碍测试


在过去的一年中,手淘技术团队在以下三个方面不断完善了手机淘宝的无障碍建设:


1.图片可以“听到”


手淘详情页面接入 OCR 能力,也就是提取商品图片中的文字,帮助视障人群能够“听”到图片内容。该能力由“图像和美”团队提供后端算法支持。旨在解决商品详情中“图文”详情区域,“纯图片”控件无障碍文本缺失的问题。


2.增加“无障碍小助手”


无障碍小助手在手机淘宝中提供无障碍快速通道,帮助视障用户快速到达常用页面(充话费、领淘金币等)。旨在解决视障用户的一大痛点:多次切换焦点寻找常用功能入口。


3.信息无障碍纳入常态化


“手机淘宝”是中国第一个将信息无障碍纳入更新维护常态化流程的产品。在集团已有的无障碍工作基础上,我们与深圳无障碍协会保持高度合作。做到无障碍检查与修复的日常化。同时,针对目前广泛使用的 DinamicX 开发体系。我们在 DinamicX 模板编辑阶段就加入了无障碍检查。让无障碍能力成为了模板能力的一部分。

淘宝的无障碍设计规范


手机淘宝无障碍设计准则


手机淘宝从 2017 年开展全链路无碍化设计迭代以来,经历了多个版本多种类型的无碍化尝试,包括基础链路无碍化、双 11 双 12 会场设计无碍化以及智能小助手的淘内无碍化产品孵化。总结了以下五点对网络购物最为基础的设计准则:


1.用户记忆认知负担最小化


视障用户依赖记忆以及对大量手势的掌握来与手机或触屏产品交互,这本身就占用了大量的认知资源。设计师应该努力帮助读屏软件的用户来降低他们的对工具本身和界面的认知负担。


2.结构性导航体验的一致性


一致的结构性导航能够帮助视障用户快速建立对各类新进入页面的熟悉度和寻找信息的方式,从而降低学习成本和搜索有用信息的认知以及效率成本,并建立任务信心。


3.避免同一点多方向和维度的信息分布


按照我们之前讨论的视障用户的认知模型,多维度的信息关联方式对于视障用户是巨大的学习成本并且通常伴随信息理解的不确定性和不安全感,尤其是无法在脑中建立方位地图的先天视盲者。


4.页面内容结构的一致性


这是指页面内信息表达方式和顺序的一致性,这是对用户浏览信息舒适度、阅读连贯性和操作信心的保障。


5.辅助机制的一致性


指的是帮助用户操作、阅读以及完成页面的互动方式的一致性,例如:通过唤起菜单来提醒用户选择服饰的尺码,那么在各类物品详情页都最好使用类似表达的辅助菜单,来提升用户确认操作的可靠性。


在上述基本准则的基础上,淘宝的设计师也给出了手淘框架下每个可复用的功能性控件的无碍化设计规范-从点到面、以点带面地来持续推动和优化基础链路的无碍化。欢迎关注「淘宝设计」公众号,查看更多无碍化设计相关内容。



手机淘宝无障碍设计_基础控件设计样本


与你同行才能无障碍


“人生百年,试想谁能一生无障碍?”


淘宝的无碍化建设不是为了某个业务的 KPI ,而是为了每一位“特殊”的 TA 们,搭建最基本的、有安全感的信息化生活。期待更多的同学能够加入到「信息无障碍」,也希望这篇短文能帮助感兴趣的同学找到「无障碍」之路。期待与你同行,一起「无障碍」。


本文转载自淘系技术公众号。


原文链接:https://mp.weixin.qq.com/s/BpOKNVMVATANRJv2dTrMcQ


2019-12-18 16:06849

评论

发布
暂无评论
发现更多内容

Apache Spark & Paimon Meetup · 北京站,助力 LakeHouse 架构生产落地

阿里云大数据AI技术

大数据 LakeHouse EMR Apache Paimon

政策强化,反欺诈监管日益加强

芯盾时代

金融 风控模型 反欺诈

RAG三件套运行的新选择 - GPUStack

SEAL安全

大模型 LLM GenAI dify GPU 集群

数据资产入表、全面激活数据要素潜能,赋能企业发掘崭新价值!

奇点云

云真机测试

测试人

软件测试

云消息队列 Kafka 版全面升级:经济、弹性、稳定,成本比自建最多降低 82%

阿里巴巴云原生

kafka 阿里云 云原生

深入探索京东API接口:商品详情数据接口在电商应用中的强大应用

代码忍者

API 接口 pinduoduo API

RAG三件套运行的新选择 - GPUStack

GPUStack

大模型 LLM GenAI dify GPU 集群

如何利用1688API:通过商品ID与URL一键接入,高效采集商品详情页实时数据指南

代码忍者

API 接口 pinduoduo API

缓存之美——如何选择合适的本地缓存?

京东科技开发者

B端体验深耕-洞察用户需求,打造心有灵犀的使用体验

京东科技开发者

Redis 实现高效任务队列:异步队列与延迟队列详解

左诗右码

大模型时代,云原生数据底座的创新和实践

百度Geek说

大数据 百度 智能云

Java定时任务大盘点:发工资也能“指日可待”

京东科技开发者

火山引擎数据飞轮模式下的线上营销:内容产出更智能、人群触达更精准

字节跳动数据平台

大模型 数据飞轮

探索微店API接口:如何获取并解析商品详情数据的Json格式指南

代码忍者

API 接口 pinduoduo API

户外LED显示屏一般用P几的最好

Dylan

场景 技术优势 LED显示屏 户外LED显示屏 led显示屏厂家

腾讯云双十一拼团GO|云产品囤起来

六月的雨在InfoQ

腾讯云 云服务器 双十一 优惠大促

“数字创新产品课程” 12月7-8日 · 上海 · CSPO认证周末班

ShineScrum

数据资产入表,如何接住这“泼天的富贵”?

奇点云

数据资产入表

数据资产入表,如何接住这“泼天的富贵”?

奇点云

CST教程——如何理解CMA中计算MWC时的MS

思茂信息

cst cst使用教程 CST软件

《Django 5 By Example》阅读笔记:p17-p53

codists

Python django

HyperWorks使用六面体和三棱柱单元进行实体网格剖分

智造软件

CAE软件 Hypermesh hyperworks

与你同行,才能无障碍(二)_文化 & 方法_淘系技术_InfoQ精选文章