OpenType 字体和 TrueType 字体。有啥不同？

Posted 2023-03-15

【中文标题】OpenType 字体和 TrueType 字体。有啥不同？

【英文标题】：OpenType Font & TrueType Font. Whats the difference?OpenType 字体和 TrueType 字体。有什么不同？

【发布时间】：2014-12-31 21:13:14

【问题描述】：

最近在学习 CSS 时，我尝试包含外部字体。然后我对.otf 字体和.ttf 字体感到困惑，它们都非常适合我。但从那一刻起，我想了解更多。

哪种字体更适合作为网页内容的外部字体？为什么？

总体区别是什么？

【问题讨论】：

***.com/questions/8602013/true-type-vs-open-type

@isherwood 我真的不明白那个说 TrueType Outlines 和 CFF outlines 的答案......我想知道用简单的英语解释的区别......

当然，但这不是 SO 的用途。 :)

比较一下：“指定颜色，RGB 或 HSV 哪个更好？不要告诉我关于 'hue' 和 'redness' 的问题，请用简单的英语。”它们只是描述轮廓的两种不同方式，仅此而已。

@Jongware 我想要字体大小之类的东西。在网页中加载速度更快。哪个更兼容旧版本，诸如此类...

【参考方案1】：

简短回答：差异与您所询问的上下文无关。使用 WOFF。

略长一点的答案：几乎所有东西都支持这两种格式，而且这两种格式只是不同种类的 OpenType（规范）字体，因此可以打包为 WOFF（或者，这些天，WOFF2），所以你甚至不需要需要知道它是 .otf 还是 .ttf 文件。

完整答案：.otf 几乎普遍是带有 CFF 轮廓的 OpenType 字体，而 .ttf 几乎普遍是带有 TrueType 轮廓的 OpenType 字体。

TrueType 字体更大，因为它们的图形指令不是很丰富（仅支持二次曲线，光栅化指令非常有限，并且不能小于“完整字形”以供重复使用），但真的很容易解析。 CFF 字体更加紧凑，因为它们的图形指令非常丰富（三次曲线、高度可控的光栅化提示、用于重用 any 共享轮廓或轮廓属性的任意字节子例程），但这也意味着它们需要更多时间来解码。

在现实世界中，与下载字体所需的时间相比，这里的时间差异微不足道，因此对于 webfont 而言，唯一考虑的是“哪个更小”，而不是“它有哪个扩展”。为此，您是否拥有“真实”的 .otf 文件（即带有 CFF 轮廓数据的 OpenType）也很重要：设计合理的真实 .otf 文件将比等效的 .ttf 文件小得多，但如果您通过 Font Squirrel 之类的东西获得了 .otf 文件，作为字体格式包的一部分，该文件以 .ttf 开始，但情况并非如此，您不妨改用原始 .ttf。

然后当然就像简短而稍长的答案一样：“但实际上，您只想将最小的一个包装为 WOFF，这样您就不需要多个来源”。自 .ttf 与 .otf 与 .eot 时代以来，浏览器一直在发展，现在一切都支持 WOFF。使用它并且不要将所有其他格式放入您的 @font-face 规则中。它们充其量只是噪音，最坏的情况是浪费带宽/时间/金钱。