在瀏覽器中開啟字型檔案,輸入任何自訂文字,您就能查看瀏覽器能夠呈現的每個字符——而無需安裝字型或將檔案上傳到任何地方。字型字符是字體中代表某個字元的實際圖形,單一字型檔案可能為不同的字稿、數字和樣式變體內建了數百甚至數千個字符。使用 字型預覽工具,您可以挑選一個本機的 TTF、OTF、WOFF 或 WOFF2 檔案(上限 10 MiB),輸入您關心的文字或字元,選擇介於 8 到 200 像素之間的大小,並精確查看這些字符在您目前瀏覽器中的樣貌。缺失的字符會顯示為方框或替代字元,這讓涵蓋範圍的缺口一目瞭然。字型位元組從未離開頁面:瀏覽器透過其 FontFace API 讀取它們,將其作為臨時字型套用至文件的字型集中,並在分頁關閉或您挑選新檔案時將其移除。

how to view font glyphs
如何在不安裝字型的情況下檢視字型字符

「檢視字符」實際上代表什麼

字元(或代碼點)是 Unicode 標準指派的一個編號。字符則是字型為該編號描繪的圖形。一個字元可以對應到許多字符——例如一個帶有腔調符號的「a」可能內建了三種樣式變體——而單一字型可以包含數萬個在純 ASCII 中從不出現的字符。當設計師說他們想檢視字型中的字符時,通常意味著同時要做到三件事:確認形狀繪製得當、檢查他們打算使用的字元確實存在於檔案中,以及尋找樣式變體,例如裝飾性尾筆、小型大寫字母或舊式數字。

作業系統的字型檢視器和設計套裝軟體的字符面板多年來一直負責這項工作,但它們需要安裝或使用一套重量級的編輯器。本機瀏覽器預覽則能在最關鍵的情境下涵蓋相同範圍——在您決定購買授權或進行重新設計之前。這使得免安裝的路徑在以下情況下非常有用:評估字型廠商提供的示範檔案、您很久以前下載的字型範例包,或同事傳來供審閱的檔案。

使用字型預覽工具檢視字型字符

  1. 在目前的瀏覽器分頁中開啟字型預覽工具。此工具完全在頁面中執行;不需要擴充功能、帳號或伺服器上傳。
  2. 從您的電腦中挑選一個值得信賴的 TTF、OTF、WOFF 或 WOFF2 檔案。所選檔案不得為空,且大小不得超過 10 MiB,這能將解析時間和瀏覽器記憶體控制在合理範圍內。
  3. 在預覽欄位中輸入您想檢查的確切範例文字——一段包含所有字母的句子、一個品牌名稱、一串數字,或一列帶有腔調符號的字母。可接受純 Unicode 文字。
  4. 選擇一個介於 8 到 200 之間的整數像素字型大小。小尺寸能揭露內文文字大小下的字型微調與可辨識性問題;大尺寸則能看出設計的輪廓、曲線和間距決策。
  5. 在預覽區域中檢查渲染出來的字符。請特別留意任何顯示為空心矩形(「豆腐塊」)、問號,或來自作業系統的替代形狀的字元——這些都是缺失字符的訊號。
  6. 挑選另一個字型檔案來取代目前的字型。前一個字型會在載入新字型之前從文件字型集中移除,因此一次只會啟用一個字型。

關閉或重新整理分頁即可將暫時字型從頁面中完全移除。該檔案不會被複製到系統的字型資料夾中,應用程式偏好設定維持不變,也不會產生任何 CSS 套件。

預覽能告訴您關於字符涵蓋範圍的哪些資訊

一旦字型載入完成,預覽結果會反映瀏覽器在您所選大小下能從檔案中解析出的所有字符。您輸入的每個字元都呈現得乾淨清晰,代表該字型包含這些代碼點的字符,且瀏覽器引擎已成功解碼它們。如果出現方框、問號,或明顯不相符的替代字母,則代表該字型缺少該字符——或者較少見的情況是,該檔案本身已損壞。預覽上方顯示的標籤是檔名,而非權威性的內部字型家族或樣式記錄;一個名為 Demo Bold 的檔案內部可能帶有不同的中繼資料。

因為預覽純粹是視覺性質的,它最適合作為涵蓋範圍的抽樣檢查。下表列出最實用的檢查字串,以及每個字串通常能透露關於該檔案的哪些資訊。

要輸入的文字檢查內容
The quick brown fox jumps over the lazy dog完整的大小寫拉丁字母涵蓋範圍、基本標點
0123456789 $£€¥等寬或比例數字、貨幣字符
áéíóúñçßøå西歐語言使用的帶腔調拉丁字元
—–""''…長破折號、短破折號、智慧引號、刪節號
АаБбВвЯя若字型宣稱支援,則檢查斯拉夫字母字稿
日本語 中文 한국어漢字、平假名、片假名與韓文字的涵蓋範圍

如果某一行渲染得乾淨清晰,您就擁有該檔案中這些代碼點涵蓋範圍的直接證據。如果某一行包含替代形狀,則代表該檔案要嘛缺少這些字符,要嘛雖然包含但瀏覽器無法解碼。此工具本身不會合成缺失的字符、無法證明完整的語言支援,也不會枚舉字元對應表;您所讀取的是瀏覽器自身字型引擎所產生的視覺結果。

預覽無法告訴您的內容

瀏覽器預覽是一種快速的檢視方式,而非一種認證。下表區分字型預覽工具能夠支持的說法與無法支持的說法,讓您不會過度信任結果。

預覽能夠確認預覽無法確認
瀏覽器引擎能解碼該檔案且沒有錯誤該字型已取得您預期用途的授權
所選的範例字元以所選設計呈現完整的 Unicode 字元對應表或所有支援的語言
字符在所選像素大小下確實以視覺方式存在替代字元是由字型繪製還是由瀏覽器繪製
重新載入同一個檔案能重現相同的形狀在其他系統上的精確列印輸出、字距品質或字型微調
不同的檔案能乾淨地取代先前的字型無障礙性、效能或跨平台渲染的等價性

此工具不會產生 @font-face CSS 區塊、不會對檔案進行子集化、不會並排比較多個字型,也不會聲稱渲染乾淨就代表可以重新散布該檔案。特別是授權方面的決定,必須依據字型本身的實際授權條款。

實用的字符檢查清單

在決定一個字型是否值得安裝之前,依序完成一份簡短的清單通常能回答大多數重要的問題。請開啟字型預覽工具,依下列順序輸入:

  • 您自己的品牌或產品名稱(混合大小寫),以確認您所發佈的精確字母形狀。
  • 一段包含字母表所有字母的完整句子,以凸顯細節怪異之處,例如過細的句點或造型奇特的「g」。
  • 從 0 到 9 的數字,以您打算使用的最小字型大小呈現,用以測試舊式或等寬數字的可辨識性。
  • 您預期會用到的每一個帶腔調字元,特別是您受眾姓名中使用的那些。
  • 您依賴的標點符號:長破折號、智慧引號、刪節號,以及任何特殊的記號,例如間隔點或中點。
  • 一個以非常大(接近 200 像素)尺寸呈現的單詞,以便近距離檢查輪廓、端點造型和間距決策。

如果每個項目都如您所預期地渲染出來,該檔案就是下一步動作的有力候選:在目標瀏覽器中以目標字重進行測試,接著閱讀授權條款。

在安裝前先在本機檢查的理由

安裝字型會將檔案寫入系統的字型資料夾,並向每個從該資料夾讀取資料的應用程式註冊該字型。在 Windows 和 macOS 上這個過程是自動進行的;在 Linux 上則取決於桌面環境。即使您信任來源,每次安裝都會為您的機器增加一項永久資產,而且在某些平台上,移除它所需要的動作不僅僅是刪除該檔案。僅透過瀏覽器的預覽方式可以避開這樣的副作用。該字型僅存在於頁面的文件字型集中,存活時間僅限於分頁開啟期間。如果您想比較兩個檔案,您可以在不讓系統多出兩個新字型的情況下進行;而如果您發現該檔案不合用,只需關閉分頁就能完成清理。

這也是一種更安全的方式來檢視來自不熟悉管道的字型範例:字型檔案是由瀏覽器程式碼處理的複雜二進位輸入,因此讓位元組保留在本機、並將預覽視為唯讀操作,才是謹慎的預設做法。如需從更廣泛的角度了解同一概念——在不承諾系統安裝的情況下進行預覽——請參閱如何在瀏覽器中本機預覽字型

當預覽無法載入時

副檔名被接受並不保證檔案一定能夠載入。瀏覽器字型引擎對其能解碼的內容要求嚴格。預覽失敗的常見原因包括:下載不完整或檔案損壞、副檔名正確但內部表格錯誤、被引擎拒絕的可變字型設定,或目前瀏覽器不支援的格式——例如某些從未以 TTF、OTF、WOFF 或 WOFF2 形式發佈的舊版 PostScript 風格字型。當載入失敗時,字型預覽工具會顯示明確的載入錯誤,而非假裝字型已成功載入,因此不會悄悄退回到預設字型。最簡單的復原步驟是:從原始來源重新下載該檔案、確認副檔名與實際內容相符,並在假設檔案無法使用之前,先在另一個目前版本的瀏覽器中嘗試開啟。

瀏覽器透過其 FontFace 和 Document fonts API 報告解碼結果;兩者皆記錄於 MDN — FontFaceMDN — Document fonts