[TOC] # web中文字體的幾個解決方案 用到了字體就必須了解：你所需的文字越多，字體文件的體積就越大。如果字體文件已經超過1M，幾乎就可以放棄了。 ## 一. 收費云平臺 1. [有字庫](http://www.youziku.com/) 2. [http://yun.foundertype.com/](https://link.jianshu.com?t=http://yun.foundertype.com/) 方正字體云服務，根據官方網站的介紹： 網頁、APP因高質量字體而卓越，提供極致閱讀體驗。突破中文高質量字體需轉化為圖片的限制，兼顧體驗與SEO，提升關鍵字搜索排名。方正字體云服務的官方平臺方正是最大、最專業的中文字體提供商。 方正字體云服務大概提供有一百多種在線字體，但并沒有提供公開報價。 3. [https://www.justfont.com/](https://link.jianshu.com?t=https://www.justfont.com/) justfont，來自臺灣的線上中文字體服務，有明確的報價（新臺幣）。也有一百種字體左右提供選擇，注意要找那些簡繁字體均有的。 其實兩家服務都差不多，justfont在報價上比較透明，但支付方面恐怕比較麻煩。 那么，有沒有辦法讓字體運行在自己的服務器端，然后文件又比較小的方案呢？答案是有的。 ## 二. 中文webfont的解決方案:字體子集化 中文三大家網絡公司都有提供字體子集化的服務。所謂字體子集化就是簡化字體，將不需要的字從字庫剔除，提取僅需要的文字另存為新的字體文件，字體當然就小了。 騰訊：[font-spider](https://link.jianshu.com?t=http://font-spider.org/) 百度：[font-min](https://link.jianshu.com?t=http://ecomfe.github.io/fontmin) 阿里巴巴：[icon-font](https://link.jianshu.com?t=http://iconfont.cn/webfont/#!/webfont/index) [font-carrier](https://link.jianshu.com?t=http://purplebamboo.github.io/font-carrier/) ## 三.打包成web 圖標字體 ### 導入到IcoMoon IcoMoon是一款免費的WEB APP，通過使用不同的設置，讓我們能夠創建出自定義的ICON字體。 **網站地址:** [http://icomoon.io/app/](https://link.jianshu.com?t=http://icomoon.io/app/) IcoMoon本身也有海量的圖標，當然也包括Font Awesome。我非常喜歡Font Awesome的原因是：中文社區LOGO也包括其中，如QQ、微信、微博等。 點擊IcoMoon的左上角Import Icons，選擇剛剛保存的svg格式文件導入。 點擊左下角的Add Icons From Library... ，選擇Font Awesome，將需要的圖標單擊一下。選擇完成后，點擊Generate Font，生成字體后點擊Download。 # 使用sfntly中的sfnttool.jar提取中文字體 很給力的字體抽取工具 下載 [Font Converter](https://github.com/Jijun/font-converter-gui/) 運行： ``` java -jar C:\Users\USERNAME\Documents\font-converter-gui-***-jfx.jar ``` # 番外 [fonteditor 在線ttf字體編輯器](https://github.com/ecomfe/fonteditor) # 轉為Base64 **將字體轉化為Base64編碼** https://everythingfonts.com/ https://transfonter.org/ https://www.base64encode.org/ 打開[https://transfonter.org/](https://transfonter.org/)網站，上傳成功后打開Base64 encode選項，點擊Convert，然后點擊Download便可以導出轉化后的字體。 # 總結 缺點是操作繁瑣，還有一個SEO的問題。對于小范圍的固定文案改動還是能適用的，但對于大篇幅文本字符改動或動態生成的文本內容，就比較雞肋了。 # Refs [網頁特殊字體包壓縮與精簡（fontmini）](https://blog.csdn.net/bowen11233/article/details/82115043) [Web 中文字體應用指南](https://ruby-china.org/topics/14005) https://www.jianshu.com/p/6cf02ae8e190