我曾說過方正北魏楷書是最佳的閱讀字體,不過後來感覺長時間閱讀的體驗還是普通的楷體更好。但這並不妨礙在Reeder、博客這種短時閱讀場合突出頁面的設計感。

今天把博客(hexo)的webfont改成了方正北魏楷書,用font-spider壓縮後,從13M縮減到1.4M。方法是這樣的:

首先把完整的字體複製到主題的字體目錄中(themes/crisp/source/fonts),文件名為FZBeiWeiKaiShu-full.ttf

在CSS中加入webfont配置:

1
2
3
4
5
@font-face {
font-family: 'FZBeiWeiKaiShu';
src: url('../fonts/FZBeiWeiKaiShu.ttf') format('truetype'),
url('../fonts/FZBeiWeiKaiShu-full.ttf') format('truetype');
}

FZBeiWeiKaiShu.ttf是壓縮後的字體文件名,這樣訪問時瀏覽器會優先下載壓縮後的字體。

然後把CSS中使用字體的地方都指定為FZBeiWeiKaiShu

在博客根目錄下創建腳本update_fonts.sh

1
2
3
4
5
6
7
8
9
10
11
12
#!/bin/sh
hexo clean
hexo g
find public -name "*.html" |xargs sed -i '' "s#/styles/crisp.css#$HOME/Projects/blog/public/styles/crisp.css#g"
find public -name "*.html"|xargs font-spider
cp -f public/fonts/FZBeiWeiKaiShu.ttf themes/crisp/source/fonts/FZBeiWeiKaiShu.ttf
hexo clean
hexo s -g

除非用到新的字符,否則不需要經常更新字體。

font-spider會提示一共使用了多少種字符,我這麼多年也只用到三千多種,真是太沒文化了。🤥