SuperAPI AI 工具集

sensory-instructions

前端与建站

查看项目

更新于 10-16 06:56

技能介绍

用途

该技能用于在审查已渲染的 HTML、交互组件或设计系统模式时,检查是否存在“仅依赖感官线索”的指令问题。其核心目标是确保界面指令不单纯依赖颜色、形状、位置或声音来传达信息,从而让色盲用户、屏幕阅读器用户和听障用户也能理解。

主要能力

  • 快速参考:列出不应仅用颜色传达信息(如红色代表错误)、应为形状和位置引用添加文字标签、为音频提示提供视觉替代方案、组合多种线索等要点。
  • 检查:审查指令,确认它们不依赖颜色(“点击红色按钮”)、形状(“圆形图标”)、位置(“右侧的菜单”)或声音(“听到哔声时”),并确保文字标签补充视觉线索。
  • 修复:为视觉指令添加文字标签,例如将“点击绿色按钮”改为“点击提交按钮(绿色)”,组合多种线索,使无法感知某一种线索的用户仍能通过另一种理解。
  • 解释:说明色盲用户无法区分仅靠颜色的线索,屏幕阅读器用户无法感知位置或形状,听障用户会错过仅靠声音的信号,因此多模态指令至关重要。
  • 代码审查:审查影响该规则的已渲染标记和交互状态,标记违反规则的具体元素、角色、标签、焦点行为或键盘交互,并说明如何用浏览器无障碍工具或辅助技术验证修复。

使用方式

该技能适用于审查已渲染的 HTML、交互组件或设计系统模式。使用时,先检查原生语义,再依据快速参考和检查项进行核对,发现问题后按修复建议添加文字标签并组合多种线索。代码审查环节可结合浏览器无障碍工具或辅助技术进行验证。完整实现细节、代码示例和框架相关指导见 references/rule.md。规则页面为 https://frontendchecklist.io/rules/accessibility/sensory-instructions。

适用场景

  • 审查网页或应用中的交互组件,确保指令不依赖单一感官线索。
  • 检查设计系统模式,避免仅用颜色、形状、位置或声音传达信息。
  • 在代码审查中标记无障碍问题,并验证修复效果。

限制

该技能的具体实现细节、代码示例和框架相关指导需参考 references/rule.md,当前资料未提供这些内容的详细说明。其他未提及的功能、收费、价格、平台或效果暂未提供。