1. 基本信息
| 项目 | 内容 | 数据来源 |
|---|---|---|
| 正式名称 | better-accessibility-jakubkrehel-skills | GitHub 合集仓库子目录(jakubkrehel/skills 仓库内 skills/better-accessibility) |
| 作者/维护者 | Jakub Krehel(个人开发者,interfaces.dev 站点作者,Founding Design Engineer) | GitHub API / LinkedIn |
| 来源链接 | https://github.com/jakubkrehel/skills/tree/main/skills/better-accessibility | — |
| 许可证 | MIT | GitHub API |
| GitHub Stars / Forks | 合集仓库整体 2,414 / 73(该数字属整个 skills 合集,不代表本子技能自身热度) | GitHub API(认证取数) |
| 最新版本 | 无正式 Release/Tag,滚动更新于 main 分支,本子技能最近一次提交 2026-07-24 | GitHub API |
| 安装方式 | npx skills add jakubkrehel/skills --skill better-accessibility,或 Claude Code 插件市场整包安装 |
官方 README |
2. 功能介绍与亮点
better-accessibility 是 jakubkrehel/skills(一套围绕“打造优秀界面”的技能合集)中专注无障碍工程的子技能,覆盖焦点态、键盘支持、ARIA、表单、屏幕阅读器、触控目标与动效七大主题,正文之外附 6 份细分参考文档(focus-and-keyboard.md、semantics-and-aria.md、forms.md、screen-readers.md、hit-areas.md、motion-and-zoom.md)。
主要亮点:
- 建审查工作流而非罗列规则:明确要求先以“纯键盘用户”身份走查一遍交互流程,再以“屏幕阅读器用户”身份复核每个控件是否播报名称、角色与状态,遇到不确定情况优先用原生元素而非自定义方案。
- 规则可直接落地:如触控目标 WCAG 2.5.8 的 24×24px AA 底线(触屏建议 44×44px)、
:focus-visible而非裸:focus、复合控件用 roving tabindex 等,均给出具体数值与反例对照表。 - 输出格式标准化:独立审查时按 HIGH/MEDIUM/LOW 严重度分级,附代码位置、改前改后与判定依据;被同合集的
better-interface统筹审查时可让位给其汇总格式,避免多技能各自输出冲突。 - 职责边界清晰:颜色对比度检测转交
better-colors,文字缩放与 iOS 输入放大转交better-typography,RTL 布局转交better-layout,避免合集内多个技能重复劳动。 - 纯 Markdown 指导内容,不含任何可执行脚本。
3. 适用场景
所属分类:前端与设计
适合在编写或评审 UI 组件、弹窗、菜单、表单等自定义控件时,希望把无障碍工程作为编码习惯而非事后补救的前端开发者与小团队;也适合在收到“键盘无法操作”“屏幕阅读器读不出内容”等具体反馈后定位修复方案的场景。
4. 跨 Agent 兼容性
| Agent | 结论 | 依据 |
|---|---|---|
| Claude Code | ✅ 原生支持 | README 提供插件市场安装(/plugin marketplace add + /plugin install)与 npx skills add 两种安装路径,并给出 /better-interface 等触发命令 |
| Codex | ✅ 支持 | README 明确给出 Codex 下 $better-interface 的触发方式,技能目录内含 agents/openai.yaml 元数据文件 |
| OpenClaw | ❓ 未验证 | 现有材料仅笼统提及“其他 agent”,未点名 |
| Hermes Agent | ❓ 未验证 | 现有材料未提及 |
5. 推荐理由
把无障碍工程内化为编码与代码评审的默认动作,覆盖键盘、ARIA、表单、屏幕阅读器等七大主题并给出可直接套用的判定规则与反例对照,而不是事后补一份合规检查单。
6. 评分
| 维度 | 分数 | 说明 |
|---|---|---|
| 受欢迎程度 | 5 | 所属合集仓库整体 2,414 星、创建仅 3 周增长明显,但该增长数字属整个合集不可归于本子技能;本子技能自身尚无独立第三方报道或讨论,作者为可查证的真实从业者(interfaces.dev 站点、LinkedIn 公开身份) |
| 可用性 | 9 | 一条命令安装(支持单独选装本子技能);SKILL.md + 6 份分主题参考文档结构清晰;最近一次提交在 10 天以内;无付费依赖 |
| 安全性 | 9 | 见下方检查清单 |
安全检查清单:①无可执行脚本,纯 Markdown 指导内容 ②不含运行时联网请求逻辑 ③不要求 API key 或凭据 ④通读全文未见可疑指令或隐藏外发,内容全部为标准 WCAG/ARIA APG 工程规范 ⑤作者身份可查证、持续活跃维护同名产品站点,无刷星迹象 ⑥License 为标准 MIT ⑦最近一次提交在 10 天以内
7. 跟同类 Skills 相比的优势
| 竞品 | 定位 | 与 better-accessibility 的差异 |
|---|---|---|
| accessibility(Addy Osmani,web-quality-skills 合集) | 对照 WCAG 2.2 逐条给出 HTML/ARIA/CSS 修复代码模式,附独立速查文档 | 更偏“事后审计对照表”风格;本技能更强调开发中的走查工作流(先键盘、后屏幕阅读器),并与同合集其余六个“better-*“技能共享职责边界,可组合成整体界面审查 |
| Webflow Accessibility Audit(webflow-skills 官方插件) | 连接 Webflow MCP 服务器对指定页面做 0–100 分自动化评分与批准式修复 | 绑定 Webflow 平台与 MCP 服务,需先部署对应环境;本技能框架无关,适用于任意 Web 技术栈的源码级审查,无需额外服务依赖 |
| accessibility-skills(mgifford) | 镜像作者个人维护的 ACCESSIBILITY.md 无障碍清单 | 仓库规模较小(36 星),内容以清单条目为主;本技能按七大主题拆分参考文档并给出结构化审查输出格式,工程可执行性更强 |
8. 用户评价
该技能目前在第三方平台尚无具名用户评价。
9. 其他补充
该技能是作者在独立仓库 make-interfaces-feel-better 基础上扩展出的技能合集的一部分,合集内另有 better-typography、better-colors、better-layout、better-writing 等姊妹技能,可通过 better-interface 统一编排做整体界面审查。
10. 安装使用方式
- 推荐方式:
npx skills add jakubkrehel/skills --skill better-accessibility,适用于 Claude Code、Codex 等支持 skills CLI 的 agent。 - 整包安装:Claude Code 中执行
/plugin marketplace add jakubkrehel/skills后/plugin install interfaces@interfaces,一次装入全部 7 个技能(技能名带interfaces:前缀)。 - 手动安装:克隆仓库后复制
skills/better-accessibility/整个目录(含 6 份参考文档)进 agent 技能目录,仅复制 SKILL.md 会丢失细节规则。 - 安装后无需重启;触发词包括 accessibility、a11y、WCAG、ARIA、focus ring、keyboard navigation、screen reader 等,或直接说“让这个界面更易访问”。
11. 注意事项
- 无正式版本号/Release,滚动更新于 main 分支,使用前建议核对最近提交日期。
- OpenClaw 与 Hermes Agent 上的兼容性尚未有官方材料证实,使用前建议先行验证。
- 内容聚焦 Web/DOM 无障碍,不覆盖原生移动端(iOS/Android)无障碍工程。
- 审查质量依赖 agent 是否真正执行“键盘走查+屏幕阅读器复核”两步验证,而非仅凭代码静态扫描给结论。