# 字體 ### PC端 1. 字體的要求也是蠻多的，都是數據，**一般去設計的時候標題的大小設置在偶數，20px、16px或者14px**，**注意不要設置成15px，盡量避免出現一些單數的值。** 2. 正文的大小也是**用戶最小能接受的字體大小：12px**，這個就沒必要設計得那么大。**英文的最小碼可以設置到9px**（或者根據情況而定）這個大小的話也已經能看清楚。 3. 還有一個是使用什么樣的字體，因為這個網站設計出來之后是要上線給別人瀏覽的，所以為了避免一些字體不能顯示出來，所以采用的字體會要求采用系統自帶的，像**中文的有微軟雅黑、黑體、宋體這些，英文的有Tahoma、Arial、Verdana**。這些也是我們應該考慮的問題。有些圖片里面的字體可以跟著設計的風格走，**還有些標題可以考慮好看一些的字體，因為前端可以采取切圖模式。** ### 手機端 **標題字號：40-42px，用偏小的40px字號，會顯得精致些。在內文展示中字號大小：大的正文字號32px，副文是26px，小字18-20px**。在內文的使用中，根據不同類型的App會有所區別。 1. 像新聞類的APP或文字閱讀類的APP更注重文本的閱讀便捷性，正文字號36px，會選擇性的加粗。 2. 而列表形式、工具化的APP普遍是正文32px，不加粗。副文案26px,小字18-20px。 3. 26px的字號還會用于劃分類別的提示文案，因為這樣的文字希望用戶閱讀，但不要搶過主列表信息的引導。 4. 36px的字號還經常運用在頁面的大按鈕中。為了拉開按鈕的層次，同時加強按鈕引導性，選用了稍大號的字體，見下圖中的退出按鈕。 5. 在選用字體大小的時候一定要選擇偶數的字號，因為在開發界面的時候，字號大小換算是要除以二的。常用字號的大小基本就這幾個，根據版式設計需要也會采用異樣大小的字號來特殊處理。這種更高的是要求設計師的全局把控能力。 ### 網頁柵格 響應式 （Responsive Design） 先解釋什么是網頁柵格： 網頁柵格就是以規則的網格陣列來指導和規范網頁中的版面布局以及信息分布。簡單的理解就是可以通過這些網頁柵格去區分內容，將內容歸類。它的計算是比較復雜的，我們這里大概的了解一下就行了。  上圖中以980px為例子，將柵格分了兩欄和三欄的時候他們之間的間距為10px。如果分成四欄，那又會有所不一樣。  這是四欄的情況，而且也分成了兩類，一類是二級頁面，一類是三級頁面，寬度分別為40px和30px。