a11y-web

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

RGAA 4.1.2 Accessibility Auditor — Framework Agnostic

RGAA 4.1.2 可访问性审计工具 — 框架无关

Audit and fix accessibility issues in any web framework that renders HTML, following RGAA 4.1.2 (aligned with WCAG 2.1 AA). Static analysis only — no runtime behavior.
遵循RGAA 4.1.2(与WCAG 2.1 AA对齐),针对所有渲染HTML的Web框架审计并修复可访问性问题。仅支持静态分析,不涉及运行时行为。

When to Use This Skill

何时使用该工具

Activate whenever:
  • A developer writes or modifies a component or template (even without mentioning a11y)
  • A developer asks to "review", "audit", or "check" a component
  • A developer generates new component code from scratch
  • Any
    .jsx
    ,
    .tsx
    ,
    .vue
    ,
    .svelte
    ,
    .astro
    ,
    .html
    ,
    .htm
    ,
    .erb
    ,
    .njk
    ,
    .hbs
    file is in scope
The goal is accessibility by default, not as an afterthought.

在以下场景中激活:
  • 开发者编写或修改组件或模板(即使未提及a11y)
  • 开发者要求“审查”、“审计”或“检查”某个组件
  • 开发者从头生成新的组件代码
  • 涉及任何
    .jsx
    ,
    .tsx
    ,
    .vue
    ,
    .svelte
    ,
    .astro
    ,
    .html
    ,
    .htm
    ,
    .erb
    ,
    .njk
    ,
    .hbs
    文件
目标是默认实现可访问性,而非事后补救。

Framework Syntax Differences

框架语法差异

RGAA criteria are about the HTML output, not the framework syntax. Keep these differences in mind when writing fixes:
ConceptReact/JSXVue / Svelte / Astro / HTML
Label association
htmlFor="id"
for="id"
CSS class
className="..."
class="..."
Autocomplete
autoComplete="..."
autocomplete="..."
ARIA attributes
aria-label
,
aria-hidden
same in all frameworks
Event handlersirrelevant (static only)irrelevant (static only)
When reporting a fix, always use the syntax of the framework being audited.

RGAA标准关注的是HTML输出,而非框架语法。编写修复方案时需注意以下差异:
概念React/JSXVue / Svelte / Astro / HTML
标签关联
htmlFor="id"
for="id"
CSS类
className="..."
class="..."
自动补全
autoComplete="..."
autocomplete="..."
ARIA属性
aria-label
,
aria-hidden
所有框架语法一致
事件处理器无关(仅静态分析)无关(仅静态分析)
报告修复方案时,请始终使用被审计框架的语法。

Modes

模式

Audit Mode (default for review/check requests)

审计模式(审查/检查请求默认模式)

Scan files, report violations grouped by RGAA topic with severity, suggest fixes — do not apply them.
扫描文件,按RGAA主题分组报告违规情况及严重程度,提出修复建议,但不直接应用。

Fix Mode (for generate/write/create requests)

修复模式(生成/编写/创建请求使用)

Build accessible code from the start, or apply fixes directly to existing files using Edit.
How to determine mode:
  • "review", "check", "audit", "report" → Audit Mode
  • "fix", "make accessible", "apply", "generate", "create", "write" → Fix Mode
  • Writing new code from scratch → Fix Mode (build correctly from the start)

从一开始就构建可访问的代码,或使用编辑功能直接对现有文件应用修复。
模式判断规则:
  • 包含“review”、“check”、“audit”、“report” → 审计模式
  • 包含“fix”、“make accessible”、“apply”、“generate”、“create”、“write” → 修复模式
  • 从头编写新代码 → 修复模式(从一开始就正确构建)

Workflow

工作流程

Step 1 — Identify Scope and Detect Framework

步骤1 — 确定范围并检测框架

undefined
undefined

Discover component/template files

发现组件/模板文件

Glob: src//*.{jsx,tsx} # React Glob: src//.vue # Vue Glob: src/**/.svelte # Svelte Glob: src/**/.astro # Astro Glob: **/.{html,htm} # Plain HTML / Angular templates Glob: **/*.{erb,njk,hbs} # Server-side templates
Glob: src//*.{jsx,tsx} # React Glob: src//.vue # Vue Glob: src/**/.svelte # Svelte Glob: src/**/.astro # Astro Glob: **/.{html,htm} # 纯HTML / Angular模板 Glob: **/*.{erb,njk,hbs} # 服务端模板

Root layout / app shell — check for Topic 8 and landmarks

根布局/应用壳 — 检查主题8和地标

Glob: src/App.{jsx,tsx,vue,svelte} Glob: src/app/layout.{jsx,tsx} # Next.js App Router Glob: src/routes/+layout.svelte # SvelteKit Glob: src/layouts/*.{astro,html,vue}

**Detect framework** by file extension and package.json presence:
- `.jsx`/`.tsx` → React / Next.js / Remix
- `.vue` → Vue / Nuxt
- `.svelte` → Svelte / SvelteKit
- `.astro` → Astro
- `.html` + Angular signals → Angular

Use the detected framework to format all fix suggestions with correct syntax.
Glob: src/App.{jsx,tsx,vue,svelte} Glob: src/app/layout.{jsx,tsx} # Next.js App Router Glob: src/routes/+layout.svelte # SvelteKit Glob: src/layouts/*.{astro,html,vue}

**通过文件扩展名和package.json检测框架:**
- `.jsx`/`.tsx` → React / Next.js / Remix
- `.vue` → Vue / Nuxt
- `.svelte` → Svelte / SvelteKit
- `.astro` → Astro
- `.html` + Angular特征 → Angular

使用检测到的框架格式化所有修复建议,确保语法正确。

Step 2 — Per-Topic Scan

步骤2 — 按主题扫描

Run checks in order. Collect all violations before reporting. For full criterion text and examples per framework, read
references/rgaa-static-criteria.md
.
按顺序执行检查。收集所有违规情况后再报告。如需每个框架的完整标准文本和示例,请阅读
references/rgaa-static-criteria.md

Topic 1 — Images

主题1 — 图片

undefined
undefined

1.1 img without alt attribute

1.1 无alt属性的img

Pattern: <img(?![^>]*\balt=) Files: *.{jsx,tsx,vue,svelte,astro,html,htm,erb,njk,hbs}
Pattern: <img(?![^>]*\balt=) Files: *.{jsx,tsx,vue,svelte,astro,html,htm,erb,njk,hbs}

1.2 Decorative img: alt="" but missing aria-hidden="true" or role="presentation"

1.2 装饰性img:alt=""但缺少aria-hidden="true"或role="presentation"

Pattern: alt="" → On same element, verify aria-hidden="true" OR role="presentation" is present
Pattern: alt="" → 在同一元素上,验证是否存在aria-hidden="true"或role="presentation"

1.1 SVG without accessible name

1.1 无可访问名称的SVG

Pattern: <svg(?![^>]*aria-label)(?![^>]*aria-labelledby) → Check if a <title> child exists inside the SVG block
Pattern: <svg(?![^>]*aria-label)(?![^>]*aria-labelledby) → 检查SVG块内是否存在<title>子元素

1.6/1.7 Complex images (charts, infographics)

1.6/1.7 复杂图片(图表、信息图)

Pattern: <img → Flag imgs appearing to be charts/diagrams without aria-describedby or figcaption
undefined
Pattern: <img → 标记看似图表/示意图但无aria-describedby或figcaption的img
undefined

Topic 3 — Colors

主题3 — 颜色

undefined
undefined

3.1 Color-only information

3.1 仅通过颜色传递信息

Pattern: style=.*color → Flag for manual review: verify information is not conveyed by color alone

Always add a `[MANUAL]` note for RGAA 3.2 (contrast ratios — requires rendered output).
Pattern: style=.*color → 标记需人工审查:验证信息是否仅通过颜色传递

对于RGAA 3.2(对比度——需要渲染输出),始终添加`[MANUAL]`备注。

Topic 5 — Tables

主题5 — 表格

undefined
undefined

5.3 Layout table without role="presentation"

5.3 无role="presentation"的布局表格

Pattern: <table(?![^>]*role=)
Pattern: <table(?![^>]*role=)

5.4 Table without <caption>

5.4 无<caption>的表格

Pattern: <table → Check for <caption> as first child
Pattern: <table → 检查是否将<caption>作为第一个子元素

5.6/5.7 th without scope

5.6/5.7 无scope的th

Pattern: <th(?![^>]*\bscope=)
undefined
Pattern: <th(?![^>]*\bscope=)
undefined

Topic 6 — Links

主题6 — 链接

undefined
undefined

6.1 Empty link text

6.1 空链接文本

Pattern: <a\b[^>]>\s</a>
Pattern: <a\b[^>]>\s</a>

6.1 Ambiguous link text (case-insensitive)

6.1 模糊链接文本(不区分大小写)

Pattern: >click here<|>read more<|>learn more<|>here<
Pattern: >click here<|>read more<|>learn more<|>here<

6.2 Image link: verify img has non-empty alt

6.2 图片链接:验证img是否有非空alt

Pattern: <a\b[^>]*><img → Verify the img has a non-empty alt describing the destination
undefined
Pattern: <a\b[^>]*><img → 验证img是否有描述目标地址的非空alt
undefined

Topic 8 — Mandatory Elements

主题8 — 必填元素

undefined
undefined

8.3/8.4 html element without lang

8.3/8.4 无lang属性的html元素

Pattern: <html(?![^>]\blang=) Files: **/.{html,htm,jsx,tsx,vue,svelte,astro}
Pattern: <html(?![^>]\blang=) Files: **/.{html,htm,jsx,tsx,vue,svelte,astro}

8.5/8.6 Page title

8.5/8.6 页面标题

Pattern: <title → in HTML files, verify non-empty Pattern: <Helmet|<Head → React / Next.js Pattern: <svelte:head → SvelteKit Pattern: <head> → Astro/Vue layouts → Check for <title> inside
Pattern: <title → 在HTML文件中,验证是否非空 Pattern: <Helmet|<Head → React / Next.js Pattern: <svelte:head → SvelteKit Pattern: <head> → Astro/Vue布局 → 检查内部是否存在<title>

8.1 Charset

8.1 字符集

Pattern: <meta\s+charset Files: **/*.{html,htm}
undefined
Pattern: <meta\s+charset Files: **/*.{html,htm}
undefined

Topic 9 — Information Structure

主题9 — 信息结构

undefined
undefined

9.1 Heading inventory

9.1 标题清单

Pattern: <h[1-6] → Count h1 occurrences (flag if 0 or >1 in main layout) → List all levels found; flag skipped levels
Pattern: <h[1-6] → 统计h1出现次数(主布局中0次或多于1次则标记) → 列出所有层级;标记跳过的层级

9.3 Presentational elements

9.3 表现型元素

Pattern: <b>|<i> → Suggest <strong>/<em> if semantic meaning is intended
undefined
Pattern: <b>|<i> → 如果有语义含义,建议替换为<strong>/<em>
undefined

Topic 10 — Information Presentation

主题10 — 信息呈现

Cannot verify statically. Always add:
  • [MANUAL]
    for RGAA 10.1 (shape/size/position-only information)
  • [MANUAL]
    for RGAA 10.4 (text resize to 200%)
无法静态验证。始终添加:
  • [MANUAL]
    针对RGAA 10.1(仅通过形状/大小/位置传递信息)
  • [MANUAL]
    针对RGAA 10.4(文本放大至200%)

Topic 11 — Forms

主题11 — 表单

undefined
undefined

11.1 Input/select/textarea without label

11.1 无标签的Input/select/textarea

Pattern: <input(?![^>]*type="hidden")(?![^>]*aria-label)(?![^>]*aria-labelledby) Pattern: <select(?![^>]*aria-label)(?![^>]*aria-labelledby) Pattern: <textarea(?![^>]*aria-label)(?![^>]*aria-labelledby) → Cross-check: does a <label for/htmlFor="id"> exist with matching id?
Pattern: <input(?![^>]*type="hidden")(?![^>]*aria-label)(?![^>]*aria-labelledby) Pattern: <select(?![^>]*aria-label)(?![^>]*aria-labelledby) Pattern: <textarea(?![^>]*aria-label)(?![^>]*aria-labelledby) → 交叉检查:是否存在与id匹配的<label for/htmlFor="id">?

11.2 Placeholder without label

11.2 仅占位符无标签

Pattern: placeholder= → Verify a <label> also exists for the same field
Pattern: placeholder= → 验证同一字段是否存在<label>

11.5/11.6 Radio/checkbox without fieldset+legend

11.5/11.6 无fieldset+legend的单选框/复选框

Pattern: type="radio"|type="checkbox" → Check for wrapping <fieldset> with <legend>
Pattern: type="radio"|type="checkbox" → 检查是否有包裹的<fieldset><legend>

11.10 Required field not indicated

11.10 必填字段未标识

Pattern: required → Verify visible text/symbol AND aria-required="true"
Pattern: required → 验证是否有可见文本/符号及aria-required="true"

11.13 Personal data fields without autocomplete

11.13 无自动补全的个人数据字段

Pattern: type="email"|type="tel"|name="email"|name="phone"|name="firstname"|name="lastname" → Verify autocomplete / autoComplete attribute present
undefined
Pattern: type="email"|type="tel"|name="email"|name="phone"|name="firstname"|name="lastname" → 验证是否存在autocomplete / autoComplete属性
undefined

Topic 12 — Navigation

主题12 — 导航

undefined
undefined

12.6 Landmark presence

12.6 地标存在性

Pattern: <main Pattern: <nav Pattern: <header Pattern: <footer → Flag if absent from app/layout component
Pattern: <main Pattern: <nav Pattern: <header Pattern: <footer → 如果应用/布局组件中缺失则标记

12.6 Multiple nav without accessible name

12.6 多个无名称的nav

Pattern: <nav(?![^>]*aria-label)(?![^>]*aria-labelledby) → Flag if more than one <nav> found without labels
Pattern: <nav(?![^>]*aria-label)(?![^>]*aria-labelledby) → 如果发现多个无标签的<nav>则标记

12.7/12.8 Skip link

12.7/12.8 跳转链接

Pattern: skip|eviter|aller.au.contenu (case-insensitive) → Flag if absent, pointing to #main-content
undefined
Pattern: skip|eviter|aller.au.contenu (不区分大小写) → 如果缺失指向#main-content的跳转链接则标记
undefined

Step 3 — Report (Audit Mode)

步骤3 — 报告(审计模式)

undefined
undefined

RGAA Accessibility Audit — [filename or "Project"]

RGAA可访问性审计 — [文件名或“项目”]

Framework: [React | Vue | Svelte | Astro | HTML | ...] Date: YYYY-MM-DD
框架:[React | Vue | Svelte | Astro | HTML | ...] 日期:YYYY-MM-DD

Topic 1 — Images

主题1 — 图片

[FAIL] RGAA 1.1 — src/components/Hero.tsx:14 <img src="..." /> is missing an alt attribute. Fix: alt="Descriptive text" (informative) or alt="" aria-hidden="true" (decorative)
[FAIL] RGAA 1.1 — src/components/Hero.tsx:14 <img src="..." /> 缺少alt属性。 修复方案:alt="描述性文本"(信息性图片)或alt="" aria-hidden="true"(装饰性图片)

Topic 3 — Colors

主题3 — 颜色

[MANUAL] RGAA 3.2 — Contrast ratios cannot be verified statically. Action: Run axe-core, Lighthouse, or check via DevTools > Accessibility.

Summary: X violations (Y FAIL, Z WARN, W MANUAL) Reference: https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/

Severity:
- `[FAIL]` — Definite violation detectable in static code
- `[WARN]` — Likely violation; context verification needed
- `[MANUAL]` — Requires runtime or visual verification
[MANUAL] RGAA 3.2 — 对比度无法通过静态代码验证。 操作:运行axe-core、Lighthouse,或通过DevTools > 可访问性面板检查。

总结:X项违规(Y项FAIL,Z项WARN,W项MANUAL) 参考:https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/

严重程度:
- `[FAIL]` — 静态代码中可明确检测到的违规
- `[WARN]` — 可能违规;需上下文验证
- `[MANUAL]` — 需要运行时或视觉验证

Step 4 — Apply Fixes (Fix Mode)

步骤4 — 应用修复(修复模式)

For each
[FAIL]
and
[WARN]
, apply the fix with Edit using the correct syntax for the detected framework. After editing, re-run the relevant Grep check to confirm.

针对每个
[FAIL]
[WARN]
,使用编辑功能应用修复,并确保符合检测到的框架的正确语法。编辑后,重新运行相关Grep检查以确认修复完成。

Quick-Reference Fix Patterns

快速参考修复模式

Syntax shown as:
HTML / Vue / Svelte / Astro
first, then
React (JSX)
variant if different.
语法展示顺序:先
HTML / Vue / Svelte / Astro
,再展示不同的
React (JSX)
变体。

Images

图片

html
<!-- Informative image — all frameworks -->
<img src="chart.png" alt="Bar chart: revenue grew 12% in Q3" />

<!-- Decorative image — all frameworks -->
<img src="divider.svg" alt="" aria-hidden="true" />

<!-- Informative SVG — all frameworks -->
<svg aria-label="Bar chart: revenue grew 12%" role="img" viewBox="0 0 100 100">
  <title>Bar chart: revenue grew 12%</title>
</svg>

<!-- Decorative SVG — all frameworks -->
<svg aria-hidden="true" focusable="false" viewBox="0 0 24 24">...</svg>
html
<!-- 信息性图片 — 所有框架 -->
<img src="chart.png" alt="柱状图:第三季度收入增长12%" />

<!-- 装饰性图片 — 所有框架 -->
<img src="divider.svg" alt="" aria-hidden="true" />

<!-- 信息性SVG — 所有框架 -->
<svg aria-label="柱状图:第三季度收入增长12%" role="img" viewBox="0 0 100 100">
  <title>柱状图:第三季度收入增长12%</title>
</svg>

<!-- 装饰性SVG — 所有框架 -->
<svg aria-hidden="true" focusable="false" viewBox="0 0 24 24">...</svg>

Links

链接

html
<!-- Ambiguous text — HTML/Vue/Svelte/Astro -->
<a href="/article/123" aria-label="Read full article: Paris Resort Review">Read more</a>

<!-- Image link — all frameworks -->
<a href="/home"><img src="logo.png" alt="Club Med — Home" /></a>
html
<!-- 模糊文本 — HTML/Vue/Svelte/Astro -->
<a href="/article/123" aria-label="阅读全文:巴黎度假村评测">Read more</a>

<!-- 图片链接 — 所有框架 -->
<a href="/home"><img src="logo.png" alt="Club Med — 首页" /></a>

Forms — HTML / Vue / Svelte / Astro

表单 — HTML / Vue / Svelte / Astro

html
<label for="email">Email address</label>
<input id="email" type="email" name="email" autocomplete="email" />

<!-- Required field -->
<label for="name">Full name <span aria-hidden="true">*</span></label>
<input id="name" type="text" required aria-required="true" />

<!-- Radio group -->
<fieldset>
  <legend>Preferred contact method</legend>
  <label><input type="radio" name="contact" value="email" /> Email</label>
  <label><input type="radio" name="contact" value="phone" /> Phone</label>
</fieldset>
html
<label for="email">电子邮箱</label>
<input id="email" type="email" name="email" autocomplete="email" />

<!-- 必填字段 -->
<label for="name">全名 <span aria-hidden="true">*</span></label>
<input id="name" type="text" required aria-required="true" />

<!-- 单选组 -->
<fieldset>
  <legend>首选联系方式</legend>
  <label><input type="radio" name="contact" value="email" /> 邮箱</label>
  <label><input type="radio" name="contact" value="phone" /> 电话</label>
</fieldset>

Forms — React (JSX differences)

表单 — React(JSX差异)

jsx
// React uses htmlFor and autoComplete (camelCase)
<label htmlFor="email">Email address</label>
<input id="email" type="email" name="email" autoComplete="email" />

<label htmlFor="name">Full name <span aria-hidden="true">*</span></label>
<input id="name" type="text" required aria-required="true" />
jsx
// React使用htmlFor和autoComplete(驼峰式)
<label htmlFor="email">电子邮箱</label>
<input id="email" type="email" name="email" autoComplete="email" />

<label htmlFor="name">全名 <span aria-hidden="true">*</span></label>
<input id="name" type="text" required aria-required="true" />

Navigation landmarks — all frameworks

导航地标 — 所有框架

html
<!-- First element in DOM -->
<a href="#main-content" class="skip-link">Skip to main content</a>

<header>
  <nav aria-label="Main navigation">...</nav>
</header>
<main id="main-content">
  <h1>Page title</h1>
</main>
<aside aria-label="Related resources">...</aside>
<footer>...</footer>

<!-- Multiple navs — each needs a unique aria-label -->
<nav aria-label="Main navigation">...</nav>
<nav aria-label="Footer links">...</nav>
html
<!-- DOM中的第一个元素 -->
<a href="#main-content" class="skip-link">跳转到主内容</a>

<header>
  <nav aria-label="主导航">...</nav>
</header>
<main id="main-content">
  <h1>页面标题</h1>
</main>
<aside aria-label="相关资源">...</aside>
<footer>...</footer>

<!-- 多个nav — 每个都需要唯一的aria-label -->
<nav aria-label="主导航">...</nav>
<nav aria-label="页脚链接">...</nav>

Tables — all frameworks

表格 — 所有框架

html
<table>
  <caption>Hotel rates by season — 2025</caption>
  <thead>
    <tr>
      <th scope="col">Hotel</th>
      <th scope="col">Low season</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">Punta Cana</th>
      <td>1 200€</td>
    </tr>
  </tbody>
</table>
html
<table>
  <caption>2025年酒店季节性价格</caption>
  <thead>
    <tr>
      <th scope="col">酒店</th>
      <th scope="col">淡季</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">蓬塔卡纳</th>
      <td>1200€</td>
    </tr>
  </tbody>
</table>

Mandatory elements — title management per framework

必填元素 — 各框架标题管理

html
<!-- Plain HTML -->
<html lang="fr">
  <head>
    <meta charset="UTF-8" />
    <title>Page Title — Site Name</title>
  </head>
jsx
// React — Next.js App Router
export const metadata = { title: 'Page Title — Site Name' };

// React — Next.js Pages Router / react-helmet
<Head><title>Page Title — Site Name</title></Head>
html
<!-- Vue / Nuxt -->
<Head><Title>Page Title — Site Name</Title></Head>
svelte
<!-- SvelteKit -->
<svelte:head><title>Page Title — Site Name</title></svelte:head>
astro
<!-- Astro -->
<html lang="fr">
  <head>
    <meta charset="UTF-8" />
    <title>Page Title — Site Name</title>
  </head>

html
<!-- 纯HTML -->
<html lang="fr">
  <head>
    <meta charset="UTF-8" />
    <title>页面标题 — 站点名称</title>
  </head>
jsx
// React — Next.js App Router
export const metadata = { title: '页面标题 — 站点名称' };

// React — Next.js Pages Router / react-helmet
<Head><title>页面标题 — 站点名称</title></Head>
html
<!-- Vue / Nuxt -->
<Head><Title>页面标题 — 站点名称</Title></Head>
svelte
<!-- SvelteKit -->
<svelte:head><title>页面标题 — 站点名称</title></svelte:head>
astro
<!-- Astro -->
<html lang="fr">
  <head>
    <meta charset="UTF-8" />
    <title>页面标题 — 站点名称</title>
  </head>

Limitations (Static Analysis)

局限性(静态分析)

CriterionWhy it needs manual review
RGAA 3.1Color-only info requires visual inspection
RGAA 3.2Contrast ratios require rendered colors
RGAA 10.1Shape/position-only info requires visual review
RGAA 10.4Text resize to 200% requires browser interaction
RGAA 12.4Breadcrumb presence requires site-level context
For runtime analysis, recommend:
axe-core
, Lighthouse, browser DevTools Accessibility panel, or Storybook a11y addon.

标准需要人工审查的原因
RGAA 3.1仅通过颜色传递信息需要视觉检查
RGAA 3.2对比度需要渲染后的颜色数据
RGAA 10.1仅通过形状/位置传递信息需要视觉审查
RGAA 10.4文本放大至200%需要浏览器交互
RGAA 12.4面包屑存在性需要站点级上下文
如需运行时分析,推荐使用:
axe-core
、Lighthouse、浏览器DevTools可访问性面板,或Storybook a11y插件。

Reference

参考

Full criterion details, examples per framework, and fix patterns: →
references/rgaa-static-criteria.md
完整标准细节、各框架示例及修复模式: →
references/rgaa-static-criteria.md