選單

Inter UI 側重於螢幕易讀性的免費英文字型,文字偏小依舊可正常閱讀

Inter UI 側重於螢幕易讀性的免費英文字型,文字偏小依舊可正常閱讀

免費資源網路社群分享過不少免費字型,絕大部分都是以英文字型為主,畢竟英文字型在製作難度上相對於中文少很多很多,不過中文還是有 Google 和 Adobe 共同開發的思源黑體思源宋體可免費下載,算得上是近幾年免費中文字型最令人期待的開源計畫。英文字型就更不用說了,Google Fonts 一站滿足,如果你想將中文字型運用到網頁裡,可參考「Google Fonts 推出思源黑體中文網頁字型,改善網頁文字顯示效果」教學說明。

接下來要介紹的「Inter UI」是一款免費英文字型,它的特色是專為使用介面設計,側重於電腦螢幕上的可讀性,即使在文字偏小的情況下依舊可以正常閱讀,此外,還針對幾個可能容易誤判或在內文中看起來不那麼平衡的字元進行微調,例如針對周圍字元形狀調整標點符號的對齊位置、容易被誤判的 “0” 或 “o” 等等。

Inter UI 是免費及開放原始碼字型家族的一員,你可以在任何想像得到的方式下自由使用這個字型,根據其他網站介紹,這款字體和 Roboto、San Francisco、Akkurat、Asap、Lucida Grande 等字型類似,如果有興趣從 Inter UI 網站可查看相關範例及實際應用方式。

網站名稱:Inter UI
網站鏈結:https://rsms.me/inter/

使用教學

STEP 1

開啟 Inter UI 網站,會有簡單的字型家族介紹和實際呈現效果,Inter UI 字型一共有八種不同樣式:Regular、Italic、Medium、Medium Italic、Bold、Bold Italic、Black 和 Black Italic。

Inter UI

點選上方的「Download」就能免費下載 Inter UI 字型包,解壓縮後會有 OTF、TTF 和網頁字型用的格式。如果你想在網頁中使用它作為字型,可直接取用網站提供的 CSS 檔案,然後將樣式表裡的字型依照說明改為 Inter UI。

Inter UI

STEP 2

想知道每一個字元的實際顯示效果嗎?網站在 Glyphs 列出 Inter UI Regular 完整字型集。

Inter UI

點選字元後可查看詳細資訊,包括 Unicode、寬度、左右間距,還能下載個別 SVG 向量圖。

Inter UI

STEP 3

從 Inter UI 特色介紹可以看到這款字型針對一些比較難以辨識、易閱讀時出錯的字元進行細部調整,例如在大寫時輸入符號會置中、數字間距調整、數字 0 和英文字母 O 的細節微調和距離等等。

Inter UI

STEP 4

在網站中還有一些範例 Samples 示範 Inter UI 實際運用上的效果。

Inter UI

Inter UI

Inter UI

值得一試的三個理由:

  1. 專為使用者介面設計,側重於電腦螢幕易讀性
  2. 針對一些較容易誤判或閱讀錯誤的字元服務進行微調
  3. 提供 OTF、TTF 和 Webfont 格式
分享本文