Google 推出 Roboto Serif 免費襯線字型,讓閱讀變得更舒適

Google 推出 Roboto Serif 免費襯線字型,讓閱讀變得更舒適

Roboto 是 Google 在 2011 年為 Android 4.0 開發的無襯線字體(Sans-Serif)家族,2014 年為新的 Android 5.0 重新設計,後來也成為 Google 旗下服務 Google Play、YouTube、Google 地圖和 Google 圖片搜尋的預設字型。Roboto 字型使用 Apache 授權條款釋出,整個字型家族包含六種字重粗細:Thin、Light、Regular、Medium、Bold、Black 和相對應的斜體,任何人都可以從 Google Fonts 網站免費下載。

Captionn 為免費圖庫相片加入文字,自製高品質社群圖片素材

Captionn 為免費圖庫相片加入文字,自製高品質社群圖片素材

如果你喜歡在 Instagram 更新動態,會知道它不像是 Facebook 或 Twitter 等社群網站可單獨發布文字內容,必須加入至少一張相片或影片,因此平常就得多收集一些素材。當然也有人會自己製作圖片,對於經營社群來說是很有用的方法,尤其是會被轉貼分享就能在無形中獲得更多關注,配上好的圖片對整篇貼文也有加分效果。

Fontworks 和 Google Fonts 合作釋出八款開放原始碼免費字型下載

Fontworks 八種開放原始碼免費字型

Fontworks Inc.(フォントワークス株式会社)是一家成立於 1993 年的日本字體公司,旗下有知名的筑紫系列、UD 字體系列和 Klee(クレー)字體,經常出現在廣告和影集的標題或字幕設計,看起來很有氣質,筑紫系列和 Klee 也被內建於 Mac 作業系統。如果你想尋找好看的免費字型,日文字型對於漢字有一定程度的覆蓋,也有兼顧到英數字和符號,運用在中文上也是個不錯的選擇(取決於字型收錄漢字量多寡)。

Google Fonts 推出 Material Icons 免費圖示字型,收錄兩千個圖案五種樣式

Google Fonts 推出 Material Icons 免費圖示字型,收錄兩千個圖案五種樣式

五年前 Google I/O 大會 Google 釋出數百個 Material Icons 免費圖示,這些圖案不僅會應用到自家產品開發,也將它開放原始碼放到 GitHub 網站上讓使用者免費下載使用,可自由使用於個人或商業用途。時至今日已累積超過 2000 多種不同圖案,並有五種樣式可供選擇,這些圖案對於在傳達一些概念或想法上尤其重要,特別是在數位環境使用者介面更是無所不在。

Snapfont 在網頁即時套用測試 Google Fonts 和本機字型顯示效果(Chrome 擴充功能)

Snapfont 在網頁即時套用測試 Google Fonts 和本機字型顯示效果(Chrome 擴充功能)

對中文網頁來說,CSS 字型設定一直是個麻煩的問題,想直接載入字型檔案容量太大,拖慢網頁速度、耗費過多流量,通常會使用網頁字型解決,像是 Google FontsAdobe Fonts(以前叫作 Typekit)就有提供思源黑體思源宋體等中文網頁字型,只要加入一段 JavaScript 程式碼並調整一下 CSS 樣式表就能使用,讓網頁的中文部分更易於閱讀,設計看起來也更有質感。

思源黑體 Noto Sans TC 繁體中文網頁字型正式上架 Google Fonts

思源黑體 Noto Sans TC 繁體中文網頁字型正式上架 Google Fonts

我在 WordCamp Taipei 活動上分享自己的網站經營心得,其中提到我對網頁的版面設計及排版相當重視,內容寫得好不好其次,更重要的是讓進入網站的訪客會想看看你究竟寫些什麼,就像美食需要擺盤陪襯,美酒需要酒瓶包裝,即使你不是那麼表面,還是不得不承認字型是一個網站需要下點功夫用心研究的元素。

Type Hero 在瀏覽器即時測試 Google Fonts 效果,可切換字型和背景顏色

Type Hero 在瀏覽器即時測試 Google Fonts 效果,可切換字型和背景顏色

Google Fonts 可能是目前收錄最多免費英文字型的網站,去年大改版後,原本動線不佳和瀏覽不便等情形已經獲得改善,走向更簡約的設計風格,整體瀏覽感覺是很棒的!假如你不喜歡它的字型搜尋或測試功能,也有開發者自行開發第三方應用,例如 FontCDN 更好用的網頁字型搜尋工具,能直接在網頁快速套用 Google 字型的 Font Swap 外掛程式或是 Better Font Finder 更直覺的字型檢視器,都是這網站之外值得一試的免費服務。

Better Font Finder 更直覺 Google Fonts 檢視器,可視化介面比較不同字型

Better Font Finder 更直覺 Google Fonts 檢視器,可視化介面比較不同字型

說到免費字型可能很多人會立刻想到 Google Fonts,早先經常被詬病介面很難用,後來新設計確實讓瀏覽和搜尋字型方便不少,其實也有一些開發者設計出更好用的 Google Fonts 搜尋工具,例如 FontCDN 或直接在瀏覽器中快速更換、預覽字型的 Font Swap,對於測試字型顯示效果很有幫助。此外,透過 FontReach 收錄百萬網站網頁字型使用情形還能得知當今最熱門的字型排名。

Font Swap 在任何網頁快速更換字體,從 Google Fonts 選擇免費字型一鍵套用(Chrome 擴充功能)

Font Swap

有時候在瀏覽某些網站時會覺得網站使用的字型很醜、很不好閱讀,除了聯絡網站管理者調整,或使用類似 Mercury Reader 工具來開啟閱讀模式,還有其他更好的解決方法嗎?就我所知有一些瀏覽器外掛可快速更改網站字型,不過對一般使用者來說還是稍嫌困難,若有類似需求,本文要介紹一款非常好用的外掛「Font Swap」,可以快速將網站的標題、內文套用成 Google Fonts 裡任何字體。

Overpass Font 免費道路標誌英文字型下載,Red Hat 贊助開放原始碼

Overpass Font 免費道路標誌英文字型,Red Hat 贊助開放原始碼下載

一般使用於道路標誌上的字體設計講求易讀性,或者可以這麼說,要如何在一定車速情況下不用花太多時間就能一眼辨識標示,成為該字型的設計初衷及最大挑戰。在開始介紹本文的 Overpass Font 前我查了關於 Highway Gothic 資料,因為 Overpass 網站提到這個字型的設計靈感是來自它,也就是著名的「聯邦高速公路字體」,美國、加拿大、土耳其、澳大利亞、荷蘭、中國大陸及台灣皆用於道路標誌的標準字體,不過在一些地方已經逐漸被 Clearview 取代。