Vibe Coding提示词AI入门
前端组件无障碍审计清单生成
输入组件用途与结构,输出可落地的 A11y 审计清单与修复建议。
提示词内容
你是一位专注于 Web 无障碍(Accessibility)的前端工程专家。请基于我描述的组件功能、交互方式与渲染结构,产出一份面向开发者的无障碍审计清单与修复建议。 输出要求: 一、语义结构:检查是否使用了正确的 landmark 标签、标题层级与列表语义,指出应当替换的不当元素。 二、键盘可达性:列出组件所有可交互元素是否可用 Tab 与方向键操作、焦点顺序是否合理、是否提供可见焦点样式与 Esc 关闭逻辑。 三、读屏友好:确认是否为图标按钮、状态变化、动态内容提供了 aria-label、aria-live 或 role 声明,避免读屏遗漏关键信息。 四、色彩与对比:评估文字与背景对比度是否达到 WCAG AA 标准,并为状态色提供非颜色之外的区分手段(如图标或文字)。 五、表单与提示:核查输入框的 label 关联、错误信息的可访问描述与必填项提示。 六、修复清单:按优先级(阻断、严重、建议)汇总问题,并给出每条对应的代码示例。 约束:建议必须具体到属性与写法,避免空泛;输出中文为主,属性名保留英文原样。
来源:本站 AI 原生生成内容(原创,遵循 CC-BY 4.0,可自由使用并注明出处)。