无障碍技术标准

本页面提供了主要的无障碍技术标准和开发指南文档。这些标准是开发人员创建无障碍 Web 应用的重要技术参考，包括 PDF/UA、WAI-ARIA 等。

PDF/UA (ISO 14289)

PDF/UA（全称 PDF/Universal Accessibility，PDF 通用可访问性）是 ISO 32000-1 的无障碍子集标准，由 ISO（国际标准化组织） 于 2012 年发布，正式编号 ISO 14289-1:2014。它定义了PDF 文档必须满足的技术要求，以确保屏幕阅读器、盲文设备、语音合成器等辅助技术（AT）能完全解析和播报内容。

核心定位

PDF/UA 是"让 PDF 能被屏幕阅读器读懂"的国际标准，等同于 PDF 的"无障碍身份证"。

PDF/UA - PDF Universal Accessibility

发布机构： ISO (国际标准化组织)

标准编号： ISO 14289-1:2014

描述： 定义了PDF文档必须满足的技术要求，以确保残障人士可以访问PDF内容。

核心要求： 文档结构标记、替代文本、标签树、阅读顺序等

相关工具： PAC (PDF Accessibility Checker)

了解PDF/UA

基本信息

项目 内容
标准名称 ISO 14289-1:2014 《Document file format for long-term preservation — Use of PDF 1.7 (PDF/UA-1)》
最新版本 PDF/UA-1（2014）
PDF/UA-2（开发中，基于 PDF 2.0，预计 2026 年发布）
发布机构 ISO/TC 171/SC 2（文档影像应用技术委员会）
官方文档 https://www.iso.org/standard/64509.html （付费）
免费摘要：https://pdfa.org/resource/pdfua-1/
中文名称 PDF 通用可访问性
与 PDF 版本关系 基于 PDF 1.7（ISO 32000-1:2008）
法律引用 被 Section 508、EN 301 549、GB/T 37668-2019 强制或推荐要求

核心目标

目标 说明
1. 完全机器可读 所有内容（文本、图像、表格）必须有逻辑结构，不能是扫描图
2. 语义化标签 使用标签树（Tagged PDF） 定义标题、段落、表格、列表等
3. 可预测的阅读顺序 内容按逻辑顺序（而非视觉位置）输出
4. 替代文本 图像、图表必须有 Alt 文本
5. 兼容 AT 支持 NVDA、JAWS、VoiceOver、TalkBack 等

强制要求（7 大核心）

要求 具体标准 示例
1. 必须是 Tagged PDF 文档根节点必须有 <StructTreeRoot> 使用 Adobe Acrobat 导出带标签的 PDF
2. 逻辑阅读顺序 标签树顺序 = 实际阅读顺序 不能"左边文字 → 右边图片 → 再左边"
3. 所有文本必须可提取 不能是图片文字（OCR 后需嵌入） 扫描件需 OCR + 标签
4. 图像必须有 Alt 文本 <Figure> 标签 + Alt 属性 Alt="2024 年销售额增长图"
5. 表格必须结构化 使用 <Table>、<TH>、<TD>，并设置 Scope 不能用空格模拟表格
6. 标题必须分级 使用 <H1> ~ <H6>，不能跳级 <H1>年度报告</H1><H2>第一季度</H2>
7. 语言声明 文档根节点声明 Lang="zh-CN" 支持多语言切换

反例说明

❌ 扫描 PDF、无标签、图片文字、视觉布局混乱 → 不合规

与其他标准的对比

标准 关系 区别
PDF/A 存档标准（ISO 19005） 关注长期保存；不要求可访问性
PDF/UA 无障碍标准 必须 Tagged + 语义结构
WCAG 2.1/2.2 内容标准 PDF/UA 是实现 WCAG 1.3.1、1.3.2、4.1.2 的技术手段
Section 508 美国法律 要求联邦 PDF 符合 PDF/UA 或 WCAG AA
EN 301 549 欧盟标准 Cl.10 要求电子文档符合 PDF/UA
GB/T 37668-2019 中国标准 推荐 PDF 符合 PDF/UA

结论

PDF/UA 是 PDF 文档合规 WCAG 的"技术通行证"。

PDF/UA-2（开发中，2025 最新动态）

项目 内容
基于 PDF 2.0（ISO 32000-2:2020）
新增功能
  • 支持 Rich Media（视频/音频）标签
  • 增强 数学公式（MathML 嵌入）
  • 数字签名 无障碍
  • 3D 模型 可访问描述
预计发布 2026 年
工作组 PDF Association + ISO TC 171

2025 建议

新文档优先按 PDF/UA-1 + WCAG 2.2 设计，为 PDF/UA-2 预留空间。

创建 PDF/UA 合规文档的流程

步骤 工具与方法
1. 源文件准备 Word/PowerPoint/InDesign 使用标题样式、Alt 文本
2. 导出 PDF
  • Word：文件 → 导出 → 创建 PDF → 选项勾选"文档结构标记"
  • InDesign：导出 → Adobe PDF → 勾选"创建标记 PDF"
3. 添加标签 Adobe Acrobat Pro → 工具 → 可访问性 → 添加标签
4. 检查与修复 Acrobat → 可访问性检查 → 修复阅读顺序、Alt 文本
5. 验证合规
  • PAC 2024（免费，PDF Association）
  • CommonLook PDF Validator（付费）

验证工具（2025 推荐）

工具 功能 链接
PAC 2024（免费） 检查 PDF/UA 合规性 https://www.pdfa.org/resource/pdf-ua-checker/
Adobe Acrobat Pro 内置可访问性检查 + 修复 订阅制
CommonLook PDF 企业级验证 + 批量处理 https://commonlook.com
veraPDF 开源 PDF/A + PDF/UA 验证 https://verapdf.org

最佳实践清单（开发者/设计师）

实践 说明
1. 从源头设计 Word 中使用样式（标题 1、正文），插入图片时填 Alt
2. 避免复杂布局 少用多栏、浮动图像
3. 表格简洁 每行有表头，合并单元格加 Scope
4. 超链接有意义 文本"下载报告" > "点击这里"
5. 测试阅读顺序 用 Acrobat "阅读顺序工具" 或 PAC 预览
6. 发布声明 PDF 首页加"本文件符合 PDF/UA 标准"

常见错误与修复

错误 修复方法
扫描 PDF OCR（Abbyy/Adobe）→ 添加标签
无 Alt 文本 Acrobat → 右键图像 → 编辑 Alt 文本
阅读顺序错乱 Acrobat → 标签面板 → 拖动调整顺序
表格无表头 标签树中将第一行标记为 <TH>

开发者必知要点

"源头要用样式，导出要带标签，Acrobat 要修顺序，PAC 要验证合规。"

官方资源汇总

资源 链接
ISO 标准摘要 https://www.iso.org/standard/64509.html
PDF/UA 技术指南 https://pdfa.org/resource/pdfua-1/
PAC 2024 下载 https://www.pdfa.org/resource/pdf-ua-checker/
W3C PDF 与 WCAG https://www.w3.org/WAI/standards-guidelines/pdf/
Adobe 无障碍指南 https://www.adobe.com/accessibility/pdf.html

总结

项目 内容
标准名称 ISO 14289-1:2014（PDF/UA-1）
类型 PDF 无障碍国际标准
核心 Tagged PDF + 逻辑结构 + Alt 文本
与 WCAG 实现 1.3.1、1.3.2、4.1.2
法律要求 Section 508、EN 301 549、GB/T 37668
验证工具 PAC 2024、Acrobat Pro
未来 PDF/UA-2（2026，基于 PDF 2.0）

WAI-ARIA (Web Accessibility Initiative – Accessible Rich Internet Applications)

WAI-ARIA（全称 Web Accessibility Initiative – Accessible Rich Internet Applications，网页可访问性倡议 – 可访问富互联网应用）是 W3C 制定的技术规范，专门用于增强动态网页与富交互应用的屏幕阅读器兼容性。它通过在 HTML 中添加语义角色（roles）、状态（states）、属性（properties），让原本"无语义"的 JavaScript 组件（如下拉菜单、模态框、进度条）也能被辅助技术（AT）正确识别和播报。

核心定位

WAI-ARIA 是"给 JavaScript 组件加说明书"的技术标准，让屏幕阅读器"读懂"动态网页。

基本信息

项目 内容
制定机构 W3C Web Accessibility Initiative (WAI)
最新稳定版本 WAI-ARIA 1.2（2023 年 12 月 6 日成为 W3C 推荐标准）
WAI-ARIA 1.3（开发中，预计 2026 年）
前身 WAI-ARIA 1.0（2014）、1.1（2017）
官方文档 https://www.w3.org/TR/wai-aria-1.2/
中文翻译 https://www.w3.org/Translations/WAI-ARIA12-zh/
性质 技术规范（非法律），实现 WCAG 2.x 的技术手段
适用范围 所有动态网页、Web App、移动混合应用（React/Vue/Angular 等）

三大核心机制

机制 作用 示例
Roles（角色） 定义元素是什么 role="alert"（即时消息）
role="navigation"（导航栏）
States（状态） 描述元素当前状态 aria-expanded="true"（展开）
aria-checked="true"（复选框选中）
Properties（属性） 提供额外信息 aria-label="关闭"（无文本按钮）
aria-describedby="error1"（关联错误提示）

形象比喻

HTML 是"建筑图纸"，ARIA 是"语音导览"，告诉盲人"这是电梯按钮，按下后会说话"。

WAI-ARIA 1.2 新增与重点特性（2023）

类别 新增/强化内容 应用场景
角色增强 role="feed"、article 支持分页 社交媒体动态流（如微博、Twitter）
状态与属性 aria-braillelabel、aria-brailleroledescription 盲文设备支持
交互模式 aria-modal="true" 强制聚焦模态框 登录弹窗
动态内容 aria-live="assertive" 优先播报 错误提示、聊天消息
可访问名称计算 强化 aria-labelledby > aria-label > 文本 提升命名一致性

核心角色分类（常用 20+）

分类 角色 说明 示例
Landmark（地标） banner, navigation, main, contentinfo 页面结构定位 <header role="banner">
Widget（小部件） button, textbox, slider, progressbar 交互组件 <div role="button" tabindex="0">
复合组件 menu, menubar, tablist, tree 复杂交互 <ul role="tablist">
实时区域 alert, log, status, timer 动态更新 <div role="alert">提交成功！</div>
文档结构 article, heading, paragraph, figure 增强语义 <section role="article">

最佳实践提示

优先使用原生 HTML（<button> > role="button"），仅在必要时加 ARIA。

关键属性一览（高频使用）

属性 类型 说明 示例
aria-label 属性 提供可访问名称 <button aria-label="关闭弹窗">×</button>
aria-labelledby 属性 引用其他元素 ID 作为名称 <div aria-labelledby="title1">
aria-describedby 属性 关联描述性内容 <input aria-describedby="help1">
aria-hidden="true" 状态 隐藏于 AT 装饰性图标
aria-live 状态 动态内容播报优先级（polite/assertive） 聊天消息
aria-expanded 状态 展开/收起状态 true/false
aria-controls 属性 控制的目标 ID 手风琴组件
aria-haspopup 属性 是否弹出菜单 true

与其他标准的关系

标准 关系
WCAG 2.1/2.2 实现手段：满足 WCAG 1.3.1（信息与关系）、4.1.2（名称、角色、值）
Section 508 要求使用 ARIA 实现动态内容可访问
EN 301 549 第 9 章网页要求引用 ARIA
GB/T 37668-2019 等同 WCAG 2.1，隐含使用 ARIA
HTML5 互补：原生语义 > ARIA

标准金字塔模型

法律（Section 508 / EN 301 549） → 标准（WCAG 2.2） → 技术（WAI-ARIA + HTML + CSS）

实施最佳实践（2025 开发者指南）

原则 实践
1. 原生优先 用 <button> 而不是 <div role="button">
2. 避免冗余 不要对 <h1> 加 role="heading"
3. 动态管理 JavaScript 控制 aria-expanded、aria-selected
4. 焦点管理 模态框打开时 tabindex="-1" 聚焦容器
5. 实时区域 用 aria-live="polite" 播报非关键更新
6. 测试 用 NVDA、VoiceOver、TalkBack 验证
7. 性能 避免过多 aria-live 导致播报风暴

代码示例对比

❌ 错误示例： <!-- 错误：冗余 + 无语义 -->
<div role="button" onclick="submit()">提交</div>
✅ 正确示例： <!-- 正确：原生 + ARIA 增强 -->
<button type="submit" aria-label="提交表单">提交</button>

测试与工具（2025 推荐）

工具 功能 链接
Axe DevTools 自动检测 ARIA 错误 https://www.deque.com/axe/
WAVE 可视化 ARIA 角色 https://wave.webaim.org/
ARC Toolkit Chrome 插件，检查 aria-live Chrome Web Store
NVDA（免费） Windows 屏幕阅读器 https://www.nvaccess.org/
VoiceOver macOS/iOS 内置 系统设置
ARIA in HTML W3C 合规性检查 https://www.w3.org/TR/html-aria/

常见误区与澄清

误区 正确认知
"加了 ARIA 就无障碍" 错！ARIA 是补救，语义 HTML 是基础
"所有组件都要加 role" 错！原生元素已有隐式角色
"aria-hidden 能隐藏视觉内容" 错！只隐藏于 AT，视觉仍可见
"ARIA 能替代 CSS" 错！ARIA 不控制样式

ARIA Authoring Practices Guide (APG)

ARIA Authoring Practices Guide (APG)

发布机构： W3C WAI

描述： 提供如何使用WAI-ARIA创建可访问Web组件的实践指南和模式。

内容包括： 设计模式、组件实现示例、键盘交互、焦点管理等

查看APG指南

开发者口诀

"先问 HTML 行不行，不行再用 ARIA 补；状态实时管，焦点别乱跳。"

官方资源汇总

资源 链接
WAI-ARIA 1.2 规范 https://www.w3.org/TR/wai-aria-1.2/
ARIA Authoring Practices Guide (APG) https://www.w3.org/WAI/ARIA/apg/ （组件模式大全）
ARIA in HTML https://www.w3.org/TR/html-aria/ （哪些 ARIA 允许用在 HTML 上）
WCAG → ARIA 映射 https://www.w3.org/WAI/WCAG22/Techniques/aria/
中文社区 阿里云无障碍实验室、腾讯 TAPD 无障碍指南

总结

项目 内容
标准名称 WAI-ARIA 1.2
类型 技术规范（非法律）
目标 让动态内容被屏幕阅读器识别
核心 Roles + States + Properties
与 WCAG 实现 WCAG 1.3.1、4.1.2 等
最佳实践 原生 HTML > ARIA，动态管理状态
测试工具 Axe、NVDA、APG 模式
未来 1.3 版将支持更多 XR/语音交互