Framer中的字体如何优化
Framer 中的所有网站都使用网络字体或自定义字体，这些字体必须在渲染前加载到浏览器中。为了加快文本渲染速度，Framer 应用了多种优化措施。
最佳实践
使用字重从细体（300）到粗体（700）的网络字体。由于应用了
font-display: swap规则，这些字重的文本在加载期间不会被隐藏。尽可能选择 Google 字体。由于自动子集化，Google 字体加载更快。请从“Web”选项卡中选择，而非手动上传。
字体类型
Framer 支持四种字体类型：
Google 字体：在“Web”选项卡的“字体”下提供，来源为 fonts.google.com。
Fontshare 字体：在“Web”选项卡的“字体”下提供，来源为 www.fontshare.com。
自定义字体：您上传到 Framer 的字体，可在“自定义”选项卡的“字体”下访问。
标准 Inter 字体：新文本块的默认字体。此版本的 Inter 支持斜体，而 Google 字体版本则不支持。
每种字体类型会根据其来源和用途进行不同的优化。
font-display: swap
该 CSS 规则指示浏览器在网页字体加载期间显示系统字体，从而减少感知加载时间。
适用于：
Google 字体和 Fontshare 字体（仅限衬线体和无衬线体类别，且字重为细体、常规、中等、半粗体和粗体）。
自定义字体（所有字重和样式）。
标准 Inter 字体（字重为细体、常规、中等、半粗体和粗体）。
注意事项：
稀有字重如极细体（100）不使用
font-display: swap，因为系统字体与网络字体之间的差异会过于明显。非无衬线类别的字体（例如装饰性字体）也不使用
font-display: swap，以避免与 Arial 等备用系统字体产生不匹配。
布局偏移优化：
对于使用 font-display: swap 的字体，Framer 会计算并应用诸如 size-adjust 的 CSS 规则，确保系统字体尽可能接近网络字体，从而在网页字体加载时减少或消除布局偏移。
字体子集化
许多字体包含对多种字母表的支持（例如拉丁文、西里尔文、希腊文）。如果您的网站仅使用一种语言，则无需下载未使用的字符集。
适用于：
Google 字体。
标准 Inter 字体。
优化方式：
字体被划分为子集（例如拉丁文、西里尔文、希腊文）。Google 字体自动处理子集化，而 Framer 会对标准 Inter 进行子集化，以匹配 Google 字体的子集划分。
浏览器会根据页面上使用的字符决定加载哪些子集，从而减小字体文件大小。
WOFF2 字体压缩
WOFF2 是最现代且高效的字体压缩格式，比 TTF 或 OTF 显著更小。
适用于：
Google 字体。
Fontshare 字体。
2023 年 11 月后上传的自定义字体。
标准 Inter 字体。
详情：
2023 年 11 月前上传的自定义字体仍保留原始格式。要升级，请上传一个与现有字体同名的
.woff2文件。编辑页面时，Framer 将自动使用 WOFF2 版本。为了避免可能破坏网站设计的问题，Framer 未对现有自定义字体进行自动转换。
这些优化措施确保了所有 Framer 网站的字体加载更快，性能更佳。