报名参加CloudWeGo黑客松,奖金直推双丰收! 了解详情
写点什么

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

  • 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:06828

评论

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

神经网络攻防:开篇词——你所不知道的神经网络攻防

P小二

神经网络 AIPwn 对抗样本 AI安全 P小二

大数学家笛卡尔到底是怎么死的? |《隐秘的角落》

赵新龙

数学 隐秘的角落 笛卡尔

起底印度禁用59款应用的数据表现

谢锐 | Frozen

移动应用 游戏开发 游戏出海 移动互联网 游戏制作

小师妹学JVM之:JIT中的PrintAssembly续集

程序那些事

JVM jdk8 JDK14 assembly 签约计划第二季

系统架构师week 04 - 互联网架构总结

尔东雨田

极客大学架构师训练营

微服务网关演进之路

捉虫大师

Java 微服务 dubbo 网关

一文解决MySQL时区相关问题

Simon

MySQL 数据库

自由职业半年之后,我又滚回职场了...

王磊

程序员 程序人生

写给孩子的两本书我读得津津有味

孙苏勇

读书 陪伴 随笔杂谈

锦囊篇|一文摸懂SharedPreferences和MMKV(一)

ClericYi

公司短信平台上的两万块钱,瞬间就被刷没了

古时的风筝

短信防刷 接口安全 短信轰炸机

了不起的 tsconfig.json 学习指南

Geek_z9ygea

typescript 大前端 Web

​ “强大基座”再展能力,一朵“云”掀起国产化浪潮

Geek_116789

MyBatis入门

Simon郎

Java mybatis

集中全世界程序员的力量,可以在三天之内实现一个手机淘宝吗?

非著名程序员

程序员 软件 程序人生 软件工程 人月神话

数据集永久下架,微软不是第一个,MIT 也不是最后一个

神经星星

AI 计算机视觉 MIT AI 伦理 数据集

十分钟带你彻底搞懂原码、反码、补码

程序员生活志

补码 原码 反码

了不起的 Webpack 构建流程学习指南

Geek_z9ygea

Java 大前端 Web webpack

理解Redis的内存回收机制和过期淘汰策略

老胡爱分享

redis LRU

手把手教你看MySQL官方文档

Simon

MySQL

阿里大型企业级开发必用微服务:深入浅出SpringBoot2.x

小闫

spring jdk 面试 后端 springboot

架构师训练营第五周总结

陈靓-哲露

Git 的进阶操作

多选参数

git GitHub gitlab

分布式缓存 - 第五周作业

孙志平

谁没个焦虑的时段呢?

封不羁

程序员 个人成长 个人感想

【自学成才系列二】multipass上ubuntu安装篇

小朱

ubuntu multipass

重学 Java 设计模式:实战状态模式「模拟系统营销活动,状态流程审核发布上线场景」

小傅哥

Java 设计模式 小傅哥 重构 代码规范

为什么大家都说SELECT * 效率低

Java小咖秀

MySQL 面试 经验

计算机操作系统基础(十)---存储管理之虚拟内存

书旅

php laravel 线程 操作系统 进程

面试时被问创建多少个线程合适?你该怎么说?

小谈

面试 线程 JVM springboot SpringCloud

Gradle快速入门使用指南 - 安装篇

小隐乐乐

maven

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