不同浏览器如何使用不同字体引擎呈现 PDF 文本
当您在同一台计算机上的 Google Chrome 和 Mozilla Firefox 中打开同一个 PDF 文件时，两个完全不同的 PDF 渲染引擎会处理该文档。 Chrome 使用 PDFium，这是一个最初由 Foxit 开发的 C++ 库，现在由 Google 作为 Chromium 项目的一部分进行维护。 Firefox 使用 PDF.js，这是 Mozilla 开发的基于 JavaScript 的渲染器，完全在浏览器的 JavaScript 引擎内运行。这两个引擎具有根本不同的字体处理方法，即使在渲染相同的 PDF 源文件时，这些差异也会导致文本清晰度出现明显变化。
PDFium 使用操作系统的本机字体渲染堆栈来渲染文本。在 Windows 上，这意味着它使用 DirectWrite，它应用针对 LCD 显示器优化的子像素抗锯齿功能。在 Mac 上，它使用 Core Text，它应用不同的抗锯齿算法，优先考虑形状保真度而不是像素网格对齐。这些操作系统级别的字体呈现差异意味着，在考虑跨浏览器差异之前，在 Windows 上的 Chrome 和 Mac 上的 Chrome 中打开同一 PDF 中的PDF 字体 时，其外观可能会明显不同。
PDF.js 采用了完全不同的方法。它使用浏览器自己的画布文本渲染 API 将文本渲染到 HTML5 画布元素上。这意味着文本渲染质量取决于浏览器的画布实现（在 Firefox 和 Chrome 之间有所不同）以及浏览器的字体匹配逻辑（决定如何定位和加载 PDF 中引用的字体）。 Chrome 在系统字体目录中找到并使用硬件加速 DirectWrite 渲染的字体可能会被 Firefox 匹配到稍微不同的字体变体，或者通过不同的抗锯齿代码路径渲染。
字体嵌入、替换及其对文本清晰度的影响
完全嵌入所有字体的 PDF 理论上应该在每个查看器中呈现相同的效果，因为显示文本所需的确切字体数据位于文件内部。实际上，即使完全嵌入的字体在不同浏览器中的渲染效果也不同，因为字体光栅化器（将字体轮廓转换为屏幕像素的组件）在每个渲染引擎中都是不同的。 PDFium 使用 FreeType 或操作系统本机光栅化器，具体取决于平台。 PDF.js 依赖于浏览器的画布文本渲染，它通过浏览器的渲染管道间接使用操作系统文本渲染堆栈。
当 PDF 中没有嵌入字体时（这种情况在办公套件和打印到 PDF 驱动程序创建的文档中仍然很常见，这些驱动程序引用系统字体而不是嵌入它们），PDF 查看体验在不同浏览器中的差异甚至更大。 Chrome 和 Firefox 都有自己的字体替换逻辑和自己的一组默认替换字体。引用“Helvetica”但未嵌入的 PDF 可能会在一个浏览器上以 Arial 形式显示，在另一个浏览器上以不同的无衬线替代形式显示，如果没有配置合适的替代形式，则在第三个浏览器上显示为空白矩形。
字体提示是调整字体轮廓以与小尺寸的像素网格对齐以获得更清晰的屏幕显示的过程，是跨浏览器清晰度变化的另一个来源。桌面 PDF 查看器应用嵌入在字体文件中的字体提示指令。通过浏览器画布呈现的 PDF.js 可能会忽略或部分应用提示指令，因为画布 API 不会向应用程序公开字体提示控制。这意味着小文本（通常为 10 点及以下）在基于浏览器的查看器中可能比在同一计算机上的桌面查看器中显得更柔和或更不清晰。
抗锯齿差异及其对感知清晰度的影响
抗锯齿功能通过在文本颜色和背景颜色之间的阴影中对边缘像素进行着色来平滑文本字符的锯齿状边缘。不同的抗锯齿算法会产生不同的锐度主观印象，不同的渲染引擎会做出不同的算法选择。
Windows 上的 DirectWrite 使用的子像素抗锯齿功能利用 LCD 显示器中红色、绿色和蓝色子像素的物理排列，将文本渲染的有效水平分辨率提高了三倍。使用子像素抗锯齿渲染的文本在小尺寸下看起来明显比使用灰度抗锯齿渲染的文本更清晰，灰度抗锯齿将每个像素视为一个统一的单位。 Windows 上的 Chrome 通过 DirectWrite 使用子像素抗锯齿功能。 Windows 上的 Firefox 默认对画布渲染文本（包括 PDF.js 输出）使用灰度抗锯齿。在同一台 Windows 计算机上的 Chrome 和 Firefox 中查看的同一个 PDF 可能在一种浏览器中看起来很清晰，而在另一种浏览器中看起来稍微柔和，这仅仅是因为抗锯齿差异。
在高 DPI 显示器上，抗锯齿差异变得不那么明显，因为更高的像素密度提供了足够的物理分辨率，即使使用更简单的抗锯齿算法也能清晰地渲染文本。操作系统缩放率为 200% 的 4K 显示器每个字符都有足够的像素，因此子像素和灰度抗锯齿之间的差异几乎无法察觉。在 100% 缩放的标准 1080p 显示器上，每个字符都用相对较少的物理像素渲染，抗锯齿选择对感知文本质量的影响要大得多。
确保跨浏览器一致的 PDF 文本呈现的实用步骤
如果主要通过Web 到 PDF基于浏览器的渲染来查看 PDF，则有几种做法可以提高跨浏览器文本的一致性。将所有字体嵌入 PDF 中，而不是依赖系统字体引用。嵌入字体保证每个渲染引擎都可以访问完全相同的字体数据，从而消除字体替换作为渲染差异来源的情况。
使用专为典型文本大小的屏幕渲染而设计的字体。与依赖光栅化器在没有提示的情况下产生良好结果的字体相比，具有良好提示指令的字体在各个渲染引擎中产生更一致的结果。来自 Google Fonts 等服务的 Web 优化字体通常非常适合常见文本尺寸的屏幕显示，并且将它们嵌入到用于浏览器查看的 PDF 中，比使用专为胶印机输出设计的打印优化字体会产生更可预测的跨浏览器结果。
在将 PDF 发布到可通过网络访问的位置之前，请在 Chrome、Firefox 和 Edge 中测试 PDF。在标准分辨率显示屏上以 100% 缩放进行并排比较可以发现文本清晰度差异，这些差异值得在文档到达最终用户之前解决。如果一种浏览器显示的文本比其他浏览器明显柔和，则调整字体嵌入设置或将正文文本大小增加一点通常可以使所有三种浏览器达到可接受的视觉一致性。
WukongPDF 的 PDF 导出选项包括字体嵌入设置，可确保所有字体完全嵌入到输出文件中，从而消除字体替换作为跨浏览器文本呈现差异的根源。
浏览器 PDF 渲染的更广泛趋势是趋同而不是趋异。 Chrome 的 PDFium 和 Firefox 的 PDF.js 都会定期更新，以提高文本渲染质量和一致性。两年前，这些引擎之间的渲染差异比现在大得多。在基于网络的文档查看日益重要的推动下，这两个引擎的持续发展正在逐渐缩小跨浏览器的文本质量差距。对于文档出版商来说，这种趋势意味着当今对跨浏览器渲染测试的投资所产生的文档将随着底层引擎的不断改进而呈现得更加一致。
出于可访问性的目的，浏览器之间的文本呈现差异具有超越美观的次要影响。从浏览器呈现的 PDF 中提取文本的屏幕阅读器取决于浏览器的文本提取准确性，这与浏览器的 PDF 引擎内部如何表示文本直接相关。清晰呈现文本的浏览器通常也会准确地提取文本以供屏幕阅读器使用。使用跨多个浏览器的屏幕阅读器测试 PDF 可访问性，确保文档不仅在视觉上一致，而且无论屏幕阅读器用户喜欢哪种浏览器，都可以通过编程方式进行访问。
这些跨浏览器差异的实际影响在很大程度上取决于文档的受众和分发渠道。用于在收件人首选的桌面应用程序（Acrobat、Preview 或 Foxit）中下载和查看的 PDF 不需要浏览器渲染优化。嵌入网页并由成百上千用户直接在浏览器中查看的 PDF 从本文中描述的测试和优化实践中受益匪浅。将优化工作与主要查看环境相匹配可确保资源用在对用户影响最大的地方。
PDF 嵌入的字体格式的选择也会影响跨浏览器渲染的一致性。具有良好提示指令的 TrueType 字体通常会比 PostScript Type 1 字体在渲染引擎中产生更一致的结果，PostScript Type 1 字体是一种较旧的格式，提示支持不太复杂。在同一文件中同时包含 TrueType 轮廓和 PostScript 轮廓的 OpenType 字体（一种称为 OpenType CFF 的格式）可以根据呈现引擎选择的轮廓格式产生不同的呈现结果。为了获得最大的跨浏览器一致性，请嵌入 TrueType 风格的 OpenType 字体以及针对常见文本大小的屏幕显示而优化的提示指令。
颜色管理与文本渲染以微妙的方式相互作用，影响感知的清晰度。与没有颜色配置文件或具有 CMYK 配置文件的相同 PDF 相比，具有嵌入 RGB 颜色配置文件的 PDF 渲染的文本与背景的对比度可能略有不同。浏览器对 PDF 内容的颜色管理支持有所不同，浏览器的颜色管理、操作系统的显示校准和 PDF 嵌入的颜色配置文件之间的交互可能会影响黑色文本显示为纯黑色还是稍浅的深灰色，即使文本渲染分辨率相同，这也会在感知上影响清晰度。