美化记录：网站字体文件如MiSans的分包及自托管引入教程

前言

优缺点

不如引入单个字体文件来得快，也就是ttfb时间可能会变多。

解包后是一堆小文件，在网络不佳时有优势。

尝试自托管

首先找到MiSans的官网下载字体文件，misans是免费且可以商用的，所以完全不用担心侵权的问题。

MiSans Global 需要付费吗？

不需要。MiSans Global 所有的字体都是供全球免费商用，您可以在任何平台、任何商业项目中使用所有字体。

是否可以用作嵌入式字体？

可以。但您应在软件中特别注明使用了 MiSans 字体。

我可以在软件中修改编辑、二次创作字体吗？ 您可以自由调节字体的粗细、间距等。但您不得单独将 MiSans 字体或其组件进行外观上的更改。

下载后可以发现有不同格式：

选择一种格式，例如woff2。找到中文网字计划的在线字体分包器，上传字体开始分包后就会得到成品文件夹，里面包含了细分 woff2 文件、CSS 索引文件、reporter.json 等静态文件。

解包完成显示这样：

托管上传

将压缩包上传到自己的服务器或者oss，并解压。

引用

在自定义头部代码加入：

<link rel='stylesheet' href='https://www.miwap.com/*****/misans/result.css' />

改成你自己的路径。

自定义css：

body {
font-family: 'MiSans Medium';
font-weight: 400;
};

设置防盗

由于是放置在自己服务器，所以记得提前设置好防盗措施。如黑白名单等等。另外懒得解包的我会在结尾放置一份我已经弄好的。建议自己搞，实在不会可以发邮件咨询。