大家好，我是Rima，今天我想和大家谈谈AI辅助开发中无障碍规范的成本问题。或者用我喜欢的说法：别再浪费算力去构建那些用户无法使用的产品了。因为归根结底，什么是无障碍？无障碍是指无论是否有残疾，任何人都能使用产品的特性。这意味着，当你构建一个不具备无障碍功能的产品时，该产品本质上就是无用的，因为人们无法使用它。

我认为这是一个非常普遍的话题，尤其是在当下的“氛围编码”、提示词工程以及AI几乎为我们编写所有代码的时代。我们需要确保，即使大部分代码由AI生成，我们仍然是在为人类构建产品，并确保人们能够使用这些产品。一天内快速开发出五个不同的应用固然很好，但如果用户无法使用它们，那究竟有什么意义呢？

WebAIM的一项研究显示，全球排名前100万的网站中，有96%的主页存在某种形式的无障碍问题。我是一名经常四处演讲倡导无障碍理念的人，每当我问人们为什么不构建无障碍网站时，通常听到的回答是：“这太耗时了。”虽然我承认无障碍确实是一个劳动和时间密集型的流程，但我认为在AI编写大部分代码的今天，使产品具备无障碍功能实际上更容易了。

事实上，我认为构建不具备无障碍功能的网站反而需要花费更多的时间和金钱。因此，我决定利用工作中的代码库进行一个小实验。我向AI代理发送了一个提示词：“仅根据Figma设计稿实现此功能”，这是一个没有任何指导原则的简单指令。我让代理运行了两次：第一次不使用任何无障碍技能，第二次则使用我自己编写的无障碍技能。

我注意到，代理构建具备无障碍功能的版本不仅速度更快，而且使用该技术时成本降低了58%。我们可以查看这里的数据：结果显示，不仅更便宜，而且在使用无障碍技能时完成提示词所需的时间仅为原来的三分之一。因此，结论是：我们不能简单地说AI代理构建无障碍网站实际上更便宜。

但我们也不应断言这一点，因为这是一次孤立的实验，且未在受限环境中进行，因此不能作为证明这一点的实证数据。但是，当我们深入研究为什么AI代理在没有无障碍技能的情况下执行提示词需要更长时间时，我们就能更好地理解为什么构建具备无障碍功能的网站实际上更快。

在进入正题之前，大家好，我是Joreima Abu。我在Case工作，这是一家另类投资平台。我也是Google开发者专家、微软最有价值专家（MVP），以及无障碍核心能力认证专业人士。基本上，我喜欢四处宣讲如何让网络变得更加易于访问。此外，我要做一个小小的免责声明：虽然我的许多无障碍示例都基于网页，因为这是我的专业领域，但这同样适用于你正在工作的任何平台，无论是移动端、硬件还是其他任何东西。

让我们回到正题。这是你的AI代理。它是一个超级智能工具，几乎可以做世界上任何事情，但与此同时，它只有3年的历史。就像婴儿一样，AI非常容易受暗示。如果你告诉它足够多次“天空是红色的”，最终它会开始接受这个事实。这意味着，作为负责的开发者，我们必须确保为AI代理提供正确的技能和指导，以构建我们期望它们开发的产品。

我喜欢Netflix上的一档日本节目叫《小任务》（Old Enough）。这档节目主要讲述幼儿被派去执行第一次跑腿任务的场景。比如让一个3岁的孩子独自去超市买杂货。我喜欢这档节目的地方在于，你总能看到父母在孩子出发前所做的准备工作。

例如，孩子可能已经和父母多次去过超市，或者他们提供了一份非常详细的清单，清楚地显示超市在哪里、需要买什么物品以及应该避开哪些路径。这基本上使得孩子执行跑腿任务变得容易得多。对AI代理也是如此：当你给代理下达指令，比如“构建这个网页”或“实现此设计”，如果你提供正确的技能和提示词，就能让代理更容易避免走弯路，并确保最终产品符合你的预期。

那么，让我们看看当我们不给AI代理提供任何开发指导时会发生什么。首先，人类偏见会变成AI偏见。多年来，人们一直在构建不具备无障碍功能的网站或产品，因为坦白说，我们从未那样思考过。尤其是作为开发者，我们往往抱有“在我电脑上能跑就行”的心态。

我会想：“这东西在我的笔记本电脑上运行正常，也按照我预期的方式工作，我不需要检查其他任何东西。我不关心它是否兼容屏幕阅读器，也不关心在低光环境下是否能用。我只觉得它能运行、已构建完成，任务结束。”无论你以这种方式构建产品，还是拥有反映这种心态的代码库，一旦将AI代理放入其中，它就会吸收所有的偏见。

它会说：“哦，我们不需要使这些东西具备无障碍功能，因为过去从未提及过这一点。所以我就随便构建吧。”然后你越是用这个AI代理生成代码，你就越是建立一个本质上不具备无障碍功能的代码库，因为从一开始就没有将无障碍作为约束条件。

其次，这也是我在实验中真正注意到的：AI倾向于默认生成大量冗长的代码。如果你不给代理提供任何特定的提示词或指导原则，它会随心所欲地重复造轮子。即使你告诉它“只构建一个简单的手风琴组件”或“构建一个模态框”，它也不会 bother 去检查是否已经存在具有相同功能的现有语义元素。

它只会从头开始构建一个。AI喜欢编写代码，所以它会尽可能多地去写。正如你在这里看到的，如果你试图重新创建一个语义元素，需要花费更多的时间和精力，因为首先，你必须执行大量的……

更多的测试，你必须实现更多功能来复制原生功能，这只是一个非常繁琐的过程。因此，这些是你希望在向代理提供提示时要确保关注的一些事项。我曾见过一个比喻，说无障碍网站就像蓝莓松饼。如果有人递给你一个普通的松饼，上面硬塞了一堆蓝莓（类似于右边的图片），那并不是真正的蓝莓松饼。要成为像左边那样的正宗蓝莓松饼，蓝莓必须在烘焙之初就融入其中。无障碍网站也是如此。如果你有一个完全建成的网站，然后在完成后才开始在不同位置塞入区域标签（area labels），这并不是一个无障碍网站。要成为无障碍网站，你需要在每一个构建过程中都将可访问性放在首位。这不仅适用于开发人员，可访问性是每个人的责任。因此，你要确保从商业创意到设计再到质量保证（QA），我们都在寻找可访问性并测试该产品是否能让每个人以完全相同的方式使用。而等到最后才考虑无障碍的问题在于，你会浪费大量时间进行回归测试。所以，如果你一直等到网站完全建成才开始测试并回头修复问题，你最终需要重构和重写的代码量会比从一开始就构建无障碍功能时多得多。

当然，构建不可访问的产品会带来商业后果。我有时听到的说法是，企业可能会说：“哦，但我们不需要考虑无障碍性，因为我们的用户都不依赖辅助技术。”我觉得这很有趣，因为这有点像自我实现的预言。并不是你的用户不依赖辅助技术，而是使用辅助技术的人根本无法访问你的网站，所以他们根本就不会去。想象一家没有门的商店，你永远不会有顾客，他们怎么进大楼呢？构建不可访问的产品也是如此。如果你构建了一个人们无法使用的产品，那么人们就不会使用它。最后，不使网站具备无障碍性还会带来法律后果。在美国，《美国残疾人法案》规定，任何面向公众的产品必须对残障人士无障碍且可被使用，否则你可能面临罚款甚至诉讼。但另一方面，你可以获得一个非常可爱的微软 Teams 贴纸，所以你知道的，权衡一下你的选择。基于所有这些，我们可以看到构建不可访问的产品实际上要昂贵得多。你面临着因客户流失而损失金钱的风险、可能面临需要支付罚款的诉讼，以及花费更多时间构建代码和重构事物。因此，如果你从一开始就使产品具备无障碍性，它将快得多且便宜得多。

既然我们已经知道了这一切，我们如何确保我们的 AI 代理构建的是无障碍内容呢？因为每个人的代码库都不同，而且我们可能使用不同的技术，我将仅给出一个总体概览，说明如何让你的 AI 代理生成无障碍代码。首先，你需要定义你的无障碍需求。无障碍需求因你工作的平台而异。因此，你需要进行研究并确保你知道为所构建的平台应满足哪些无障碍需求。完成这一步后，你需要审计现有的代码库。因此，如果你要将 AI 代理引入你的代码库，你需要确保没有预先存在的问题被 AI 代理误认为是最佳行为而复制。你可以使用自动化工具进行无障碍测试，或者甚至告诉你的 AI 代理去做这件事。但你要识别任何现有问题并在开始编写新功能之前修复它们。然后，你想要实施某种可重用的系统。这是一个很好的附加功能，但基本上，如果你要处理无障碍性，在一个在多处使用的组件中修复问题要比在不同文件中的相同组件上进行修复要容易得多。因此，拥有一个已实施的 Design System 或任何形式可重用组件库将在长期内为你节省大量时间，以便使事物具备无障碍性。

最后，你想要强制执行一项强制性的无障碍技能（skill）。这是你的 AI 代理在运行任何可能与生成 UI 或编写需要无障碍性的代码相关的内容时基本上都会使用的技能。我非常喜欢使用的一项技能是 Chrome 的“现代 Web 指南”（Modern Web Guidance）技能。这基本上是一项确保你的代理使用最新的 HTML 和 CSS 功能而不是自定义 JavaScript 实现的技能。你也可以拥有轻量级的无障碍技能版本。我认为这非常重要，特别是如果你像“氛围编程”（vibe coding）那样工作或者不在大型代码库中工作时。你只需要一些快速的东西供你的代理参考，而不需要进行大量深入研究。这是我建议满足最低限度无障碍需求的方法。因此，你要确保尽可能使用语义化 HTML，仅在语义化 HTML 无法表达行为时才求助于 ARIA。每个交互元素如果可以通过鼠标操作，也应该通过键盘操作。你还要确保元素被正确标记并可以被屏幕阅读器读取。最后，在运行代码之前，你的代理应根据所有这些步骤进行审计。当然，这不足以构建一个完全无障碍的网站。你仍然需要自己进行大量手动测试，因为不可能仅靠一种工具使网站完全无障碍。但是，拥有这些技能总比没有它们要好得多。

无论出于什么原因使用 AI，大多数时候的目标是解决特定问题。因此，只需确保你的解决方案对尽可能多的人有用即可。所以，构建无障碍的事物。这就是全部了。非常感谢大家聆听我的演讲，我希望你喜欢它。如果你有任何问题，欢迎通过 Jemima Abu 在线联系我，无论是 LinkedIn、Twitter 还是 GitHub。我很乐意听到你的声音。好的，再见。