[{"data":1,"prerenderedAt":312},["ShallowReactive",2],{"blog-self-host-fonts-china":3,"blog-prev-self-host-fonts-china":116,"blog-next-self-host-fonts-china":205},{"id":4,"title":5,"author":6,"body":7,"canonical":100,"category":101,"cover":100,"date":102,"description":103,"draft":104,"extension":105,"keywords":100,"meta":106,"navigation":107,"noindex":104,"ogImage":100,"path":108,"seo":109,"seoDescription":100,"seoTitle":100,"stem":110,"tags":111,"updated":100,"__hash__":115},"blog\u002Fblog\u002Fself-host-fonts-china.md","字体放 Google Fonts 还是自托管，国内首屏差了一秒多","元析智能",{"type":8,"value":9,"toc":90},"minimark",[10,14,17,21,24,27,30,33,45,48,51,62,65,68,71,74,77,80,83],[11,12,13],"p",{},"去年 11 月我们做过一次对比：同一个页面，字体分别放 Google Fonts 和放国内 CDN 自托管，从北京、上海、广州三地各测 50 次。Google Fonts 的字体请求 P75 是 1.2 秒，有 6 次超时超过 3 秒；自托管的 P75 是 180 毫秒，没有超时。",[11,15,16],{},"这个差距比图片优化大得多。字体是阻塞渲染的资源，它慢一秒，首屏就晚一秒。",[18,19,20],"h2",{"id":20},"为什么会差这么多",[11,22,23],{},"两个原因。一是 Google Fonts 的域名和节点在境外，国内访问要过国际出口，高峰期不稳定。二是它的 CSS 和字体文件来自不同域名，多两次 DNS 和 TLS。",[11,25,26],{},"自托管把字体和页面放在同一个域名或者同一个 CDN，省掉域名解析和连接建立，路径短，稳定性也好。",[18,28,29],{"id":29},"我的建议很直接",[11,31,32],{},"面向国内用户的软件站，字体必须自托管，没有例外。做跨境的站，英文站可以用 Google Fonts，但如果国内访问占比超过两成，也建议自托管，用同一份文件走全球 CDN。",[11,34,35,36,40,41,44],{},"自托管要做三件事：字体子集化、",[37,38,39],"code",{},"font-display"," 设置、正确的 CORS 头。第三点常被忽略，字体文件跨域加载需要 ",[37,42,43],{},"Access-Control-Allow-Origin","，配错了浏览器直接拒绝使用，控制台一堆 CORS 报错。",[18,46,47],{"id":47},"一个踩过的坑",[11,49,50],{},"有个客户把字体放在自己的静态资源域名上，那个域名没接 CDN，走的是源站单线机房。字体文件 300KB，南方用户下载要 2 秒。挪到主站 CDN 之后降到 200 毫秒。",[11,52,53,54,57,58,61],{},"这说明自托管不等于快，得确认字体文件走的是 CDN 而不是源站。查法很简单：网络面板里看字体请求的响应头有没有 CDN 标识，或者直接看 ",[37,55,56],{},"age"," 和 ",[37,59,60],{},"server"," 字段。",[18,63,64],{"id":64},"第三方字体服务值不值",[11,66,67],{},"国内有几家做网页字体分片的服务，用它们的 CDN，按流量计费。适合不想自己管子集的团队，代价是每年几千到几万的费用，以及多一个依赖。",[11,69,70],{},"我们的判断：日访问量十万以下，自托管更划算；超过这个量级，第三方服务的分片和缓存策略往往比自建做得好。",[18,72,73],{"id":73},"一条底线",[11,75,76],{},"不管选哪种，字体文件不要超过 300KB，首屏只加载真正用到的那个。这两条做不到，换什么方案都救不了首屏。",[18,78,79],{"id":79},"一个简单的验收方法",[11,81,82],{},"改完之后，让北京、上海、广州各一个真实用户打开页面，看网络面板里字体请求的耗时和状态码。三个地方都稳定在 300 毫秒以内算过关。",[11,84,85,86,89],{},"再检查一遍缓存头：字体文件名带 hash、缓存一年、不要设 ",[37,87,88],{},"Vary: User-Agent","。有些 CDN 默认带这个头，会把缓存命中率打下来，字体每次都回源，等于没自托管。",{"title":91,"searchDepth":92,"depth":92,"links":93},"",2,[94,95,96,97,98,99],{"id":20,"depth":92,"text":20},{"id":29,"depth":92,"text":29},{"id":47,"depth":92,"text":47},{"id":64,"depth":92,"text":64},{"id":73,"depth":92,"text":73},{"id":79,"depth":92,"text":79},null,"技术SEO","2026-03-13","同一页面在北京上海广州各测 50 次：Google Fonts 字体请求 P75 1.2 秒、6 次超时 3 秒，自托管 P75 180 毫秒。自托管要做的三件事，以及一个把字体放在源站的坑。",false,"md",{},true,"\u002Fblog\u002Fself-host-fonts-china",{"title":5,"description":103},"blog\u002Fself-host-fonts-china",[112,113,114],"自托管字体","国内访问","字体加载","A_nndNXPfQghyuu2sfhIahevd1Uwq3JxZM1_R0UtuUI",{"id":117,"title":118,"author":6,"body":119,"canonical":100,"category":101,"cover":100,"date":194,"description":195,"draft":104,"extension":105,"keywords":100,"meta":196,"navigation":107,"noindex":104,"ogImage":100,"path":197,"seo":198,"seoDescription":100,"seoTitle":100,"stem":199,"tags":200,"updated":100,"__hash__":204},"blog\u002Fblog\u002Fhreflang-canonical-conflict.md","hreflang 和 canonical 打架，多语言站最常见的错",{"type":8,"value":120,"toc":186},[121,124,127,134,140,146,150,153,156,159,162,165,168,171,174,177,180,183],[11,122,123],{},"canonical 管的是\"哪个地址是主版本\"，hreflang 管的是\"这组页面是同一内容的不同语言版本\"。两件事分工明确，但配在一起时特别容易互相拆台。最常见的错是跨语言 canonical：中文页指向英文页，理由是\"英文站是主站\"。这一指，中文页就永远不单独排名了。",[18,125,126],{"id":126},"三种冲突形态",[11,128,129,133],{},[130,131,132],"strong",{},"跨语言 canonical","：中文页 canonical 到英文对应页。看起来是\"集中权重\"，实际是告诉搜索引擎\"中文页不用单独存在\"。",[11,135,136,139],{},[130,137,138],{},"语言组里的地址不是主版本","：hreflang 指向的 URL 自己又被 canonical 到别处，整组关系混乱。",[11,141,142,145],{},[130,143,144],{},"x-default 指向一个被 canonical 掉的页面","：兜底版本不存在，等于没兜底。",[18,147,149],{"id":148},"_2026-年-1-月那个出海-saas","2026 年 1 月那个出海 SaaS",[11,151,152],{},"英文站是主域，中文站是子域。技术团队按\"主站优先\"的思路，把中文页 canonical 到英文对应页，同时两边又互相写了 hreflang。结果中文关键词的搜索结果全部展示英文页，中文站的自然点击只有英文站的 4%，客服天天收到\"你们官网为什么是英文\"的反馈。",[11,154,155],{},"改成同语言自指 canonical、完整 hreflang 组（含自引用和 x-default）之后，第 7 周中文站的自然点击涨了 5.6 倍。改动本身只有一行模板，前后差了一个季度。",[18,157,158],{"id":158},"验证方法",[11,160,161],{},"Screaming Frog 跑全站，导出 canonical 和 hreflang 两列交叉比对：canonical 指向的域名是否和本页语言一致、hreflang 组里的每个地址是否都 200 且 canonical 自指。抽 10 个页面手工看源码确认，工具报告偶尔会因为 JS 渲染漏读。",[11,163,164],{},"GSC 的\"网页\"报告可以按目录看展示份额，哪个语言版本的展示量明显低于它的页面占比，就去查那一组的配置。",[18,166,167],{"id":167},"我们的检查清单",[11,169,170],{},"每次接多语言站，我们照这四条过一遍：每个页面的 canonical 是否指向同语言自己；hreflang 组是否包含自引用；x-default 是否指向一个可访问的主版本；组里每个 URL 是否都返回 200 且没被 robots 屏蔽。四条全过，配置层面就算干净了。",[11,172,173],{},"再用 GSC 的展示数据交叉验证：中文目录的页面数占全站 40%，展示量却只有 5%，那这个语言版本的配置大概率有问题。数据永远比源码先说话。",[18,175,176],{"id":176},"正确的配置长什么样",[11,178,179],{},"中文页：canonical 指向自己，hreflang 列出自己、英文页、其他语言页，x-default 指向英文版。英文页同理。没有哪个语言版本\"更主\"。",[18,181,182],{"id":182},"立场",[11,184,185],{},"多语言站先立一个前提：每个语言版本都是独立站点，服务不同的用户群。语言之间不是主从关系。想清楚这一点，canonical 就不会乱指了。",{"title":91,"searchDepth":92,"depth":92,"links":187},[188,189,190,191,192,193],{"id":126,"depth":92,"text":126},{"id":148,"depth":92,"text":149},{"id":158,"depth":92,"text":158},{"id":167,"depth":92,"text":167},{"id":176,"depth":92,"text":176},{"id":182,"depth":92,"text":182},"2026-03-12","英文页 canonical 指向中文页、中文页 hreflang 指向英文页，这种配置会让两个版本互相抵消。我们用一个 2026 年 1 月的客户站讲清正确关系、三种冲突形态和验证方法。",{},"\u002Fblog\u002Fhreflang-canonical-conflict",{"title":118,"description":195},"blog\u002Fhreflang-canonical-conflict",[201,202,203],"hreflang","canonical","多语言","DZzGyUZlJ7S65t1gwaJvbdythbuAcUY6tKBGfOpnPQo",{"id":206,"title":207,"author":6,"body":208,"canonical":100,"category":300,"cover":100,"date":301,"description":302,"draft":104,"extension":105,"keywords":100,"meta":303,"navigation":107,"noindex":104,"ogImage":100,"path":304,"seo":305,"seoDescription":100,"seoTitle":100,"stem":306,"tags":307,"updated":100,"__hash__":311},"blog\u002Fblog\u002Fcomparison-page-tone.md","对比页怎么写才不像拉踩：先给结论，再写边界",{"type":8,"value":209,"toc":290},[210,213,217,220,223,227,230,233,236,239,242,245,248,251,254,257,260,263,266,269,272,275,278,281,284,287],[11,211,212],{},"对比页写得像拉踩，转化一定差。2025 年 12 月我们改过一个客户的对比页，标题没动，只把结构从“我们更强”换成“谁适合谁”，试用率从 1.1% 到 2.6%。内容一样长，信息密度完全不同。",[18,214,216],{"id":215},"第一条底线不编竞品的缺点","第一条底线：不编竞品的缺点",[11,218,219],{},"写你没验证过的东西，用户一查就发现不对，信任直接归零。竞品的缺点只写公开可查的：定价、功能清单、文档里写的限制。",[11,221,222],{},"我们见过的反面例子：把竞品说成“不支持 API”，实际上人家支持，只是文档藏得深。",[18,224,226],{"id":225},"第二条底线写清适用场景","第二条底线：写清适用场景",[11,228,229],{},"谁适合我们，谁适合对手，哪个规模、哪个行业、哪个技术栈。写得越具体，读者越信。",[11,231,232],{},"模糊的写法是“我们适合各种规模的企业”。这句话等于没说。",[18,234,235],{"id":235},"结构就五段",[11,237,238],{},"先给结论，一段话说清什么情况选谁。然后是参数对比表，同口径。接着是场景对比，三到五个具体场景。再是迁移成本，最后是 FAQ。",[11,240,241],{},"结论放最前面。用户没耐心看你铺垫三千字再给答案。",[18,243,244],{"id":244},"表格要同口径",[11,246,247],{},"功能有、功能无、部分支持，三档就够。别用“更强”“较弱”这种词，那是评价，不是事实。",[11,249,250],{},"价格列要写清计费单位，按坐席还是按调用量。口径不同就分两行列，别硬凑一张表。",[18,252,253],{"id":253},"敢写别选我们的情况",[11,255,256],{},"这一条最反直觉，也最有用。写清“如果你们只有 3 个人，别买我们的企业版”，剩下的读者会更信你。",[11,258,259],{},"我们给客户加这一段的页面，跳出率平均降了 8 个百分点。",[18,261,262],{"id":262},"别碰的三件事",[11,264,265],{},"别用未公开的竞品内部信息。别写竞品客户的负面评价。别在对比页堆品牌宣传语。",[18,267,268],{"id":268},"表格里的顺序也有讲究",[11,270,271],{},"把对比维度按用户关心的顺序排，不是按你们功能强的顺序排。用户先看价格和部署方式，再看高级功能。",[11,273,274],{},"2026 年 1 月我们把一个对比页的表格重排，把价格和迁移成本提到最前面，页面停留时间从 1 分 40 秒到 2 分 50 秒。",[18,276,277],{"id":277},"谁来写这一页",[11,279,280],{},"最好让做过售前的人写，或者至少让售前过一遍。客户在选型时问的问题，和写手在网上查到的问题是两套清单。",[11,282,283],{},"我们现在的流程是：售前给 10 个客户最常问的对比问题，写手按这些问题搭结构。",[11,285,286],{},"售前往往不愿意给，觉得“这些是我们的销售话术”。实际上把话术里的信息写进对比页，成交前的沟通成本会降下来，他们的活反而更少。",[11,288,289],{},"对比页是决策工具，不是宣传物料。这个定位一旦混了，页面的价值就没了。",{"title":91,"searchDepth":92,"depth":92,"links":291},[292,293,294,295,296,297,298,299],{"id":215,"depth":92,"text":216},{"id":225,"depth":92,"text":226},{"id":235,"depth":92,"text":235},{"id":244,"depth":92,"text":244},{"id":253,"depth":92,"text":253},{"id":262,"depth":92,"text":262},{"id":268,"depth":92,"text":268},{"id":277,"depth":92,"text":277},"内容运营","2026-03-14","对比页的目的不是证明自己更好，是帮用户做决定。我们改过一个对比页，只是把结构从“我们更强”改成“谁适合谁”，试用率从 1.1% 到 2.6%。",{},"\u002Fblog\u002Fcomparison-page-tone",{"title":207,"description":302},"blog\u002Fcomparison-page-tone",[308,309,310],"对比页","内容写作","转化","4BSmFz3_dsDPHL6_fqE95M-OlIFpbwJJGdmHr-1a6GQ",1794088107655]