直接答案:25 个首页中,16 个在前 3 个 CSS 里声明了 @font-face,合计 227 个 face;这些站点共引用 63 个唯一字体 URL,51 个可取,声明字节合计 145,002,817 B(约 145 MB),最大单文件 16.4 MB,5 个站点超过 10 MB。0 站为全部 face 设置 font-display,仅 3 站部分 face 用 swap,0 站 preload 字体。

本文解析首页前 3 个样式表中的 @font-face 声明,并对字体 URL 只读响应头读取字节;不保存字体正文,也不测真实渲染、FOIT 或 CLS。

25
首页
16
有 @font-face
63
字体 URL
51
URL 可取
145 MB
声明字节
16.4 MB
最大单文件

方法:抓首页与前三个样式表

2026-11-08 10:40–10:42,对第 4 期 25 个首页各发一次 GET(超时 15 秒),提取 rel="stylesheet" 链接,按出现顺序最多抓 3 个 CSS(超时 12 秒),解析 @font-face 的 font-family、font-display、src URL 主机与文件格式。不请求字体文件,不判断字体是否真正用于首屏。

项判定边界
@font-face前 3 个 CSS 中的声明第 4 个及之后的 CSS 未检查
swap至少一个 face 的 font-display 为 swap不代表全部 face 都设置
第三方主机src 主机与首页主机不同不判断是否使用私有 CDN
woff2任一 src 以 .woff2 结尾不测实际传输体积

结果:16/25 有 @font-face,face 数高度集中

指标站点数 / 数值说明
有 @font-face169 站没有,其中 3 站没有外链 CSS
face 总数22716 站合计
每站 face 中位数4E17 为 164,明显拉高总数
family 中位数3.5E17 有 153 个 family

E17 的 164 个 face 与 153 个 family 更像图标/字形库,而不是正文字体;这类资源对首屏价值有限,却会增加 CSS 体积与字体请求。其余站点多在 1–14 个 face 之间。

字体文件:63 个 URL,合计 145 MB

从 15 个站点的前 3 个 CSS 中提取 63 个唯一字体 URL(每站最多 8 个),带首页 Referer 请求:51 个 200、10 个 404、2 个 502;13 个站点能读到 Content-Length。声明文件字节合计 145,002,817 B,最大单文件 16,353,128 B(E14);5 个站点超过 10 MB(E09、E14、E19、E22、E23),其中 E22 约 63 MB。

项数值说明
唯一字体 URL6315 个站点,每站最多 8 个
HTTP 200 / 404 / 50251 / 10 / 2带首页 Referer 请求
可读到字节的站点13Content-Length 存在
声明字节合计145,002,817 B约 145 MB,不含未声明的字体
最大单文件16,353,128 BE14,约 16.4 MB
超 10 MB 的站点5E09、E14、E19、E22、E23

声明字节不等于首屏流量:浏览器按 unicode-range 与实际用字只取需要的文件,未使用的 face 不会请求。但 10 MB+ 的单文件仍说明字体没有做子集化或按字符集拆分,首次命中时需要完整取回;对移动网络与首屏时间都是风险。

font-display:没有站点全量设置,只有 3 站部分 swap

font-display站点数说明
全部 face 都设置0—
至少一个 face 为 swap3E17、E22、E23
至少一个 face 缺失16所有有 @font-face 的站点

没有 font-display 时,浏览器可能先隐藏文字直到字体加载完成(FOIT);swap 会先用回退字体显示。3 个站点只给部分 face 设了 swap,其余 face 仍走默认行为,说明字体策略没有统一到样式表层面。

第三方、格式与 preload:7 站第三方,5 站 woff2,0 站 preload

项站点数说明
第三方字体主机7字体域名与首页不同
woff25其余站点未见 woff2
preload 字体0HTML 中没有 as="font" 的 preload

第三方字体主机意味着额外的 DNS/TLS 与连接成本;woff2 只有 5 站,可能是大量使用系统字体或图标字体。preload 为 0 并不必然错误:如果字体不阻塞首屏,preload 反而会抢带宽;但首屏关键字体可以单独评估。

对验收的启示

  1. 为每个 @font-face 写 font-display。 16 个有字体的站点没有一个全量设置;统一写 swap 或 optional 能减少 FOIT。
  2. 优先 woff2。 只有 5 站出现 woff2;新配置应同时提供 woff2 与回退格式。
  3. 控制 face 数量。 E17 的 164 个 face 需要审查:图标字体能否改成 SVG,字重能否收敛。
  4. 第三方字体要单独计时。 7 站引用外部字体主机,DNS/TLS 与可用性都增加一个依赖。
  5. preload 按首屏评估。 0 站使用;若字体阻塞首屏,可对 1 个关键字体加 preload,并配合 crossorigin。企业官网验收可参考网站建设服务。
  6. 先看字节再看 face 数。 E14 单文件 16.4 MB、5 站合计超 10 MB;CJK 字体应做子集化或按 unicode-range 拆分。

局限

  • 只看前 3 个 CSS:后续样式表可能还有 @font-face;本文不判断是否遗漏。
  • 不下载字体正文:字节来自 Content-Length;不测实际加载、FOIT/CLS 或浏览器最终使用的字体。
  • 3 站无外链 CSS:E18、E20、E25 没有可解析的样式表,字体情况未知。
  • 单次快照:2026-11-08 10:40–10:42;CDN 与页面改版可能改变结果。
  • 25 站 pilot:不外推行业。
  • 字节口径有限:只取前 3 个 CSS、每站最多 8 个字体 URL;声明字节不等于实际下载;10 个 404 与 2 个 502 未逐个归因。

数据与复算

匿名数据:equipment-homepage-font-delivery-2026.csv(25 行 × 12 列:样式表、face/family 数、swap、第三方主机、woff2、preload)。字体字节:equipment-homepage-font-bytes-2026.csv(25 行 × 10 列:字体 URL 数、200/非 200、可读字节站点、合计字节、最大单文件、第三方)。仓库内为 docs/research/2026-11-homepage-font-delivery.csv 与 2026-11-homepage-font-bytes.csv。

解析:scripts/font_delivery_probe.py;单元测试 scripts/test_content_font_delivery.py(9 项,无网络)。运行:

python -m unittest scripts.test_content_font_delivery

配套:首页静态资源清单 pilot、首页性能代理 pilot、首页缓存、压缩与重访 pilot、首页阻塞资源 pilot。

数据来源与口径

  1. 样本:第 4 期 25 个首页(同一批 sample_id)。
  2. 抓取:2026-11-08 10:40–10:42 Asia/Shanghai,串行,站间 0.5 秒,超时 15/12 秒。
  3. CSS:按 HTML 中出现顺序取前 3 个 rel="stylesheet" 链接。
  4. 指标:@font-face 的 family/display/src 主机/格式;不请求字体文件。
  5. 字体字节:2026-11-08 11:44–11:46;从前 3 个 CSS 取字体 URL(每站最多 8 个),带首页 Referer 请求,只读响应头与 Content-Length。

常见问题

font-display 缺失会怎样?

浏览器可能先隐藏文字直到字体加载完成(FOIT);swap 会先用回退字体显示,再替换成自定义字体。

为什么 E17 有 164 个 @font-face?

主要是图标字体与多字重/多字形集合;图标类字体通常可以用 SVG 或内联图标替代,减少请求与体积。

只有 5 站用 woff2 说明什么?

其余站点可能用系统字体、图标字体或旧格式;woff2 压缩率更高,新配置应优先使用。

preload 字体有必要吗?

首屏关键字体可以 preload 以减少延迟;是否必要取决于字体是否阻塞首屏。本次 0 站使用。

25 个站点能代表行业吗?

不能。这是第 4 期同一批装备企业官网的 pilot,只描述这 25 个首页。

数据能复核吗?

可以。样式表口径 25 行 × 12 列、字节口径 25 行 × 10 列;font_delivery_probe.py 有 13 项离线单测。

145 MB 会全部下载吗?

不会。浏览器按 unicode-range 与实际用字只请求需要的字体文件;但 10 MB+ 的单文件仍说明没有做子集化或拆分,首次命中时要完整取回。

关于作者

凌壹信息Official(交付团队),负责企业网站、品牌与智能制造项目的需求梳理、方案与验收协作。本文解析前 3 个样式表中的 @font-face 声明,并对字体 URL 只读响应头读取字节;不保存字体正文、不判断真实渲染或性能,也不构成对任何站点的最终结论;25 站 pilot,不外推行业。

canonical 缺失是首页的常见缺口

25 站:9 个 canonical、16 个缺失;8 个 og:url。

预约内容验收方案