Skip to content

无障碍发布标准

YH-UI 的无障碍目标是让核心组件在键盘、屏幕阅读器、高对比度和 SSR 场景下都保持可用。发布前不只检查“能不能看见”,还要检查“能不能被理解和操作”。

发布门禁

bash
pnpm verify:a11y

该命令会打开关键文档页面并检查:

项目标准
页面标题每个页面必须有非空标题
标题层级页面需要一个可见 h1,标题层级不能跳级
图片非装饰图片必须有 alt
交互元素按钮、链接、菜单项、Tab 等必须有可访问名称
表单控件输入框、选择器、文本域必须有标签、aria-labeltitle 或合理的占位提示
DOM 稳定性页面不能出现重复 id

报告会写入 test-results/a11y/a11y-report.json

组件设计要求

  • 所有可点击元素优先使用原生 buttona,需要自定义角色时必须补齐键盘行为。
  • 弹层类组件必须处理焦点进入、关闭后焦点恢复、Esc 关闭和遮罩语义。
  • 表单组件必须支持 disabledreadonly、错误状态、帮助文本和 aria-* 透传。
  • 图标按钮必须提供 aria-label 或可见文本。
  • 动效组件必须尊重用户的减少动态效果偏好。

人工验收

自动检查只能覆盖基础规则。正式稳定版还需要人工验证:

  • 只用键盘完成 Button、Input、Select、Dialog、Drawer、Table、Upload 的主要流程。
  • 使用屏幕阅读器读取表单错误、弹窗标题、菜单项和表格行列。
  • 在深色模式、高对比度、缩放到 200% 时检查文本和控件是否仍可使用。

组件责任

组件实现负责默认语义和键盘体验;业务应用负责提供真实文案、表单标签、图片含义和错误说明。YH-UI 会尽量让正确用法成为默认路径。

Released under the MIT License.