让视障者的网络之路少一些障碍——微软为 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