關於: TTF 轉 WOFF2
TTF 轉 WOFF2 工具把桌面 TrueType 字型轉換為 WOFF2,這是所有現代瀏覽器首選的網頁字型格式。WOFF2 使用 Brotli 壓縮和專門的字符轉換,一般 TTF 檔案通常能縮小 50%–70%,而且一個字元都不會遺失。字型越小載入越快,文字顯示得越早,LCP 等 Core Web Vitals 指標也會跟著提升。
拖入一個檔案或整個字型家族,工具就會產生 WOFF2 檔案以及 @font-face 規則,字重、樣式和 font-display: swap 都已寫好。把字型上傳到樣式表旁邊,貼上 CSS,就不必再從第三方伺服器載入字型。所有處理都使用 Google 官方 WOFF2 編碼器在瀏覽器中完成,字型不會上傳。
正確地在自己網站上託管字型
把字型放在自己的網站上,而不是從其他服務載入,可以讓網頁更快,也避免把造訪資料傳送給第三方。
步驟
- 只加入真正用到的字重的 TTF。每多一個字重就多一點載入時間,用不到的就別加。
- 下載 WOFF2 檔案並上傳到網站。
- 複製
@font-face規則。規則裡已包含font-display: swap,網頁字型載入時文字會先用備用字型立即顯示。
範例
body { font-family: "MyFont", "PingFang TC", "Microsoft JhengHei", sans-serif; }
一個典型的西文 TTF 有 150–250 KB,轉成 WOFF2 後約 60–100 KB。中文字型包含數千個漢字,通常有好幾 MB,即使轉成 WOFF2 也很大。網站上最好只用必要的中文字型,或使用系統內建字型,例如蘋方和微軟正黑體。
使用方法
- 把 TTF 檔案拖到上傳區域,或點擊選擇檔案。
- 稍待一秒,每個字型都會被壓縮為 WOFF2。
- 個別下載 WOFF2 檔案,或全部打包成 ZIP 下載。
- 複製 @font-face CSS 並加入你的樣式表。
常見問題
WOFF2 比 TTF 小多少?
通常小 50%–70%,視字型而定。150 KB 的 TTF 轉成 WOFF2 後一般在 45 到 70 KB 之間。
所有瀏覽器都支援 WOFF2 嗎?
支援。Chrome、Edge、Firefox、Safari 及其行動版都支援 WOFF2,可以只提供這一種格式。
WOFF2 會損失品質嗎?
不會。這是無損壓縮,TTF 中的所有字符、字距對和 OpenType 特性都會保留。
