信息无障碍技术:让AI“联网搜索”更懂我们

2025年03月04日 1197阅读

很多人没意识到,除了人类视障者,过去几十年里,我们身边其实一直有一位机器“视障者”朋友,就是搜索引擎。而今年春节期间的DeepSeek的爆火,也让一位新的“视障者”朋友走进了公众视野,那就是非多模态的大语言模型。

前段时间,信息无障碍研究会专家委员会副主任黄希彤对这个问题开展了一些实验研究,探讨了替代文本对于搜索引擎和AI大模型产生障碍的机制,和解决这个问题的可能路径。

由于原文专业性较强,对于没有专业技术背景的读者理解起来比较困难,我们邀请黄老师和我们一起对这个研究进行了更详细的分析讲解。

注:

这里把非多模态的AI大模型形容为“视障者”是希望表达,它和使用读屏软件的视障者很像,可以“看”到网页上的文字信息,但是不理解网页上的图片。

替代文本原本是在互联网不发达的时候,图片经常加载失败或者用户为了节约流量而不加载图片内容的情况,显示给用户的替代图片的文本,后来读屏软件也使用它来实现对视障者描述图片的功能,在这篇文章中泛指各种能让读屏软件识别额外的文本标注信息的标注方式。

一、猜想

很久以来,我们一直注意到搜索引擎常常忽略网络文章中图片的替代文本信息,这导致很多有丰富替代文本细节描述的图文并茂的文章,并没有办法被正确的收录。

但是在过去我们只能对原因进行简单的猜想:可能是搜索引擎的爬虫程序主动丢弃了相关的无障碍信息。然而由于搜索引擎对文章收录过程的滞后性和最终排名的不可控性,要对猜想进行实验验证一直是比较困难的。

在带有网络搜索功能的人工智能服务出现以后,我们发现了相同的问题也出现在各种非多模态的大语言模型上。由于大语言模型使用了和搜索引擎相同的爬虫技术,这次,我们终于有机会对猜想进行验证了。

二、实验设计

因为要验证的猜想是爬虫会丢弃某一些无障碍信息,所以这个实验设计是:采用多种不同的替代文本标注技术来对相同的图片标注相同的替代文本信息 ,制作不同版本的测试网页后上传到服务器生成不同的测试网址,然后让大语言模型服务分别去访问这些网址并对内容进行解释,看看哪些类型的标准方式会被正确理解,哪些会被忽略。

具体讲,实验使用了四种不同的替代文本标注方式:

1、使用图片的标题属性(title)进行替代文本标注

测试网址:https://yslow.cn/2025/testTitle.html

2、使用图片的替代文本属性(alt)进行替代文本标注

测试网址:https://yslow.cn/2025/testAlt.html

3、使用面向读屏软件的读屏文本属性(aria-label)进行替代文本标注

测试网址:https://yslow.cn/2025/testAriaLabel.html

4、使用面向读屏软件的读屏文本标签(aria-labelledby)进行替代文本标注

测试网址:https://yslow.cn/2025/testAriaLabelledby.html

这几种方式都是常用的替代文本标记方式,也都可以被大部分现代读屏软件读取。

三、实验结果

把上述测试网址分别传递给kimi和DeepSeek(百度)并要求AI对内容进行解释后,两个AI都有了相同的表现:

使用标题属性、替代文本属性、读屏文本属性进行替代文本标注的网页图片,两个AI都无法理解网页内容。

使用读屏文本标签进行替代文本标注的网页图片,两个AI都能正确理解网页内容。

四、实验结论

网络爬虫(Spider)通常设计的比较简单和机械,它的设计者常常会认为网页上的『属性』信息对于理解网页没有帮助,因此会简单过滤掉其中的信息无障碍信息。但是如果使用『无障碍标签』的方式进行替代文本标注,他们不但不会过滤掉标注内容,还能把标注标签和被标注的标签进行正确的关联来确保AI获得正确的替代文本信息。

因此如果想要把网页设计的对障碍者、对爬虫、对搜索引擎和AI都无障碍,我们要尽量使用无障碍标签的方式而不是无障碍属性的方式进行替代文本标注。

五、补充实验

类似aria-labelledby的标注方式还有aria-describedby。为了进一步验证标签方式对爬虫的友好性,黄老师后续又补充了一个新的实验:

https://yslow.cn/2025/testAriaDescribedby.html

实验结果进一步证明了前面的结论。

图:通过kimi和DeepSeek验证实验结果

六、建议

为了让网页对视障人士、搜索引擎和AI都“无障碍”,我们建议大家可以尝试在含有图片的网页代码中采用以下方法进行无障碍标注:

1、试试用aria-labelledby和aria-describedby配合独立的替代文本标签来进行标注,这种方法可以让读屏软件和AI都能读到图片的说明。

2、如果替代文本对于明眼人读者没有意义或者带来阅读干扰,可以在页面上把他隐藏掉。但是不同的爬虫对于不同隐藏方式的处理不同,有一些方式会更容易被爬虫忽略掉。我们建议避免采用『display:none』和『visibility:hidden』这类隐藏方式,使用『width:0;height:0;z-index:-999』或者『opacity:0』这类方式隐藏的替代文本更有可能被爬虫保留。

3、测试你的网页:使用屏幕阅读器和 AI 工具测试你的网页,确保它们能够正确读取和理解内容。

4、持续关注无障碍标准:无障碍设计是一个不断发展和完善的领域,我们需要关注最新的技术进展,不断优化网页设计。

随着人们越来越多地借助AI大模型进行信息搜索,希望本文能够为网页设计师、产品经理、AI搜索优化师等不同群体带来启发。在AI时代,关注信息无障碍不仅有助于设计出更具包容性的产品,还能让更多的网站和内容被更广泛地“读懂”,从而提升用户体验和内容的可及性。

有技术背景的读者如果希望了解更详细的实验过程和源代码,欢迎通过公众号“疯狂的石头”查看原文《面向AI的信息无障碍》:https://mp.weixin.qq.com/s/qi9Inqm8pWV1Aol08Sf2RQ