写点什么

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

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

评论

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

带你用20张图了解什么是 JVM 运行时数据区

风铃架构日知录

Java 程序员 JVM 码农 内存

Java Netty框架自建DNS代理服务器教程

小小怪下士

Java 程序员 Netty DNS

Excelize 2.7.0 发布, 2023 年首个更新

xuri

golang GitHub 开源 编程 Excelize

Spring项目中用了这种解耦模式,经理对我刮目相看

JAVA旭阳

Java spring

全景剖析阿里云容器网络数据链路(一):Flannel

阿里巴巴云原生

阿里云 容器 云原生

京音平台-一起玩转SCRM之电销系统

京东科技开发者

架构设计 系统 scrm 企业号 1 月 PK 榜 电销

年终盘点丨最受开发者欢迎的文章 TOP20

阿里巴巴云原生

阿里云 云原生

Rewrite sqllogictest framework in rust

Databend

EMQX+阿里云飞天洛神云网络NLB:MQTT消息亿级并发、千万级吞吐性能达成

EMQ映云科技

阿里云 物联网 IoT mqtt 企业号 1 月 PK 榜

SOA 和微服务有何区别?

江南一点雨

Java 微服务 springboot SOA

阿里云开源大数据平台EMR全面升级 性能最高可提升6倍

阿里云大数据AI技术

大数据 云原生 大数据 开源

一文了解 Go time 包的时间常用操作

陈明勇

Go golang time

醉三皇成为第12届北京国际网络电影展官方指定用酒品牌

联营汇聚

安畅携手阿里云共建Landing Zone方案,助力企业上云无忧

云布道师

阿里云

表格集算表高性能原理——怎样实现纯前端百万行数据秒级响应

葡萄城技术团队

如何实现发送评论时总数自动加一?

Towify

Kstry流程编排框架

lykan

软件架构 模块化 流程编排 高并发编程 业务可视化

构建并运行 Databend

Databend

databend

高级前端常考手写面试题合集

helloworld1024fd

JavaScript

简单谈谈Redis中的几种java客户端以及优缺点!

风铃架构日知录

Java redis 程序员 程序人生 客户端

排障定位时间缩短一半, 博睿数据如何赋能青岛住房公积金管理中心

博睿数据

APM AIOPS 智能运维 博睿数据 精选案例

程序员该如何用“高科技”智能地教狗狗上厕所

风铃架构日知录

人工智能 深度学习 程序人生 后端 系统架构

ThreadLocal源码解析及实战应用

京东科技开发者

Java 源码 技术 后端 企业号 1 月 PK 榜

前端必会手写面试题合集

helloworld1024fd

JavaScript

每日一题之Vue的异步更新实现原理是怎样的?

bb_xiaxia1998

Vue

如何使用API Hub 实现一个图片列表

Towify

《隐私计算白皮书(2022年)》概览

京东科技开发者

技术 安全 隐私保护 白皮书 企业号 1 月 PK 榜

从零手写react-router

helloworld1024fd

JavaScript

那些炫酷的CSS文字效果之诗词《兔》

南城FE

CSS css3 前端 动画

从零开始实现一个Promise

helloworld1024fd

JavaScript

Java高手速成 | Java集合类泛类型

TiAmo

Java 泛型 编程语言、

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