編者按：想知道Facebook、Twitter、Google都在使用哪些字體？想知道目前最流行的網(wǎng)頁字體？一個(gè)酷站直接搞定！今天介紹的FontReach不僅可以快速查詢某個(gè)網(wǎng)站用的字體，而且還列出了最熱門的網(wǎng)頁字體排行榜（猜猜世界第一是哪個(gè)），幫你把握字體趨勢！

網(wǎng)頁字體（Web fonts）發(fā)展歷史可以回溯到 CSS2 規(guī)范的 @font-face 屬性，這是一種讓網(wǎng)頁字體有更多變化的技術(shù)，即使計(jì)算機(jī)沒有安裝對應(yīng)的字體檔案，也能透過瀏覽器加載讓系統(tǒng)支持更多顯示字符。網(wǎng)頁字體已被大量使用到現(xiàn)今的網(wǎng)絡(luò)應(yīng)用中，例如你平常經(jīng)常瀏覽的 Google、Facebook、Twitter 等網(wǎng)站也都有運(yùn)用網(wǎng)頁字體。

無論你是網(wǎng)頁設(shè)計(jì)師，或是平常喜歡花時(shí)間研究網(wǎng)站相關(guān)技術(shù)，應(yīng)該也都知道如何在網(wǎng)頁內(nèi)加載網(wǎng)頁字體（例如使用 Google Fonts），但你或許想知道，究竟全世界的網(wǎng)站都選擇使用那一些網(wǎng)頁字體呢？

本文要介紹的 FontReach 網(wǎng)站已經(jīng)幫你把這些數(shù)據(jù)整理好，讓用戶快速查詢某個(gè)字體被用于那一些我們熟悉的網(wǎng)站，只要開啟網(wǎng)頁、輸入要查詢的字體名稱，F(xiàn)ontReach 就會把所有數(shù)據(jù)條列出來。

此外，它還可以顯示最熱門的網(wǎng)頁字體排行榜，讓你知道目前最流行的網(wǎng)頁字體選擇！

Fontreach

網(wǎng)站提供的數(shù)據(jù)以英文字體為主。若你想要在中文網(wǎng)站上套用中文字體，可以試試看 justfont 或文鼎科技 iFontCloud 云端字體服務(wù)。

STEP 1

開啟 FontReach 網(wǎng)站后，于首頁搜尋框輸入要查詢的字體名稱，例如 Helvetica，輸入時(shí)會同時(shí)在下面顯示出可能的字體名稱，以及它目前被多少網(wǎng)站使用。

STEP 2

搜尋 Helvetica Neue 這款很知名的網(wǎng)頁字體，果不其然有超過二十萬個(gè)網(wǎng)站使用，在排行榜里是第三名，其中這份列表會依照網(wǎng)站排名顯示，包括 Facebook、Yahoo、Twitter 和 eBay 等網(wǎng)站都有使用 Helvetica。

附：《經(jīng)典打包！世界上最受歡迎的英文字體Helvetica全套下載》

如果你想深入了解某個(gè)網(wǎng)站使用的所有網(wǎng)頁字體，點(diǎn)選網(wǎng)址后，就會立即顯示相關(guān)結(jié)果，可以看到 Twitter 使用的網(wǎng)頁字體包括：Arial、Helvetica Neue、Sans-serif、Monospace、Georgia、Tahoma 和 Courier New，非常有趣。

STEP 3

以我的經(jīng)驗(yàn)來說，一個(gè)好的網(wǎng)頁字體必須要有幾個(gè)要件，包括：檔案不能太大、有良好的閱讀性以及可以在標(biāo)題或內(nèi)文套用的特定樣式。要如何找到最適切的字體呢？或許可以從字體使用排行榜來找出端倪。

開啟 http://www.fontreach.com/#top 即可看到 FontReach 整理的字體排名。

FontReach 對于開發(fā)者來說確實(shí)是個(gè)很有價(jià)值的參考工具，能讓我們在選擇網(wǎng)頁時(shí)有個(gè)更為客觀的依據(jù)。如果你想知道某個(gè)網(wǎng)站使用的字體，但在 FontReach 卻沒有列出，可使用其他類似的查詢工具：

• Fontface Ninja 一鍵查看網(wǎng)頁使用的字體名稱、大小和行高
• Type Sample 輕松查詢、辨識網(wǎng)頁使用的字體名稱和大小
• Stylify Me 快速獲取網(wǎng)站配色、字體等風(fēng)格信息

值得一試的三個(gè)理由：

1. 快速查詢字體被多少網(wǎng)站使用
2. 找出某個(gè)網(wǎng)站使用的字體列表
3. 網(wǎng)頁字體使用排行榜

【優(yōu)設(shè)近期超實(shí)用神器合集】

在線創(chuàng)建超贊圖表的酷站！
《缺少靈感？自動(dòng)生成上千款熱門配色色板的COOLORS》

幫你補(bǔ)充配色靈感！
《缺少靈感？自動(dòng)生成上千款熱門配色色板的COOLORS》

一次搜索21個(gè)圖庫的搜圖殺器！
《搜圖殺器！一次查找21個(gè)免費(fèi)可商用圖庫網(wǎng)站的STOCK UP》

原文地址：free.com.tw

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：2650232288@qq.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國內(nèi)人氣最高的網(wǎng)頁設(shè)計(jì)師學(xué)習(xí)平臺，專注分享網(wǎng)頁設(shè)計(jì)、無線端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書：史上最全的設(shè)計(jì)師圖書導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計(jì)微博：擁有粉絲量102萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com