组件

组件页告诉读者什么时候用这个界面部件、怎样用好它。它的 API 在源码里，所以页面只链接过去，不重抄一遍。

组件页包含什么

部分	写什么
描述	一句话说明它做什么，例如“在当前页面触发一个操作”
何时使用	适合的场景，以及不适合时该用什么。用来跳转页面的是链接，不是按钮
结构	它由哪些具名部分组成，例如按钮的文字、图标和焦点框
变体	开发者选定的配置，例如 size 或 tone
状态	组件所处的情况，例如悬停、聚焦、按下、禁用
组合	哪些变体和状态可以同时出现，哪些不行
无障碍	它的角色、键盘操作，以及它的名称从哪里来。见无障碍
API	链接到源码文件，或者生成的清单，例如 Custom Elements Manifest
示例	可交互的演示，或者指向演示的链接
相关	它用到的组件，以及可以替代它的组件

变体和状态

DSDS 把这两者都叫作特征（trait），并加以区分：变体由使用组件的人选定，状态是使用过程中组件发生的变化。两者都可以是“是/否”开关，也可以是从一组值里选一个。size 是变体，取值有小、中、大；disabled 是一个是/否状态。

把不允许的组合写下来，例如一个按钮不能既禁用又处于按下状态。这样规则只写在一处，而不是留在每个开发者的脑子里。

键盘操作参照 APG

只要 ARIA Authoring Practices Guide 里有对应的模式（对话框、标签页、菜单、组合框等），按键、角色和状态就照那个模式来，不要自己另编一套。原生 HTML 元素优先：<button> 本来就有正确的角色和键盘行为，APG 也提醒，没有 ARIA 好过错误的 ARIA。

来源

DSDS 的组件条目（其中定义了特征、组合、源码文件和规格），以及 ARIA Authoring Practices Guide。