TTF、OTF、WOFF 差在哪？字型格式安裝與網頁使用指南 | UltKit

TrueType 是這四種格式中最早的。Apple 在 1991 年隨 System 7 推出，Microsoft 隔年將它用於 Windows 3.1。TrueType 字型以二次曲線描述每個字母，每段曲線只有一個控制點，在早期硬體上繪製成本低。它也內建微調（hinting）：字型內的小程式會把筆畫和曲線對齊到像素格線，讓文字在低解析度螢幕上依然清晰。.ttf 副檔名至今仍代表使用這類二次輪廓的字型。

OpenType 由 Microsoft 與 Adobe 在 1996 年發表，它是一種封裝格式，而不是新的輪廓類型。它可以包含 TrueType 輪廓，也可以包含存放在 CFF 表中的 PostScript 輪廓，後者使用三次曲線，每段有兩個控制點。在輪廓之外，它加入了進階排版所需的版面配置表：標準與選用連字、小型大寫、舊式數字、樣式集、上下文替代字形和字距調整。依慣例，以 CFF 為基礎的 OpenType 字型存成 .otf，而採用 TrueType 輪廓的 OpenType 字型則維持 .ttf 副檔名。

WOFF 和 WOFF2 是為網頁設計的封裝格式。WOFF 於 2009 年起草，2012 年成為 W3C 建議標準，以 zlib 壓縮每個字型表。WOFF2 在 2018 年成為 W3C 建議標準，改用 Brotli，並先預處理字形資料，通常比 WOFF 小約 30%。另外還有三種相關格式：EOT 是 Internet Explorer 專用的網頁格式，SVG 字型是只有 Safari 支援的早期權宜之計，而 2016 年隨 OpenType 1.8 加入的可變字型，能把一整段字重或字寬範圍放進同一個檔案。

安裝 TTF 或 OTF 即可，不必在意選哪一種。Windows 10 和 11 按右鍵選擇安裝就能裝好兩者，macOS 用「字體簿」開啟，Linux 桌面環境則在字型快取更新後，從 ~/.local/share/fonts 載入。Word、Photoshop、Figma 桌面版、Affinity 和 LibreOffice 都能讀取。如果設計師同時給你兩種版本的同一字型家族，OTF 通常是字型設計師的原始繪製版本，TTF 則是為舊軟體做的轉換版。

兩者有差別的情況很少。部分刻字機和刺繡程式、遊戲引擎以及微控制器顯示函式庫只支援 TrueType 輪廓，以 CFF 為基礎的 OTF 在這些地方會顯示異常，需要先將 OTF 轉換為 TTF。反過來說，桌面系統無法直接安裝 WOFF 或 WOFF2，這些檔案是為瀏覽器打包的。同一個字型家族只要安裝一個版本，因為內部名稱相同的 TTF 和 OTF 會讓字型選單混淆，應用程式可能選到錯的那一個。

目前所有版本的 Chrome、Edge、Firefox 和 Safari 都能讀取 WOFF2，所以它應該是 @font-face 規則中的第一個來源，甚至是唯一來源。只有當你的分析資料仍顯示約 2016 年以前的瀏覽器，例如舊版 Android WebView 或內建電視瀏覽器時，才需要在後面加一行 WOFF。瀏覽器會依序檢查 src 清單，並下載第一個它支援的格式，所以備援對現代瀏覽器的訪客沒有任何成本。如果你已有桌面版 TrueType 檔案，用 TTF 轉 WOFF 一次就能產生這個備援檔。

除非平台強制要求（部分電子郵件編輯器和舊式內容系統就是如此），否則請避免在網站上直接提供原始 TTF 或 OTF。瀏覽器雖然能正常顯示，但除非伺服器對字型啟用 gzip，否則檔案會以未壓縮狀態傳輸，而且任何人都能直接拿到可安裝的桌面版。下方的 font-display: swap 會讓瀏覽器先以備用字型顯示文字，等你的字型載入後再替換，而不是等待並隱藏文字長達 3 秒。

盡量把字型檔放在自己的網域。Chrome、Safari 和 Firefox 現在都依網站分割快取，從共用 CDN 取得的字型不再能跨網站重複使用，而自行代管還能省下一次 DNS 查詢和連線。只對首屏使用的一兩種字重加上 <link rel="preload">；預先載入每一種樣式會與圖片爭搶頻寬。

單一拉丁文字重存成 WOFF2，通常約 20–60 KB。同一字型若是未壓縮的 TTF，往往大兩到三倍；若字型家族還涵蓋希臘文、西里爾文和越南文，每種樣式可能超過 200 KB。中日韓字型則完全是另一個量級：完整的一種字重包含數萬個字形，即使經過 WOFF2 壓縮通常仍有數 MB，要等它載入完才顯示頁面文字，實在太慢。

子集化會移除頁面用不到的字元，而 unicode-range 則告訴瀏覽器某個檔案涵蓋哪些字元，因此只有頁面真的含有這些字元時才會下載該檔案。Google Fonts 處理中日韓字型時正是這樣做，把每個字型家族切成許多小片段，依需要載入。對於你自己的字型，字型轉換器中的保留字元選項可以在檔案上傳到伺服器前，把它精簡為 Latin + accents 或僅我輸入的字元；要安裝在電腦上的字型，請保留所有字元。

在 TrueType 型字型之間，TTF 與 OTF 互轉只是更換容器：輪廓表、字型度量和版面配置功能都原封不動地搬過去。比較特別的是把以 CFF 為基礎的 OTF 轉成 TTF。三次曲線無法直接複製到二次輪廓格式，因此每條曲線會被重新繪製成一段或多段二次曲線，誤差遠小於一個像素。PostScript 微調指令同樣無法轉譯，所以 OTF 轉 TTF 工具提供的微調（Hinting）選項有保留、移除或自動微調。

從網頁格式轉回桌面格式是最常見的轉換。你下載了佈景主題或設計素材，卻只找到 .woff 或 .woff2 檔，而你需要在 Word 或 Figma 中使用該字型。WOFF 轉 TTF 會解除壓縮並寫回原本的資料表，因此字形、字距和功能都與原檔相同。無法恢復的是網頁版本已經丟掉的內容，例如子集化移除的字元，或為了省空間而刪去的微調資訊。

多數轉換問題都來自三件事：微調、版面配置功能和可變軸。下列清單整理了轉換後你可能注意到的狀況，以及各自常見的原因。

字型檔就像一個小型資料庫，其中三個部分就能回答大多數問題。name 表存放字型家族名稱、樣式名稱、版本、著作權聲明，通常還有授權網址；macOS 的「字體簿」在資訊檢視中可以看到，Windows 的字型預覽則顯示開頭幾行。字形涵蓋範圍決定字型能排哪些語言：只含拉丁字母的字型遇到波蘭文、土耳其文或越南文中缺少的字元時，會默默改用其他字型。對於可變字型，fvar 表列出它的軸，例如 100 到 900 的字重，或 75 到 125 的字寬。

字型上線前值得先看一下授權。商業字型公司常把桌面、網頁和 App 授權分開販售，桌面授權通常只允許安裝在一定數量的電腦上，不包括提供給網站訪客下載，或內嵌到行動 App。轉換字型只會改變檔案格式，不會改變授權，所以由桌面 TTF 製作的 WOFF2 與該 TTF 適用相同條款。採用 SIL Open Font License 的字型（Google Fonts 大部分屬於此類）可以轉換、子集化並自行代管。

多數字型問題都歸結於檔案要放在哪裡。如果要安裝在電腦上或封裝進 App，就用 TrueType 或 OpenType；如果是由瀏覽器下載，就用壓縮的網頁封裝格式。下表把常見情境對應到該選的格式和轉換方式，讓你可以略過歷史，直接找到需要的檔案。

有兩種用途介於這些類別之間。EPUB 3 接受 TTF、OTF 和 WOFF，所以電子書可使用任一類格式；SVG 字型檔與向量圖屬於同一脈絡，但現在主要用於部分繪圖機和雕刻軟體，而非瀏覽器。