我們每天工作都會接觸到不同的字體，無論是寫文件、看網頁還是寫程式，都離不開它。我們需要對字體有一個基本的瞭解。

1. 籠統的「字體」概念：什麼是 Font Face？

在日常生活與計算機領域中，我們口中籠統說的「字體」，其實指的是 Font Face（字型面）。它是一套完整的視覺設計方案，包含了特定風格下的所有字符（英文字母、數字、標點符號、漢字等）的具體形狀（Glyph）。

可以把它想像成一本「圖形說明書」：當計算機想要顯示字母 A 或漢字「永」的時候，它就要查閱這本說明書，來決定這個字要畫成圓潤的、剛硬的、還是有小爪子的。字體的「長相」與「編碼」是分開儲存的——編碼只管給字符發「身分證號碼」，而字體（Font Face）則決定這個號碼對應的人（字符）到底長什麼樣子。

2. 字體的家族分類：Font Family

字體的世界五花八門，為了方便辨識與使用，我們根據其外觀特徵將字體歸類為不同的「家族（Font Family）」。在網頁或文書軟體中，我們常看到的 font-family 設定，就是指這個。

2.1 襯線字體（Serif）

  • 特徵：在筆畫的起點與終點處，有額外的小裝飾線，稱為「襯線」，就像筆畫長了小爪子。
  • 感覺：古典、正式，具有閱讀連續性，長篇閱讀時較不易疲勞。
  • 常見例子：宋體（SimSun）、思源宋體（Source Han Serif）、Times New Roman。
  • 應用：紙質書籍、正式文件，以及需要降低視覺疲勞的長篇網頁內文。

2.2 無襯線字體（Sans-Serif）

  • 特徵：筆畫乾淨俐落，沒有額外的裝飾小爪，末端通常是平直的。
  • 感覺：現代、簡潔、清晰。
  • 常見例子：黑體、微軟雅黑（Microsoft YaHei）、思源黑體（Source Han Sans / Noto Sans）。
  • 應用：非常適合螢幕顯示（網頁、手機介面）。Windows 7 將預設字體從宋體換成微軟雅黑後，螢幕閱讀的舒適度大幅提升。繁體中文版本稱為微軟正黑體。

2.3 等寬字體（Monospace）

  • 特徵：每個字符的橫向寬度完全相同（例如 i 和 w 佔據一樣的顯示寬度）。
  • 應用：程式碼編輯器的必備字體，因為等寬能讓程式碼完美對齊，便於除錯與閱讀。
  • 常見例子：思源等寬體（Source Han Mono）、微軟出品的 Cascadia Code、Courier New。

2.4 其他字體族

  • 手寫體（Script）：模仿人類書寫筆跡，具有親和力。
  • 奇異字體（Fantasy）：裝飾性很強的藝術字，適合用於標題或海報。

2.5 關於字重（Weight）

除了風格，字體還有粗細之分，也就是「字重」。例如 Black（特黑）、Bold（粗體）、Regular（常規）、Light（細體）。字重越粗，視覺衝擊力越強，通常用於標題；字重越細，則給人優雅、輕柔的感覺，常用於內文或註解。

3. 字體檔案的奧秘：Adobe、微軟與蘋果的技術合作

字體的外觀不能憑空產生，必須儲存在特定的檔案格式中。這背後的技術演進，其實就是 Adobe、微軟（Microsoft）與蘋果（Apple）三大巨頭不斷競爭與合作的歷史。

  • PostScript Type 1（Adobe 主導）：在個人電腦早期，Adobe 開發了 PostScript 頁面描述語言，並推出了 Type 1 字體格式。它基於貝茲曲線描述字符，列印品質極高，但當時這是一種「專利格式」，Adobe 靠授權賺取了大量利潤，且字體檔案結構複雜。

  • TrueType（Apple 與 Microsoft 聯手）：為了打破 Adobe 在列印字體上的壟斷，Apple 在 1990 年代初開發了 TrueType 格式，隨後微軟也加入陣營。TrueType 採用二次貝茲曲線（與 Type 1 的三次不同），運算速度更快，且完全開放授權。自此，個人電腦的螢幕顯示品質大幅躍進。

  • OpenType（Adobe 與 Microsoft 世紀合作）：千禧年前後，雙方意識到競爭不如合作。Adobe 與微軟聯手推出了 OpenType 格式（副檔名 .otf）。它本質上是 TrueType 的超集，並將 PostScript 的曲線能力（CFF）與 TrueType 的技術融合在一起。OpenType 支援多達 65,535 個字符，足以容納整個 Unicode 字符集，且支援進階排版功能（如連字、變體字）。現在，OpenType 已成為全球最主流的字體標準。

  • TrueType Collection（TTC，Apple 技術）：蘋果發明的 TTC 格式允許將多個字體（如「細體」與「粗體」）打包到同一個檔案中，共用相同的筆畫數據，大幅節省了儲存空間（這對中文大字符集尤其重要）。

  • CJK 字體的合作（Adobe 與 Google）：進入了網路時代，Adobe 與 Google 跨國合作開發了思源字體家族（Source Han Sans / Noto Sans）。這是一套開源的字體，目的在於「No Tofu（沒有豆腐塊）」，希望能完整覆蓋台灣（TW）、香港（HK）、日本（J）、韓國（K）、簡體中文（SC）等不同地區的漢字寫法。這是東亞字體史上最大規模的開放式合作計畫。

  • Web 字體格式（WOFF）：進入網路時代，微軟、Mozilla 與 Opera 等組織主導開發了 WOFF（Web Open Font Format） 及更先進的 WOFF2。這是在 OpenType/TrueType 基礎上加上壓縮層的格式，專門為了讓瀏覽器能更快下載字體。

4. 字體在網際網路中的使用

在網頁設計中，字體的設定不僅關乎美觀，更關乎效能與版權。

4.1 後備機制（Fallback）

網頁通常會指定一串字體列表，例如 font-family: "微軟雅黑", "宋體", sans-serif;。瀏覽器會從第一個開始嘗試讀取，如果使用者的系統沒有安裝該字體，就會自動「後退（Fallback）」到列表中的下一個字體。這就是為什麼最後一定會加上 serif 或 sans-serif 作為最終的保底選項。

4.2 使用系統字體（System UI）

為了避免下載龐大的字體檔案浪費流量，許多網站會直接使用 system-ui 這個關鍵字，強制瀏覽器呼叫使用者作業系統預設的介面字體。這樣可以達到「一秒載入」且與使用者操作環境完美融合的效果。

4.3 網頁字體（Webfont）

如果設計師堅持使用特定漂亮字體（例如思源字體或特定英文字型），就必須透過 @font-face 語法將字體檔案直接上傳到網頁伺服器，讓使用者在瀏覽時下載該字體。然而，中文 Webfont 非常耗費流量，一個完整的中文字體檔案可能要 5~10 MB，會嚴重拖慢網頁載入速度。因此實務上通常只會動態擷取「常用字集」，或者僅將 Webfont 用於標題（避免內文大量載入）。

5. 從編碼到解碼：為什麼會有亂碼？以及如何解決？

前面我們談的都是字體的外觀與檔案。但字體顯示之前，計算機必須先找到對應的字符編號，這就牽涉到最底層的編碼與解碼。亂碼的根源，正是在這個環節出錯。

5.1 爲什麼要編碼？

一切先從計算機的結構說起。目前的計算機基本全都是電子計算機，用電子元器件的電壓邏輯狀態來表示數。電壓邏輯狀態可以和生活中的開關進行類比：開關有開和關兩種狀態，不是開就是關。對於電子元器件來說，它的一些物理量也可以用來表示狀態。比如用它電壓，高電壓就 1，低電壓就是 0。這裏有幾個問題：

爲什麼要用電子元器件？答案是用機械器件也是可以的。古早的計算機就是用的機器器件，偉大的發明——算盤也可以。但是電子元器件的優勢在於我們加工技術很成熟，可以一下把很多個集合到一起，比如說我們常常聽說某某 CPU 集成了幾億個晶體管，就是這個意思。

爲啥只有高低電壓兩個狀態？因為計算機本質上只能處理邏輯運算，而邏輯運算的「是」與「非」正好完美映射到二進制的 1 與 0。計算機中所有的運算都會轉換為二進制，最終轉換為邏輯運算。

對於數學運算（如十進制的加減乘除），轉換還比較直接。但對於字符等非數學運算，因為沒有辦法直接硬體實現，就需要將字串的運算轉換為邏輯運算：

  • 字符/字串本身轉換為 01 邏輯（編碼）。
  • 運算符（如連接）轉換為邏輯運算子號。

5.2 編碼（Encode）與解碼（Decode）的雙向過程

將字符編碼為二進位的過程叫做編碼（Encode）；將二進位數據還原為人類可讀字符的過程叫做解碼（Decode）。

舉一個例子，我們定義一個字串的加法 a + b = ab。計算機要怎麼表達 a 呢？我們可以給它編個號碼（例如 0101），這個 0101 可以直接對應到硬體的四個電路開關。

無論對於編碼還是解碼，都需要有一個統一的標準（編碼表）。例如 ASCII 編碼使用 65 來表示大寫的 A。當你儲存一個 A 時，計算機硬碟存的是 65（二進位的 1000001）；當你要讀取時，計算機看到 65，就會去 ASCII 表格查詢，得知 65 對應 A，然後再調用字體檔案將 A 渲染到螢幕上。

如果編碼和解碼使用的標準不一樣，就會出現亂碼。 比如我用 Big5 去編碼一個繁體字「你」，得到一個二進位數字；但你的電腦卻用 GBK（簡體編碼）去解讀這個數字，解出來的可能就是一個莫名其妙的簡體字或符號，這就叫亂碼。

5.3 常見字符編碼比較

為了更直觀地理解區別，以下是計算機中常見編碼的對比表格：

編碼標準 全稱 / 別稱 主要使用地區 特點與字符涵蓋 位元組長度（英/中）
ASCII 美國標準資訊交換碼 全球（基礎） 僅含英文字母、數字、控制字符 固定 1 位元組
Big5 五大碼 臺灣、港澳、海外華人 針對正體中文，收錄約 1.3 萬字 英 1 位元組 / 中 2 位元組
GBK 國標擴展碼 中國大陸（簡體中文） 相容 GB2312，收錄 2 萬多字（含簡繁） 英 1 位元組 / 中 2 位元組
Unicode 萬國碼（UTF-8） 全球統一標準 目標是收錄全人類所有字符 英 1 位元組 / 中 3~4 位元組（UTF-8）

5.4 編碼之間的轉換（橋接機制）

不同編碼之間要互通，必須透過轉換表（Mapping Table）。現代作業系統與程式語言（如 Python、Java）的內部字串處理，全都採用以 Unicode 為中心的橋接機制：

  1. 當你打開一個文字檔，系統會嘗試探測它的編碼（例如是 Big5 還是 GBK）。
  2. 系統會將該檔案的字節序列轉換為 Unicode 碼點（存儲在記憶體中）。
  3. 當你要儲存檔案時，系統再把 Unicode 轉換為指定的輸出編碼（例如存成 UTF-8）。

如果轉換過程中，目標編碼不支援某個字符（例如 GBK 不支援某些特殊符號），系統就會輸出一個問號 ? 或「豆腐塊（�）」來表示缺字。

5.5 亂碼要如何解決？

既然明白了亂碼的成因，解決方案也就呼之欲出了：

  1. 統一使用 UTF-8（Unicode）編碼：這是最根本的解決方式。在儲存檔案、編輯器設定、網頁 <meta> 標籤、程式原始碼檔案等所有環節，一律強制指定為 UTF-8。這能確保全球任何語言的文字都不再產生衝突。

  2. 使用編輯器或指令重新轉換（轉碼）： - 如果你拿到一個舊簡體檔案（GBK）在繁體系統（Big5）上打開變亂碼，可以使用編輯器（如 VS Code、Notepad++）的「使用編碼重新開啟」功能，先指定正確的來源編碼（GBK），然後複製內容，再「另存新檔為 UTF-8」。 - 在 Linux 終端機中，可以使用 iconv 指令進行批次轉換。例如將 GBK 檔案轉為 UTF-8： 

    iconv -f gbk -t utf-8 input.txt > output.txt

  3. 檢測未知檔案的編碼： - 如果不確定一個亂碼檔案原本是什麼編碼，可以使用 Linux 的 file -i 指令，或 Python 的 chardet 套件來偵測可能的編碼。 - 例如：chardetect unknown.txt 會回傳最可能的編碼（如 Big5 或 GBK）。

總結： 字體決定文字的「長相」，編碼與解碼決定文字的「身分」。理解這兩套系統，你就能輕鬆應對排版與亂碼問題。在實務上，內文建議優先使用無襯線字體（Sans-Serif） 以提升螢幕閱讀體驗，標題可適當使用襯線字體（Serif）或粗字重來吸引目光，並且務必在儲存與傳輸時全面採用 UTF-8 編碼——如此一來，你既能擁有美觀的排版，也能永遠告別亂碼的困擾！