浏览器检查与提取

免费网页无障碍标签检查工具.

缺失的无障碍标签和不清楚的名称。

结合表单语境,为访客需要理解的控件准备对应的具体标签修正。

需要 Chrome 扩展程序和账号。
每月 25 次免费自动化任务,所有工具共享。受浏览器连接提供方的限制约束。

需要准备的内容

已渲染的表单字段和控件。

开始使用

可按需调整的任务。

在这里复制,准备好后粘贴到 WebAct。

本页用于准备提示词,任务在 WebAct 中运行。

01

按需调整任务。

检查上方提示词,添加你的目标和重要要求。

02

带到 WebAct 中。

打开来源页面,启用 WebAct,选择相关且可读取的内容。粘贴任务,并补充任务要求的其他来源材料。

03

检查有用的部分。

结果涵盖你提供或选定的可读取内容。先展开相关页面部分,再检查输出是否包含预期记录。

实用指南

如何检查表单控件的无障碍标签。

检查标签时要同时查看程序可识别的名称和可见语境。单靠旁边的文字未必建立了无障碍关联。

按任务需求调整流程。

检查每个控件的程序化名称及其与可见标签的关系。核查显式标签、包裹式标签和相关 ARIA 引用,报告缺失或误导性的名称及元素位置。自动检查无法判断含义时,加入人工审阅。

你需要提供什么
已渲染的表单字段和控件。
你会得到什么
缺失的无障碍标签和不清楚的名称。

查看输入和结果。

演示用输入和输出 · 教学示例,并非 WebAct 实时运行结果

示例 个输入项

Supplied markup: <span>Email</span><input id="email" type="email">. No other naming attributes. Correct the label association.

完整示例

Finding: the visible caption has no programmatic association with the input.
Proposed markup:
<label for="email">Email</label>
<input id="email" type="email">

Verify the id is unique and the control's accessible name is Email in the complete page.
下载此示例

将这份输入载入提示词,再复制到 WebAct 中尝试任务。实际结果可能与示例不同。

决策与问题排查。

占位提示文字可以替代持续显示的表单标签吗?

输入时它可能消失,因此不能可靠地替代清晰且正确关联的标签。既要检查可见名称,也要检查程序化名称。

为什么可见的说明文字没有被读作输入框标签?

可能缺少有效关联,例如相匹配的 for/id 属性对。应检查关联关系,而不仅是距离。

使用自己的资料试一试。

将任务提示词中的示例换成你的材料。保留所需条件,再把任务复制到 WebAct。

自定义并复制任务 ↑
开始之前

使用 WebAct。

提示词和示例在本页提供。请在 WebAct Chrome 扩展中运行任务。

这个工具免费吗?

你可以在这里免费复制和编辑提示词。要在 WebAct 中使用,请安装 Chrome 扩展,创建并验证账户,然后连接可用的浏览器 ChatGPT 会话。Free 方案每自然月包含 25 次由用户发起的自动化任务,所有工具共享。普通浏览器 Chat 单独计算;仍受提供方限制约束。

有关共享上下文,请参阅我们的 隐私政策 以及如何选择 Chat 或 Task.

从提示词到你的实际工作

将任务带到页面上。

安装 WebAct,加入原始材料,再按需调整结果。

安装 WebAct