WebFonter：在任何網站上預覽 ​​FontShop 字體－現在哪些功能可用

WebFonter 是一款瀏覽器工具，可讓使用者在購買字體之前直接在網站上試用 FontShop 的字體。它允許設計師在網站上修改標題和正文，而無需透過靜態樣本來判斷字體效果。這種最初的工作流程如今已成為歷史：FontShop 的線上商店已於 2023 年關閉，原 WebFonter 地址現在重定向到 FontShop 的資訊頁面，而非安裝工具。您仍然可以透過 MyFonts 預覽字體，並在瀏覽器開發者工具中嘗試調整網站的排版。

現在還能安裝 WebFonter 嗎？

請勿依賴舊的 WebFonter 安裝說明。根據Monotype 官方平台關閉常見問題解答，FontShop.com 電商平台已於2023 年 12 月 15 日停止營運。原WebFonter 網址現在指向 FontShop 資訊頁面，該頁面會將使用者引導至 MyFonts。目前無法驗證任何受支援的 WebFonter 擴充功能或書籤工具。因此，舊的 Chrome 擴充功能和書籤工具的說明僅供參考，並非有效的安裝指南。

WebFonter 最初做了什麼

該工具的主要優勢在於能夠將字體置於實際環境中查看。設計師無需打開單獨的字體樣本，即可查看真實頁面並更改其字體，同時保持佈局可見。

1. 打開一個網站。該工具最初以 Chrome 擴充功能和其他瀏覽器的書籤小程式的形式提供。據稱，只要字體服務可訪問，它就可以在線上網站和本地主機網站上使用。
2. 選擇字體系列。「更改字型系列」控制項可讓您在 FontShop 目錄中瀏覽和搜尋字型。選擇字體系列後，頁面預覽將更新。
3. 分配和調整樣式。最初的介面從標題和正文開始，可以添加其他目標，並提供一個微調控件，用於調整大小、行高和間距。

這些是歷史功能描述，並非目前選單的確認資訊。一些早期的評論也提到可以使用Ctrl+H快捷鍵隱藏 WebFonter 控制項。在現代瀏覽器中，請勿使用此方法：如果頁面或工具未阻止，Ctrl+H 通常會開啟瀏覽記錄。

今天如何在網站上測試 FontShop 字體

FontShop 的 FontFont 字型庫現已透過FontShop 官方資訊頁面和MyFonts提供。此方法將字體發現與頁面測試分開；與舊版 WebFonter 不同，它並非一鍵式 FontShop 到網站的預覽。

1. 使用您自己的文字預覽字體。

在 MyFonts 上尋找候選字體系列。在字體系列或單一樣式預覽中，輸入項目中的實際標題、導覽標籤或段落。根據MyFonts 常見問題解答，您可以調整預覽大小和顏色，並查看支援的 OpenType 功能。其「字體庫」功能也有助於收集字體以便並排比較。檢查幾種字重：美觀的標題字體可能不適合長段落。

2. 檢查要更改的文本

在 Chrome 瀏覽器中開啟您的網站，右鍵點擊標題或段落，然後選擇「檢查」。「元素」面板會顯示選取的 HTML 節點；「樣式」面板會列出影響該節點的 CSS 程式碼。您也可以使用元素選擇器選擇頁面上的文字。有關控制項的詳細說明，請參閱Google 的「檢查模式」指南。

3. 暫時嘗試不同的字體排版。

在「元素」→「樣式」中，編輯現有的字型系列聲明或為選取元素新增新的字型系列聲明。例如，您可以嘗試使用Georgia, serif作為本地可用的襯線字體，然後嘗試調整font-size、line-height或letter-spacing 等參數。變更通常會立即生效，但不會永久影響已發布的網站。 Google 在其開發者工具 CSS 參考文件中詳細解釋了這些控制項。

重要提示：在 CSS 中輸入商業字體名稱並不會自動下載或載入該字體。若要使頁面上顯示實際的商業字體，該字體必須已透過已授權並載入的字體資源或已授權的本機安裝提供。否則，瀏覽器將顯示備用字體預覽。請勿將備用字體預覽誤認為您想要購買的字體。

4. 部署前請檢查許可證

免費預覽版並不代表您有權在公共網站上託管字體檔案。 MyFonts 解釋說，網頁字體是透過@font-face嵌入的，需要相應的網頁字體授權；允許的網域名稱和頁面瀏覽條款取決於該產品的授權協議。在將文件新增至生產環境之前，請務必查看字體系列的授權資訊和您的購買條款。僅憑桌面許可並不一定意味著可以用於網頁嵌入。

在最終確定字體之前需要檢查哪些內容

• 標題適配性：標題在桌面端和行動端寬度下是否自然換行？
• 內文可讀性：小字號、小行高和小段落密度是否舒適？
• 字重和字元：您需要的粗體、斜體、標點符號和語言符號是否可用？
• 實際載入：顯示的是實際的臉部圖像，還是瀏覽器的備用圖像？
• 許可：您購買的套餐是否涵蓋您網站的使用？

如果更改似乎沒有效果，請檢查是否有更具體的 CSS 規則覆蓋了您的編輯，字體是否實際加載，以及您是否選擇了正確的頁面元素。測試多個視口寬度。 WebFonter 最初的吸引力在於能夠即時顯示上下文；如今，將 MyFonts 字體樣本與 DevTools 的臨時編輯相結合，提供了一種實用的方法，讓您能夠做出明智的字體選擇，而無需依賴已停止使用的工具。