typography-audit

排版审查

面向网页排版的 10 个类别共 78 条规则。每条发现都会注明文件、规则和修复方法。

• **属于：**仅限排版：字体加载、字号、标点、间距、层级、文本布局、OpenType 特性、字体搭配、品牌字体、展示字体。
• **不属于：**广泛的 UI 审查（无障碍、表单、导航：使用 ui-design Audit 模式），或重新设计（新增字体、比例：使用 ui-design Direction 模式）。

审查工作流

按此清单进行：

Audit progress:
- [ ] Step 1: Scope. List changed files (or full sweep), map signals to categories
- [ ] Step 2: Run CRITICAL rules in scope (font-, size-, punct-)
- [ ] Step 3: Run HIGH rules in scope (spacing-)
- [ ] Step 4: Run remaining in-scope categories by descending priority
- [ ] Step 5: Report per the contract; every finding has file:line, rule ID, fix

1. 除非要求全面检查，否则仅审查有变更的文件。对于 PR，使用与实际基准合并点的差异，包括已提交的变更，并筛选 .css、.scss、.html、.tsx/.jsx 和模板文件。
2. 根据关联信号表将代码映射到类别；没有关联信号的类别跳过。
3. 按前缀加载规则文件（如 rules/font-*.md），仅加载信号选中的类别。
4. 按优先级顺序审查各类别，确保即使审查提前中止，也能发现 CRITICAL 问题。
5. 修复后，仅重新运行产生过问题的规则，然后完成报告。

范围信号 → 类别

代码中的信号	要加载的类别
@font-face、font-family、字体文件、可变字体、font-stretch、文本上的 transform: scaleX	font-
font-size、clamp()、媒体查询中的字号变更、文本上的 max-width、<em>/<strong>、text-decoration	size-
HTML/JSX 中的文案（标题、段落、标签）	punct-
line-height、letter-spacing、word-spacing、文本上的 margin、text-transform: uppercase	spacing-
标题元素、字号比例标记、--text-* 属性	hierarchy-
text-align、列表、引用块、多栏文本	layout-
font-feature-settings、font-variant-*、文案中的数字和分数	opentype-
Logo/字标样式、品牌标记、文本颜色标记、许可证注释	brand-
两个或更多不同的 font-family 值	pairing-
Hero/展示字号、首字下沉、initial-letter	display-

按优先级排列的规则类别

优先级	类别	影响	前缀	规则数
1	字体选择与字重	CRITICAL	font-	11
2	尺寸与行宽	CRITICAL	size-	6
3	标点与特殊字符	CRITICAL	punct-	12
4	间距与节奏	HIGH	spacing-	8
5	层级与比例	MEDIUM-HIGH	hierarchy-	8
6	对齐与布局	MEDIUM	layout-	6
7	OpenType 特性	MEDIUM	opentype-	7
8	品牌与标识	MEDIUM	brand-	8
9	字体搭配	MEDIUM	pairing-	5
10	展示字体与标题	LOW-MEDIUM	display-	7

类别映射和影响说明：rules/_sections.md。每个规则文件都会说明规则的重要性，并提供错误和正确示例。类别影响反映该类别中最严重规则的影响；报告问题时，请使用规则自身 frontmatter 中的 impact，它经常与类别影响不同（例如，brand-color 在影响为 MEDIUM 的 brand- 类别中属于 HIGH，因为它规定了 WCAG 对比度的最低标准）。

审查输出约定

按以下格式报告问题：

## Typography Audit Findings

### path/to/file.css
- [CRITICAL] `punct-smart-quotes` (file.css:42): Straight quotes in heading copy.
  - Fix: Replace `"` with `“`/`”` (or UTF-8 curly quotes).
- [CRITICAL] `size-line-height` (file.css:18): `line-height: 20px`, a fixed value the 48px `h1` inherits, so its lines overlap.
  - Fix: Use unitless `line-height: 1.5`.

### path/to/clean-file.css
- ✓ pass

• 按文件分组；在每个文件内按影响程度排序。
• 每条问题都必须包含：影响标签、规则 ID、file:line、一行问题描述和修复方法。
• 将无问题的文件标记为 ✓ pass，以体现覆盖范围。
• 最后总结各影响级别的问题数量。

注意事项

• 不要预加载所有规则文件。只加载信号表选出的前缀；完整加载会把预算浪费在当前范围内没有信号的类别上。
• 报告规则 frontmatter 中的 impact，不要报告类别的影响级别。最常被误报的两条规则是：brand-color 为 HIGH（这是无障碍底线，不是品牌上的小讲究），而 punct-daggers 为 LOW-MEDIUM（属于装饰性问题，尽管它归在 CRITICAL 类别下）。
• 标点规则仅适用于渲染后的文案。将 <code>、<pre> 或 JS/TS 字符串字面量中的直引号或 -- 标记为问题属于误报；“修复”它们会破坏代码。
• 如果问题取决于字体或计算样式，请通过 ui-verification 确认渲染后的字体和计算样式。仅凭 CSS 声明无法证明实际加载了哪种字体。
• 未确认已加载字体支持某项 OpenType 特性前，不要报告该特性缺失。浏览器会静默忽略不受支持的 font-feature-settings 标签，因此修复不会生效。
• 每条发现都必须包含 file:line 和具体修复方案；无法采取行动的发现会导致返工。
• 审计不是重新设计。提出新的字体搭配或比例会让 10 分钟的审查变成设计项目；应标出问题，并将重新设计需求转交给 ui-design。
• 不要把优先级一概拉平。把 LOW-MEDIUM 级别的 display- 小问题排在 CRITICAL 级别的假粗体问题之上，会掩盖真正明显的缺陷。

相关技能

• ui-design 的 Audit 模式：全面检查前端质量（无障碍、表单、导航、动效）；其字体排版检查覆盖范围较浅。
• ui-design 的 Direction 模式：从头选择字体、比例和视觉方向；当某项发现演变为重新设计需求时运行。
• ghostwriter：标题和标签的措辞。本技能仅规定这些文案的大小写方式（punct-case-rules）。

仅用于维护：evals/evals.json 包含针对本技能变更的回归场景；它不会在用户任务期间加载。