让视障者的网络之路少一些障碍——微软为 Edge 浏览器开发自动图像描述功能并呼吁网页作者补充图片的替换说明
网页是互联网的组成部分,浏览器是开启互联网大门的钥匙。对于生活在信息时代下的我们而言,每一个人都很难离开网络而生活,其中也包括盲人这一残障群体。
本文的引子是如下一条新闻:
IT之家3月18日消息,微软Edge无障碍功能迎来好消息,现在该浏览器能够自动生成图片标签,也就是意味着屏幕阅读器能够描述图像的内容,即使这些图像没有包含alt文本。对于那些想知道图片内容但看不到的盲人或其他视障用户来说,这是一个非常有帮助的功能。
微软也指出,这些自动生成的标签仍然不如页面作者自己提供的alt文本好,因为作者可能知道更多关于图像的具体内容,而Edge所能提供的信息肯定有不准确的地方。尽管如此,考虑到“屏幕阅读器处理的图像中有一半以上缺少alt文本”,微软认为,这一解决方案还是有帮助。
也许,你看完这条新闻很懵,也许你会赞叹于微软的暖心之举,不过笔者可不是这样认为的。一起跟随笔者仔细剖析这条新闻被后的那些细节吧!
这项功能解决了什么问题?
任何一项心功能的开发都源于有相应的需求。要理解微软为什么为 Edge 开发一项从图片中提取描述性信息的功能,就要先了解一下背景知识。
你有思考过,你撰写的文章也会被盲人朋友阅读吗?文章配图的内容又应该怎样友好地传达给视障读者呢?实际上,你的文章很有可能会被盲人用户阅读到,先不要吃惊,还是来了解一下帮助视障者上网的辅助技术吧。
失明的视障者通过屏幕阅读器(国内通常称作读屏软件)来浏览网页。屏幕阅读器可将网页中的文本信息大声朗读出来。
当视障者遇到图片的时候,依赖图片提供的替换文字说明了解图片中的内容。替换文字说明用清晰明了的文字描述图片/图表中的信息,以帮助视障者更好地理解网页及图片所要表达的内容,这对于 Web 页面实现让所有人可被访问至关重要。因此,网页作者应尽可能给每一幅图片添加准确的替代文字描述信息。
为了能让盲人等障碍用户准确获取图片中的有效信息,应该给每一张图片添加清晰明了的、必要的替换文字说明。
然而,现实情况是大量的图片缺少了有价值的、明了的替换文字说明。思考一下可能有这么几个方面的原因:
网页作者不知道图片的替换文字说明的重要性。他们可能根本不会预想到,会有盲人阅读到他们撰写的图文。
贴图更简单,可以避免排版的麻烦。常见于很多微信公众号转发的一些信息。
电商的海报页,需要用图片来展示他们的产品。
基于这样的现实情况。作为Edge 浏览器的开发者的微软,想起了自己有相应的技术可以改善视障者的网页体验——借助于计算机视觉的力量。
当视障者打开一张网页后,如果 Edge 浏览器发掘页面内包含未添加替换文字说明的图像,就把该图像提交到 Azure 计算机视觉云服务,接着将获取到的有价值的信息补充到图像的替换文字说明上面去。
这样,对于视障者来说,上网冲浪的体验就大大改善了。通过计算机视觉提供的一些信息,他们可大致了解图像中的内容,也更容易理解图文要表达的内涵。
题外话,,早在 Edge 浏览器之前, Google Chrome 浏览器已经率先实现了该特性。
我是视障者,我如何体验这项服务呢?
目前,该项服务只在 Windows、Linux 和 MacOS 版的 Edge 浏览器中提供。
由于图像需要发送到云端处理,这项服务需要你主动开启并接受微软的隐私条款,开启的方法如下:
启动 Microsoft Edge 浏览器,并打开“设置”页面,切换到“辅助功能”分类。你也可直接访问 edge://settings/accessibility 来打开该设置页面。
点击 “从 Microsoft 获取屏幕阅读器的图像说明” 复选框,接着在弹出的对话框中同意隐私声明。
启用该功能以后,你就可以尝试浏览那些不太友好的页面。Edge 浏览器应该开始帮助你描述图片中的文字了。
由于该项功能刚刚推出,难免会遇到几个问题。在这里也一并写出来,希望微软能关注到并及时优化吧。
描述性文字可能是英语的。由于 Azure 计算机视觉服务的原因,很多描述性文案是英语的,希望微软能及时汉化。
对于那些添加了错误替换文字说明的图像,无法享受到该项服务。希望微软可以在图像的右键菜单中提供强制手动获取替换文字说明的菜单项。
我是网页作者,我如何做会对视障者朋友更友好?
如果你是网页作者/新媒体编辑,恰好读到了这篇文章。我希望你也能力所能及的做一些事情,让盲人小伙伴的网络生活更精彩。
首先要明确。即使诸如 Edge/Chrome 浏览器提供了描述图像的功能,也不能认为网页作者就高枕无忧了。Edge/Chrome 浏览器通过计算机视觉提供的服务依然极为有限,并且网页作者依然要对自己的网页负责,做好网页中图像的正确说明工作,添加必要的标记信息。
为图像添加描述文本有多种方法,下面一一介绍,希望你能采纳最适合你的图文的一种方法。
提供有价值的替换文字
给图像添加替换文字说明是最简单、也最常用的方法。这种方法有两个好处。其一是不会影响到明眼阅读者的体验,替换文字说明指会提供给使用屏幕阅读器的视障者;其二,当图片无法被显示的时候,替换文字说明就会显示出来,帮助读者搞明白这里原来是一张怎样的图片。
在 HTML 中,添加替换文字说明的方法是给 img 图像标签增加一个 alt 属性,并设置对应的描述文本值。
你可参考这里的教程了解更多有用的信息。
对于使用 Word 写作的创作者,可参考这里的说明来提供有用的替换文字说明。值得要说的是,比较心版本的 Microsoft Word 会自动给插入的图像添加替换文字说明。可见微软对于无障碍是多么的重视。创作者只需要进一步打磨生成的替换文字就好了。
另外需要强调的是,替换文字说明尽量要用一两句话描述清楚图像的主要内容。不是越多越好,也不是越详细越好。简明扼要,突出重点才是视障者所需要的。
在图片周围添加描述性文字
有的平台可能不允许作者简单的指定图片的替换文字说明,或者文字说明也希望可以帮助到明眼读者的话,可以把描述性的文字放到图像的旁边。
装饰性的图片,无需说明
如果一张图片只是装饰性的、没有任何有用信息传达的,例如说背景图像,就应该提供一个空白的替换文字说明,以提示屏幕阅读器,忽略该图像。详细你可参看这里的指南教程。
在 HTML 中, 给 img 标签提供一个空值的 alt 属性即可。
如果你在 Microsoft Word 中写作,在“替换文字”对话框中选中“标记为装饰”复选框。
最后小结
在图文无处不在的网络世界里,我们希望每一个人都能找到有用的内容。微软敏锐的发现了少数人的需求,并用科技的力量力所能及的提供一些便利。这正是科技发出的最暖心的光。在为微软点赞之后,我们更希望网页创作者能主动承担起责任,让每一福图的美传达给每一个人。
举手之间,做出一些改变,就可以让世界更美好。让每一个人参与进互联网的绚丽生活中来吧!
参考资料
要了解更多吗?以下是关于本文的一些参考资料。
2.. Appears to say: Microsoft Edge now provides auto-generated image labels - Microsoft Edge Blog
让视障者的网络之路少一些障碍——微软为 Edge 浏览器开发自动图像描述功能并呼吁网页作者补充图片的替换说明的更多相关文章
- 自学工业控制网络之路1.1-工业控制系统发展历程CCS DCS FCS
返回 自学工业控制网络之路 自学工业控制网络之路1.1-工业控制系统发展历程CCS DCS FCS 工业控制系统是对诸如图像.语音信号等大数据量.高速率传输的要求,又催生了当前在商业领域风靡的以太网与 ...
- 自学工业控制网络之路1.2-典型的现场总线介绍PROFIBUS
返回 自学工业控制网络之路 自学工业控制网络之路1.2-典型的现场总线介绍PROFIBUS 目前看来,现场总线标准不会统一,多标准并存现象将会持续. 现场总线国家标准: 中国的DeviceNet和AS ...
- 自学工业控制网络之路1.3-典型的现场总线介绍FF
返回 自学工业控制网络之路 自学工业控制网络之路1.3-典型的现场总线介绍FF 1994年6月,ISP和WORLDFIP合并成立现场总线基金会FF.1998年,FF基金会开发了HSE 10/100Mb ...
- 自学工业控制网络之路1.4-典型的现场总线介绍CAN
返回 自学工业控制网络之路 自学工业控制网络之路1.4-典型的现场总线介绍CAN 1991年3月,发布了CAN技术贵干v2.0,包含了A.B两部分.CAN2.0A给出报文标准格式,CAN2.0B给出了 ...
- 自学工业控制网络之路1.5-典型的现场总线介绍DeviceNet
返回 自学工业控制网络之路 自学工业控制网络之路1.5-典型的现场总线介绍DeviceNet 2002年10月DeviceNet被批准为中国国家标准GB/T18858.3-2002,并于2003.4. ...
- 自学工业控制网络之路1.6-典型的现场总线介绍Interbus
返回 自学工业控制网络之路 自学工业控制网络之路1.6-典型的现场总线介绍Interbus 1987年正式公布,其主要技术开发者为德国的PhoenixContact公司.1996年,INTERBUS成 ...
- 自学工业控制网络之路2.2-PROFINET
返回 自学工业控制网络之路 自学工业控制网络之路2.2-PROFINET PROFINET由PROFIBUS国际组织(PROFIBUS International,PI)推出,是新一代基于工业以太网技 ...
- python 之路,Day27 - 主机管理+堡垒机系统开发
python 之路,Day27 - 主机管理+堡垒机系统开发 本节内容 需求讨论 构架设计 表结构设计 程序开发 1.需求讨论 实现对用户的权限管理,能访问哪些机器,在被访问的机器上有哪些权限 实 ...
- iOS网络高级编程:iPhone和iPad的企业应用开发之错误处理
本章内容 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcWluZ2h1YXdlbmthbmc=/font/5a6L5L2T/fontsize/400/fi ...
随机推荐
- sql中数据统计
今天来说一下使用sql统计数据. 用的H2数据库,用的是DBeaver连接工具.有三表,打印表PRINT_JOB,复印表COPY_JOB和扫描表SCANNER_JOB (这段可以忽略)任务是要统计相同 ...
- Kubernetes:存储管理
Blog:博客园 个人 参考:Volumes | Kubernetes.Persistent Volumes | Kubernetes.Kubernetes 基础入门实战 简单来说,存储卷是定义在Po ...
- volatile 变量和 atomic 变量有什么不同?
Volatile 变量可以确保先行关系,即写操作会发生在后续的读操作之前, 但它并不 能保证原子性.例如用 volatile 修饰 count 变量那么 count++ 操作就不是原子 性的. 而 A ...
- DateUtils互转工具类
public class DateUtils { /** * 取系统默认时区ID */ private static final ZoneId ZONE_ID; static { ZONE_ID = ...
- 面试问题之C++语言:mutable关键字
转载于:https://www.cnblogs.com/xkfz007/articles/2419540.html mutable关键字 mutable的中文意思是"可变的,易变的" ...
- Linux用户身份与文件权限学习笔记
用户身份 管理员UID为0:系统的管理员用户 系统用户UID为1~999:服务程序会有独立的系统用户负责运行:防止被黑客入侵进行提权,并有效控制被破坏的范围 普通用户UID从1000开始:是由管理员创 ...
- HTML 5中不同的新表单元素类型是什么?
HTML 5推出了10个重要的新的表单元素: Color. Date Datetime-local Email Time Url Range Telephone Number Search
- 对Flex布局的总结与思考
阅读本文之前最好对flex布局有基本了解,可以通过"参考资料"中列举的资源来学习. flex布局规范的设计目标 一维布局模型(one-dimensional layout mode ...
- 五款轻量型bug管理工具横向测评
五款轻量型bug管理工具横向测评 最近正在使用的本地bug管理软件又出问题了,已经记不清这是第几次了,每次出现问题都要耗费大量的时间精力去网上寻找解决方案,劳心劳力.为了避免再次出现这样的情况,我决定 ...
- MySQL外键约束On Delete和On Update的使用
On Delete和On Update都有Restrict,No Action, Cascade,Set Null属性.现在分别对他们的属性含义做个解释. ON DELETE restrict(约束) ...