figma-audit-accessibility

figma-audit-accessibility — 单个组件的无障碍评分卡

对单个组件或组件集进行深入的无障碍审计，并获取加权 0–100 评分卡及按优先级排列的修复建议。figma-lint-design 会扫描整棵树以检查多项规则违规，而此技能则深入检查单个组件：它会识别变体轴，将组件分类为交互式或展示型，并据此为各项无障碍维度评分。

所有操作都通过 use_figma 完成，适用于任何套餐——它会检查真实的变体树、填充、描边、效果和组件描述。

技能边界

• use_figma 规则——先加载官方 figma-use 技能；它是完整的 Figma Plugin API 参考。这些脚本依赖的要点：使用顶层 await + return 的纯 JS（不要使用 IIFE 或 figma.closePlugin()；console.log 不会作为返回值），在每个脚本顶部以内联 const 的方式提供输入，颜色值范围为 0–1，在执行任何文本操作前加载字体，使用 await figma.getNodeByIdAsync(...)，以及遵循原子错误原则（脚本失败时不会应用任何更改——读取错误、修正后重试）。
• 全树 WCAG + 设计系统检查 → 使用 figma-lint-design。
• 代码侧无障碍检查（对 HTML 运行 axe-core）→ 使用 figma-scan-code-accessibility。
• 设计与代码的偏差 → 使用 figma-check-design-parity。

工作流

1. 指定组件。 将 NODE_ID 设置为 COMPONENT_SET、COMPONENT 或 INSTANCE 的 ID（脚本会自动沿 INSTANCE → 主组件 → 父级组件集进行遍历）。设为 null 可审计当前的单个选区。
2. 设置点击目标最小尺寸。 TARGET_SIZE 默认为 24（WCAG 2.5.8 的最小值）；若要采用更严格的移动端目标尺寸，请传入 44 或 48。
3. 运行 scripts/audit-accessibility.js，通过 use_figma 执行（skillNames: "figma-audit-accessibility"）。
4. 查看评分卡。 overallScore 是六项类别评分按分类加权后的综合分数。各类别、对应权重及提升分数的方法，请参阅 references/audit-categories.md。
5. 按建议处理。 recommendations[] 已按 priority（high/medium/low）排序，并注明对应的 WCAG 成功标准（SC）。完成修复后重新运行，以确认分数是否提升。

关键规则

• 交互式与展示型由系统根据组件名称和变体轴自动检测。这会改变参与评分的类别及其权重——徽章不会因缺少焦点状态而被扣分，但按钮会。
• 颜色使用 0–1 的浮点数。 对比度使用 sRGB 亮度计算；色盲模拟使用 Brettel/Viénot 二色视者矩阵。
• 覆盖率：对于交互式组件，指交互状态的覆盖情况；对于展示型组件，指变体轴的完整度（实际变体数量 ÷ 预期组合数）。
• 此审计为只读操作——使用 figma-manage-variables / figma-use 应用修复，然后重新审计。