嵌入式PDF在网页中很常见，多用于展示文档、报告等内容，但很多网站进行无障碍扫描时，会发现嵌入的PDF导致整体评分不达标，无法符合WCAG等无障碍标准。这类问题会影响视障用户通过读屏软件获取PDF内容，需要针对性调整优化。
常见的失败原因
无障碍扫描失败通常不是单一因素导致的，主要有以下几类常见原因：
- 使用<iframe>嵌入PDF时，没有给<iframe>添加title属性，读屏软件无法识别嵌入内容的用途
- PDF文件本身没有添加无障碍标签，比如没有设置文档标题、没有给图片添加alt文本、没有正确的阅读顺序
- 部分浏览器对PDF的无障碍支持存在差异，比如旧版Chrome对嵌入PDF的ARIA属性识别不完善
- 使用第三方PDF查看器插件时，插件本身缺少无障碍支持，导致扫描工具无法识别内容结构
具体的解决方法
规范PDF嵌入方式
优先使用标准的<iframe>或<object>标签嵌入PDF，避免用自定义JS渲染的方式，后者更容易出现无障碍兼容问题。给嵌入标签添加必要的属性：
<!-- 使用iframe嵌入PDF的正确示例 -->
<iframe
src="https://ipipp.com/docs/sample.pdf"
title="2024年产品服务说明文档PDF"
width="100%"
height="800px"
aria-label="嵌入的产品服务说明PDF文件，可通过读屏软件获取内容"
></iframe>
<!-- 使用object嵌入的示例 -->
<object
data="https://ipipp.com/docs/sample.pdf"
type="application/pdf"
width="100%"
height="800px"
aria-label="嵌入的产品服务说明PDF文件"
>
<p>您的浏览器不支持PDF预览，可<a href="https://ipipp.com/docs/sample.pdf">点击此处下载PDF文件</a>查看</p>
</object>
优化PDF文件本身的无障碍属性
PDF文件本身的无障碍设置是基础，需要保证PDF符合PDF/UA标准：
- 用Adobe Acrobat等工具打开PDF，在文档属性中设置明确的标题，不要使用默认的“文档1”这类名称
- 检查PDF中的图片，给所有非装饰性图片添加alt文本，装饰性图片标记为装饰元素
- 调整内容的阅读顺序，保证读屏软件读取的顺序和视觉顺序一致，避免出现跳读、乱序的问题
- 给PDF中的表格添加表头标记，列表设置正确的列表结构，不要只用空格模拟列表样式
补充ARIA属性增强兼容性
如果嵌入的PDF在某些扫描工具中仍然识别异常，可以添加额外的ARIA属性辅助识别：
<div role="document" aria-label="PDF内容区域">
<iframe
src="https://ipipp.com/docs/sample.pdf"
title="产品服务说明PDF"
width="100%"
height="800px"
aria-describedby="pdf-desc"
></iframe>
<p id="pdf-desc" class="sr-only">该区域为嵌入的PDF文件，内容为2024年产品服务详细说明，包含服务范围、收费标准、售后保障三部分</p>
</div>
其中sr-only是视觉隐藏但读屏软件可读取的样式，对应的CSS如下：
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
提供替代访问方案
对于无障碍支持较差的浏览器或扫描工具，可以提供PDF的替代访问方式，比如在PDF嵌入区域下方添加纯文本的文档摘要，或者提供HTML版本的文档内容，同时保留PDF下载链接，满足不同用户的需求。
验证优化效果
完成调整后，可以使用axe、Lighthouse等无障碍扫描工具重新检测网页，重点查看PDF嵌入区域的相关报错是否消失。也可以实际用读屏软件测试，确认能够正常读取PDF的标题、内容结构，验证优化是否生效。