Press This：AI 能让 Web 更具无障碍能力吗？

欢迎来到 Press This，这是 WMR 旗下的 WordPress 社区播客。每一期节目都会邀请社区中的嘉宾，并探讨 WordPress 开发者所面临的最重要议题。以下是原始录音的文字稿。

由 RedCircle 提供支持

Doc Pop：您正在收听 WMR 的 WordPress 社区播客 Press This。我们每周都会聚焦 WordPress 社区的成员。 

我是您的主持人 Doc Pop。我通过在 WP Engine 担任的职务以及在 TorqueMag.io 上的贡献，为 WordPress 社区提供支持。您可以在 RedCircle、iTunes、Spotify 或您喜爱的播客应用上订阅 Press This。您也可以直接从 WMR.fm 下载节目。 

今天我们将深入探讨一个既处于前沿、又对打造更具包容性的网络至关重要的话题：AI 与无障碍，以及两者如何协同发挥作用。 

今天我非常高兴邀请到 Equalize Digital 的 CEO Amber Hines。她最近在 DE{CODE} 2024 上的主题演讲中探讨了 AI 的潜力以及如何让网站更具无障碍性，令我们的观众印象深刻。

在今天的对话中，Amber 和我将探讨这些前景与风险，以及您如何利用生成式 AI、大型语言模型和其他一切技术来增强 WordPress 网站的无障碍性。Amber，非常感谢您今天加入我们。

Amber Hinds：是的，感谢您的邀请。

Doc Pop：既然我们是在上周录制，那就先从那场 DE{CODE} 演讲聊起吧。

我有机会看完了整场演讲，真的很享受。我只是 wondering，你能不能简单总结一下：DE{CODE} 是什么，你在那里做了什么演讲？

Amber Hinds：当然，DE{CODE} 是 WP Engine 面向开发者的会议，也是少数几场完全聚焦开发者的 WordPress 大会之一，这一点很不错。 

我作为主题演讲的一部分，做了一场大约五分钟的闪电演讲，整场主题演讲都围绕 AI 展开。当然，作为一个无障碍倡导者，我谈到了 AI 对无障碍的影响，包括积极和消极的一面。

Doc Pop：是啊，在大型语言模型和生成式 AI 成为炙手可热的新事物之前，市面上就有许多工具声称可以轻松解决无障碍问题。尤其是在 WordPress 领域，有大量无障碍覆盖层或各种工具，声称只需快速修复——下载这个插件，一切就都好了。

而这些工具经常受到批评，因为它们实际上并没有修复问题，只是让网站所有者感觉自己好像做了些什么，却并没有真正为用户解决问题。AI 会不会也一样，还是说对我们而言会有所不同？

Amber Hinds：是的，那些无障碍覆盖层，你知道，我觉得我们差点要提到的是，人们目前仍在批评它们，对吧？它们之所以现在受到批评，是因为它们提出了许多非常夸大的说法。而无障碍面临的最大挑战在于，并不是每个问题都能通过自动化测试工具检测出来。

所以，如果你无法自动发现所有问题，那么，某个东西怎么可能出来把它们修复呢？这也正是人们用来批评这些覆盖层的地方。 

我认为某种程度上，这正是 AI 模型面临的一项挑战。你知道，这些大型语言模型是用数百万条内容训练的——实际上是全球数百万个网站上的数十亿条内容。 

但如果你查看 WebAIM 的报告，就会发现绝大多数网站都有容易检测到的无障碍错误。他们每年都会发布一份名为 WebAIM Million 的报告，根据 Alexa 排名扫描前 100 万个网站，并检查其中是否存在容易检测到的无障碍错误。其中 96% 的网站都有容易检测到的无障碍错误。 

这就成了一个问题，因为我们是在用无法访问的代码和无法访问的内容训练 AI 模型。你知道，我们可能都见过 ChatGPT——他们把它叫什么来着？幻觉？它会凭空编造东西。而且，如果你没有给出完全准确的提示词，它可能会给出稍有偏差的内容。

如果你没有受到足够充分的相关训练，可能就无法发现这些问题。因此，除非你的要求非常明确，比如使用 GitHub Copilot 等工具来协助编写代码，否则它可能会生成无法访问的代码。例如，它可能会用 div 而不是 button，因为很多网站都用 div 而不是 button。所以我认为，这是我们确实需要在 AI 方面解决的一项挑战。

Doc Pop：在我们这个领域，这叫作“垃圾进，垃圾出”。而在 AI 的语境下，我认为这通常是指，当模型用有偏见或不正确的数据进行训练后，它们就会把这些数据当作事实重复出来。

你在演讲中提到过，你知道，Copilot 是在一些不一定具备无障碍访问能力的网站上训练的。所以，如果你使用 GitHub Copilot 来帮助构建网站，它很可能会重复那些错误。 

我只是——原本希望你们能给出一个例子，而你刚才就提到了一个：button 和 div 的区别。你能不能快速告诉我们，为什么这两者不同？为什么这一点值得注意？

Amber Hinds：是的，对于无障碍访问来说，最重要的事情之一是使用语义化 HTML，也就是那些本身具有含义、浏览器能够解释并据此执行特定操作的 HTML 元素。 

所以，当我们谈到网站上的按钮时，有几种不同类型的按钮。在 WordPress 中，我们有 button 区块，它会添加按钮，但它们实际上并不是按钮，而是经过样式设置、看起来像按钮的链接。然后还有用于控制功能的元素，这些才是真正的按钮。 

比如，它们可能用于切换轮播图或幻灯片中的某一张内容，也可能用于提交表单，或者是你可以点击来展开和折叠手风琴面板的元素。这些应该使用 button。 

在语义化 HTML 中，我们会直接使用 button 标签。就像你知道的，<button>，你可以对它执行不同的操作。而且 button 标签可以获得键盘焦点。

因此，你可以使用 Tab 键将焦点移到它们身上，无需使用鼠标。你还可以用 Return 或 Enter 键以及空格键来打开和关闭它们。现在，很多开发者会采用一些方式来制作那些不具备语义的元素。 

所以，有些元素，比如 div 或 span，功能上却像按钮。我们在轮播或手风琴组件中经常看到这种情况：它们添加了 JavaScript，使用一个并非按钮的元素——可能是手风琴中的标题，也可能是轮播中的 div——来实际打开或关闭内容，或者切换到下一张幻灯片。 

但由于这些元素不具备相应的语义含义，因此无法通过键盘访问，而且只能使用鼠标操作。

Doc Pop：非常感谢你澄清这些问题。每次和你讨论这些内容，我都能学到很多，也很感谢你深入讲解。 

关于你提到的那些需要谨慎对待的问题，我还想再谈一点——稍后我们可能会讨论其中一些效果非常好的做法——其中一项需要谨慎对待的是：这些模型中有很多可能存在偏见；如果它们在生成替代文本，可能会出错。

这甚至不一定是基于其训练数据中存在的偏见而产生的错误，也可能只是因为它缺少照片被分享的具体背景语境。正如你所说，在能够生成代码之外，如果还能真正查看代码并理解它的作用，以及它是否采用了最佳实践，那么如果你使用它为网站上的图片撰写替代文本，并且之后有人会逐张查看和审核，这也可能很有帮助。

对吧？就像你所说的所有内容一样，听起来关键在于：你可以使用这个工具，但它不会取代任何人。仍然需要有人进行复核。

Amber Hinds：是的，替代文本非常有意思。现在有很多 WordPress 插件尝试连接并自动生成替代文本。我在演讲中提到过一个，即 alttext.ai；它有一点比其他工具做得更好：它会参考相关信息，比如你在 Yoast SEO 详细信息中提供的内容；在尝试生成替代文本时，它会查看文章标题，而不是仅仅把图片发送过去。

但替代文本高度依赖具体语境。我试过很多这样的工具，包括那一个。每次尝试时，我都以为它能节省我的时间，最后却会发现：“不，它弄错了。” 

比如说，如果图片是我团队中特定人员的照片，甚至是我个人博客上的照片，又或者是我家人的照片之类的，我不只想说“女人”，而是想写出我自己的名字，对吧？比如，替代文本应该写成“Amber 站在办公室中”之类的内容。 

我也曾在产品图片上试过。比如 T 恤图片上确实印有文字，但几乎没有任何工具能准确描述 T 恤上的文字。 

你可能会想：“好吧，如果有人想购买这件商品，而他们看不到它，那么他们必须知道 T 恤上写的是什么，才能决定是否想穿这件 T 恤，对吧？” 

所以这些情况相当具有挑战性，但我感觉在这方面还是存在一定的可能性，可能会取得一些快速进展；即使它最终只是为网站管理员提供一个起点，让他们之后还需要做一些编辑，也能有所帮助。

Doc Pop：说到这里，Amber，我们先短暂休息一下，让赞助商们——他们很可能是 T 恤卖家，而且 T 恤上印有很棒的文字——有机会插入他们的信息。 

不过，节目回来后，我们会进一步聊聊你们可能会推荐的一些工具，比如由 AI 驱动、与无障碍相关的工具。短暂休息后，请继续收看。

Doc Pop：欢迎回到 Press This，这是 WordPress 社区播客。我叫 Doc，今天我要和 Equalize Digital 的 CEO Amber Hines 聊聊无障碍、WordPress 和 AI。

Amber，你在这个领域已经深耕 15 年——在无障碍领域也有 15 年了。如今 AI 登场后，情况发生了翻天覆地的变化吗？

Amber Hinds：是的，我觉得确实如此。我的意思是，这方面已经取得了许多进展。我不知道。Doc，你看超级碗吗？

Doc Pop：不看。

Amber Hinds：不看，好吧。老实说，我也不太喜欢橄榄球，但我看了超级碗的一部分，其中有 Google 的一则广告，绝对值得大家去找出来看。他们把这称为“引导式视觉”，basically，这是一则从一名盲人——或者我应该说低视力人士——的体验或视角出发拍摄的广告，因此他并非完全失明。

他用手机摄像头自拍。当他举起手机时，系统会告诉他画面中有多少张脸。如果他没有把手机调整到自己合适的角度，它就会提示：“画面中没有检测到人脸。”然后他可以移动手机，它也会随之提示。但这则广告非常温馨，因为它会从画面中有一张脸变成两张脸。接着，你看到的场景看起来像是一间医院。最后，它当然以“画面中有三张脸”结束。 

不过，我确实觉得，过去几年里，AI 总体上为人们改善网络体验做出了许多贡献。我知道休息前我们谈到了替代文本。有些生成式语言模型可以对内容进行摘要。

ChatGPT 有一个名为 ChatPDF 的版本，你可以上传 PDF，它会为你生成摘要。这可能会很有帮助，因为很多人没有创建无障碍 PDF。因此，能够上传 PDF，并获得一段关于其内容或所含信息的文字说明，对屏幕阅读器用户来说可能非常有帮助；也可能帮助那些阅读水平较低、难以理解 PDF 中更复杂的医疗知识或更详细内容的用户，它可以用适合他们阅读水平的语言进行解释。

所以，我确实觉得 AI 做了许多积极的事情。

Doc Pop：你是否见过 WordPress 中有具体利用 AI 来提升无障碍性的产品，比如某个用户可以去了解的具体插件，或者多个插件？

Amber Hinds：老实说，我没有。我不确定自己是否真的有一个专门针对 AI、且与 WordPress 密切相关的优秀推荐。我要说的是，我们的 Accessibility Checker 插件会进行一些自动化测试。 

它尚未集成 AI，但我们正计划在某些领域很可能与现有的一些生成式 AI 模型集成，以改进我们的测试规则。不过遗憾的是，我目前还不知道有哪些真正值得向大家强烈推荐的插件。我觉得我们在这方面仍处于早期阶段。

Doc Pop：是的，目前还处于早期阶段。这就引出了我的下一个问题：如果有人正在开发这类工具，或者正在自己的网站上构建 AI 功能，那么在他们推进的过程中，有哪些最佳实践是应该牢记在心的？

Amber Hinds：这是个很棒的问题。我的意思是，总的来说，无论你在做什么，无障碍访问都非常重要。 

不过，如果你正试图寻找思路，并思考“如何利用 AI 来增强无障碍体验？”我会建议少考虑工具栏之类的东西，而可以想想“我们能否以某种方式让网站变得更智能，从而识别用户系统中的某些信息？”

例如，我们实际上可以检测用户是否将操作系统的配色模式偏好设置为深色模式。这样一来，网站——显然，你可以直接通过 CSS 编写代码来为网站设置深色模式——但在一些场景中，除了 CSS 编码之外，你可能会真正使用 AI 来改变其他一些体验。

我认为你必须对此保持谨慎，因为确实存在这样的可能：它可能不会……你懂的，它可能会移除某些内容。无障碍社区已经就此展开了许多讨论，比如是否应该建议大家说“哦，我能看出用户处于深色模式”，或者“我能看出用户正在使用屏幕阅读器，所以我要为他们提供更简化的网站版本”。

这样的做法不太好，但我认为人们或许可以做一些有创意的事情。我认为，聊天机器人可以成为非常有用的过渡性方案，前提是该聊天机器人已针对你的内容进行了充分训练，并且确实能够提供有用的信息。 

如果你没有真正优秀的搜索功能，或者网站的其他方面无法访问，那么，提供一种让用户可以直接提问并立即获得答案的功能会很有帮助。尤其是当你是一个较小的团队，无法全天候 24/7 安排真人与用户聊天时——它或许能在改善无障碍访问、帮助用户找到所需内容，以及绕过那些你可能仍在网站代码中着手修复的问题方面发挥很大作用。

Doc Pop：好的，如果你不介意的话，我想补充几点我认为可能很重要的事项。因为这些基本上对任何使用 AI 的人来说都具有广泛的意义，我想在这里也同样适用。 

透明度：如果你在自己的网站上部署了 AI 解决方案，就要对它保持透明。比如，以聊天机器人为例，应让用户知道这是一个聊天机器人，而不是试图欺骗他们，让他们以为…… 

Amber Hinds：它不是真人。

Doc Pop：对，不是真人。但总之，一定要保持透明。我的意思是，在很多情况下，我认为都应当说明“这段文字由 AI 生成”，即使它只是帖子中的一段文字或替代文本；或者如果你在使用生成式图像 AI——我认为这类情况始终都应该透明说明，这不是由真人完成的。

同样，我们还需要担责。这里的担责是指，如果你将 AI 作为解决方案的一部分，比如再次以聊天机器人为例，就要承认如果它说了错误的内容，你仍愿意为此负责或作出处理。 

就像你不会向用户提供错误信息，或者即便提供了，也希望你能说：“好吧，既然我们的聊天机器人这么说了，那看来我们得给你这个折扣。”

我只是觉得，在使用 AI 时，有些人可能会忽视问责这回事。他们会想：“哦，这是 AI。所以它显然偶尔会出错，人们应该对此有心理准备。”但如果你要部署这类工具……

Amber Hinds：对，我最近确实看到过一个与此相关的法庭案例。某公司的聊天机器人告诉一位客户可以获得全额退款。公司则表示：“嗯，我们的服务条款写的是不能退款。”但法院说：“这不重要。聊天机器人就是你的代理，它以你的业务名义运作，因此，客户完全有合理期待，认为聊天机器人会向他们提供正确的信息。”

所以我确实觉得，如果你在使用这类东西，就需要真正意识到，将它们用于整个业务可能会带来哪些影响。

Doc Pop：对。最后我想提的一点就是用户输入。 

一如既往，这一点非常重要。要倾听用户的声音，了解他们如何使用这项体验，以及它对他们来说效果如何。我不得不说，我见过一些推出 AI 的人，当用户对产品的理解与他们的预期不同时，他们并不高兴，也没有听取反馈并想：“哦，也许这并没有实现用户真正想要的功能”之类的想法。 

所以这三件事——透明度、问责制和倾听用户——对任何企业都很重要，但我认为，对于试图使用这些 AI 工具的人来说尤其重要。 

Amber Hinds：沿着这个思路，我认为与真实用户沟通非常重要，但也不要忘记将残障人士纳入其中，因为全球每六人中就有一名残障人士，美国每五名成年人中就有一名残障人士。 

他们是网站非常频繁的用户，有时甚至比我们想象的更频繁。我们希望确保我们所打造的一切也能对他们有效，而不只是对通常使用鼠标和键盘的健全人士有效。

Doc Pop：完全正确。就这个话题来说，除了 WordPress 领域之外，在如何使用 AI 让网站更具包容性方面，是否有任何你希望引入 WordPress 领域的方案，让你觉得“这个方案在这里有效，我们也应该采用”？

Amber Hinds：我确实知道一个方案，我会附上链接，方便你放进节目说明。不过我在 1 月份看到俄亥俄州立大学在他们的一则新闻中提到，该校的一些研究人员一直在努力利用 AI 创建智能代理，为人们完成非常复杂的多步骤流程。

比如说，如果我想飞往 WordCamp Europe，我们都知道预订机票会面临许多挑战。如果有一个可以通过语音控制的智能代理就好了。所以我们可以进行非常基础的操作，对吧，比如说：“嘿，Alexa，再给我订一些洗衣液。”然后她就会直接去办，对吧？

但是，如果我们能够完成真正复杂的任务，比如可以对我们的智能体说：“我需要在 6 月预订一次前往意大利参加 WordCamp Europe 的旅行”，它会知道具体日期，会去查询，告诉我机票价格，然后它会说：“好的，是的”，接着它会——你知道的——填写所有表单，输入我的信用卡信息，并自动为我完成所有事情。

我认为，如果 WordPress 领域能出现更多工具来尝试为人们自动化这些非常复杂的流程，那会是一件非常有意思的事。

说实话，就连通常具备相应能力的人也会使用它们，因为不必为了拿到飞机票或其他任何东西，而填写、你知道、八个不同的步骤，这感觉很好。

Doc Pop：嗯，没错，现实世界中是这样，网页上也是如此：无障碍对每个人都有好处。不只是对某些群体，而是我们所有人都会从更具无障碍性的网页中受益。 

说到这一点，我们要进行最后一次休息。回来后，我们将结束与 Amber Hines 关于 AI 和无障碍的对话。

敬请期待短暂休息后的更多内容。 

Doc Pop：欢迎回到 Press This——WordPress 社区播客。我们即将结束与 Amber Hines 关于 AI、无障碍和 WordPress 的对话。 

而且，正如我想我们已经非常清楚地说明的那样，AI 不是一个创可贴。不存在那种只要往上贴一贴就能解决所有问题的创可贴。但很多事情都有很大的可能性。

Amber 刚才谈到，比如，我们可以轻松预订一次 WordCamp 之旅，并让各种各样的事情都由它处理，整个过程变得非常顺畅。你知道，这对我们来说很难——因为这一切都还处于非常早期的阶段，所以我们很难确切看出 AI、WordPress 和无障碍结合在一起将意味着什么。

希望到明年这个时候，我们能看到许多很酷的案例；但正如我们所说，AI 并不总是创可贴，而且能够检查无障碍问题很重要。我确信不存在某个单一工具，只要运行一下就能自动检查所有可能的问题。不过，我知道 Amber，你有一款 Accessibility Checker 插件。

你能给我们稍微介绍一下这款插件，以及它是如何运作的吗？

Amber Hinds：是的，我们的插件是开源的，有免费版本可以从 WordPress.org 获取，也有付费版本。它基本上可以检查草稿页面，甚至在你发布之前就进行检查；也可以检查已经发布的内容。它会扫描这些内容，然后向你反馈，比如：你有一个没有有意义文本的链接。

比如你使用了“点击这里”这样的字样；图片缺少替代文本；你没有正确按顺序使用标题；哦，你放入了指向音频文件的链接，却没有提供文字稿，诸如此类。 

它会标出常见的无障碍问题，并将报告直接放在 WordPress 仪表板中。我们真正努力的方向，是让内容创作者更容易创建更具无障碍性的网站，并在使用插件的过程中学习无障碍知识。

Doc Pop：人们可以在哪里找到 Accessibility Checker 插件？

Amber Hinds: 是的，所以除了 WordPress.org 之外，如果你访问我们的网站 equalizedigital.com，上面有所有关于这个插件的信息，你也可以从我们的网站下载免费版。

Doc Pop: 说到这里，人们可以在哪里进一步了解你目前在网上开展的工作呢？ 

Amber Hinds: 是的，除了 equalizedigital.com 之外，你最常可以在 Twitter 或 X 上找到我，我的账号是 @heyamberhines。我偶尔也会使用 LinkedIn 和 Mastodon，但那大概不是最适合找到我的地方。

Doc Pop: 好的。那么非常感谢你今天加入我们的节目，Amber，真的很感激。

Amber Hinds: 感谢你的邀请，很开心。

Doc Pop: 也感谢各位听众收听 Press This，这是一档由 WMR 播出的 WordPress 社区播客。请访问 TorqueMag.io，查看这些节目的文字稿以及更多 WordPress 新闻和教程。 

我们的 Plugin Madness 竞赛目前也在进行中，你可以去那里支持自己喜爱的 WordPress 插件。 

你可以在 RedCircle、iTunes、Spotify 或 Overcast 上订阅 press this——Overcast 是我的最爱。你也可以直接从 WMR.fm 下载。 

我是你的主持人 Dr. Popular。我通过在 WP Engine 担任职务来支持 WordPress 社区，而我非常期待每周在 Press This 中聚焦这个社区的成员。

文章 Press This: Can AI Make The Web More Accessible? 首发于 Torque。