文字排版詞條 3-46

字體載入Font Loading

也常叫做：字體載入、字體閃爍、FOUT

你可能會這樣說

頁面載入時先看到預設系統字，一秒後「閃」一下換成指定字體，跳版又難看，有時還停在那個醜字很久。

這個閃動有名字：FOUT（先顯示替代字、再換上真字）。原因是網路字體檔案大、下載需要時間，瀏覽器等不及就先用系統字頂替；中文字檔動輒數 MB，這件事在繁中網站特別嚴重。

標準解法是只載用到的字重、加上替換策略：先用近似的系統字、字檔到了再換，至少行為可預期。更講究的站會做子集化——只打包頁面上真的用到的字。

跟 AI 說「字體載入最佳化、避免跳版」，它會檢查預先載入、字重清單與顯示策略。

點上面的片段，看字體載入策略的每一塊拼圖。

圖 3-46　字體載入四步：握手、先頂替、只載需要的字重、子集化。

中文就可以

我的網站有字體閃爍問題，請最佳化：
載入策略改成先顯示近似系統字、下載完成後平滑替換。
只載入實際用到的字重與字集，移除用不到的。
字檔加上預先載入提示，放在正確的位置。
用慢速網路模擬測試，前後截圖給我比較跳版程度。