站長資訊網 
看完上面這張圖你就能明白了
是不是閱讀起來非常的難受？
那就對了！
其實折磨你的問題有以下幾點
1.字體樣式太多，雜亂無章
2.使用的字體不易識別
3.字體和內容的氣氛不匹配
怎么避免這樣的結果發生呢？
一句話：通過常用字體規范可以幫助你做出符合要求的設計
一.字不過三！
很多大神說過色不過三，其實在同一個APP或在同一個設計作品中字體也不要過三種樣式，一般在每個項目設計中使用1-2個字體樣式就夠了，然后通過對字體大小或顏色來強調重點文案。
看到上圖中的幾個界面，都是通過字體的大小來區分出界面內容中的層級關系的。
其中包括了螞蟻花唄的banner里只用了一種字體來區分主標題和副標題的關系。
其實網頁也是一樣，使用一種字體樣式，通過字體大小的對比也能做出高逼格的構圖和設計。
講真！字體用的太多，會顯得你不夠專業！
二 .字與背景的層次要分明
看完上面兩張Banner圖是不是發現了同樣的問題，字體和背景融到一塊去了，在閱讀的時候非常的不方便
這樣的Banner如何才能達到廣而告知呢？
包括做移動界面也是一個道理，選擇下面這樣的一個背景，用戶在光照很強的時候能看清嗎？
所以易讀性和易用性是用戶的根本訴求！
三.字體樣式與氣氛要匹配
看完這個圖
第一個感覺就是看不懂！仔細看才知道是眼部精華油。
文字的風格和整體的設計風格不一致，沒有帶動用戶的購買欲。
我們再來看看下圖
結合文案內容，設計風格采用了比較明快剛勁的設計風格，字體也選擇了比較剛勁有力的造字工坊勁黑體。氣氛匹配，用戶代入感強。
活動banner的氣氛非常重要，選擇合適的字體樣式能加強購買欲和點擊欲。
以風格分類常用的字體有以下幾種類型
1.平穩型字體
在陌陌APP歡迎也中使用到了比較平穩的方正正中黑，整體風格比較直接明了。
方正蘭亭系列是網頁設計中必用的字體，穩重而細膩，還具有時尚科技感。
看看下面這個蘋果的網頁，就造了
用了方正蘭亭超細后的感覺，是不是高端了許多~
當然用在科技產品的官網中更合適不過了。穩重而富有科技感。
2.剛勁有力型
張海山的字體非常的好用，可以試試，清晰明了，年輕有力
華康儷金黑有種大字報的感覺
3.可愛型字體
使用方正經黑設計的內涵banner
是不是很可愛很有深度~~~
漢儀小麥使用在插畫中的感覺，不解釋
(by 白茶)
華康海報體
專題和引導頁面中經常會用到
騰翔金磚體
這也是一個非常不錯的字體
設計師利用了騰翔金磚體的原型將美食的元素融入到了設計中
（注意合法使用字體，字體都是有版權的哦~）
當然我們還可以使用毛筆字生成器
通過自由的書法網站在線生成
在網址中輸入文本，再進行選擇書法字體樣式
通過這種方法我們能很快的找到需要的書法字體
這招非常管用！
推薦大家來兩個毛筆字生成的網站：
http://www.akuziti.com/mb/
http://www.51poca.com/
二.界面中文字使用的規則
1.了解系統字體
iOS系統中用的是蘋方字體系列
為了加強層次關系蘋方系列從細到粗有著不同的樣式
Android的默認字體是Roboto和Noto系列
Roboto有6種字樣
Thin、Light、Regular、Medium、Bold 和 Black
Noto有7種字樣
Thin, Light、DemiLight、Regular、Medium、Bold 和 Black
2.統一字號
一個App，不同位置的字體字號
你能準確地說出來嗎？
如果不能，說明你還不了解規范，沒有去制定規范。
那我們先了解一下常規的一些大小（應用于2倍尺寸中，即iphone5/6）
導航主標題字號：34/36px
蘋果默認標題字號為34px，而有些軟件也會用到36px，更加強頁面位置關系
比如微信導航標題字號36px，導航字體醒目易于對應頁面位置。
在內文展示中字號大小又是多大呢？
正文字號32px-34px
副文是28px-24px
最小字號不低于20px
字在正文字號使用中，閱讀類的APP更注重文本的閱讀便捷性
正文字號34px，會選擇性的選用蘋方粗體
而列表形式、工具化的APP普遍是正文32px
(由于屏幕使用變大正文大小趨勢變成了34px)
副文案28px,時間文字24px
26px的字號還會用于劃分類別的提示文案
因為這樣的文字希望用戶閱讀，但不要搶過主列表信息的引導。
34px的字號還經常運用在頁面的大按鈕中。為了拉開按鈕的層次，同時加強按鈕引導性，選用了稍大號的字體。
注意了！在選用字體大小的時候一定要選擇偶數的字號。因為在開發界面的時候，字號大小換算是要除以二的
那網頁中常用的字號有哪些呢？
網頁字號最小12px
常用微軟14px/16px作為正文
大號字體是18px、20px、26px、30px
（注意使用雙數字號，單數的字體在顯示的時候會有毛邊）
好的設計不應該永遠是“人家的設計”
一定是看得不夠多，琢磨不夠透，練手太少
MICU_王鐸
