UI設計規范，對于剛入行的新人，可能覺得是一件很高大上又很讓人頭疼的事情。本文從新人的角度出發，總結一些設計規范要點，算是一次溫故總結的分享。
作為一名UI設計師，所以必須站在設計師的角度去把自己所學所了解的東西告訴大家。可能公司不同，大家設計習慣不盡相同，但是終究還是能有些幫助。依舊聲明：這里寫的只是我個人的使用習慣，只是一種工作方法，大家在具體工作中，一定要靈活運用。另外，技術的更新是非常快的，我寫的這些可能某些東西和你們的工程師搭檔所用的方法不一樣了，所以，還是要靈活運用。
下面尚略
上海網站設計公司首先帶領大家先了解一下本文大致分為哪幾個模塊：網頁設計尺寸、常用字體、字體間距舒適范圍、字體顏色設計技巧、其他注意事項。
一、網頁設計尺寸
制作網頁時我們選用的分辨率是72像素/英寸，使用的畫布尺寸1920px*1080px。但并不代表我們可以在整個畫布上作圖。
網頁的布局主要有兩種：左右型布局和居中型布局。布局的不一致，使可設計的空間也不相同。
左右結構型
1、左右布局，靈活性強，UI的限制小；
2、左邊通欄為導航欄，寬度沒有具體的限時，可以根據實際情況進行調整；
3、右側為內容板塊范圍，是網站內容展示區域。
居中型
4、居中布局，中間的黃色部分為有效的顯示區域，用于網站內容的展示。
5、換句話說，兩邊均為留白，沒有實際用途，只是為了適配而存在。
6、內容限時區域在好控制在1000px-1200px。
二、常用字體
現在網頁的布局我們已經了解了，那么接下來就是網頁中常用到的字體。
字體設計的總原則是：可辨識性和易讀性。
中文建議使用微軟雅黑字體，英文則建議使用arial 字體。常用的字體大小號有以下幾種：
1、12px是用于網頁的最小字體，適用于突出性的日期，版權等注釋性內容。
2、14px則適用于非突出性的普通正文內容。
3、16px或18px適用于突出性的標題內容。
4、網站的字體大小并沒有硬性規定具體的字號，根據實際情況可以酌情考慮，但是要有限適用偶數字號。
5、字體規格也不需要太多，最好適用三種混搭。如果需要更多層次的區別，可以改變字體顏色或加粗來體現。
三、字體間距舒適范圍
相鄰兩個文字的間距，其實不需要太過介意，除了特殊的需求之外，都可以使用默認數值的間距。
1、行間距，推薦以字體大小的1.5-2倍作為參考；
2、段間距，推薦以字體大小的2-2.5倍作為參考。
3、當選用14px字體時，行間距：21-28px; 段間距：8px-35px
四 、字體顏色設計技巧
1、主文字的顏色，建議使用公司品牌的VI顏色，可提高公司網站與公司VI之間的關聯，增加可辨識性和記憶性。
2、正文字體顏色，保險起見，選用易讀性的深灰色，建議選用#333到#666之前的顏色。
3、輔助性的，注釋類的文字，則可以選用#999999之類的比較淺的顏色。
如果，你對顏色駕馭能力比較強，你也可以選擇偏公司VI顏色的深色，作為正文字體顏色或者輔助性文字的顏色。
例如公司的品牌是藍色，那么正文就可以選用偏藍色的深色。這樣處理之后，文字就有了環境色，網站整體將更加和諧。
深灰色 偏藍色
五、其他需要注意的事項
做網頁設計時，你還要特別注意網頁的首屏內容，在構圖和內容呈現上，首屏模塊的設計至關重要。
1、除去任務欄，瀏覽器菜單欄以及狀態欄的高度，剩下的是首屏高度。
2、Window XP 的首屏高度平均值為580px, window 7 的首屏高度平均值是710px。
3、綜合考慮到 Window XP 已經退出市場，在實際操作時，我們以710px作為依據。
如下圖，黃色區域是我們設計時要著重考慮的首屏范圍
另外，是關于圖片尺寸問題。需要全屏顯示的圖片，寬度尺寸嚴格設計為1920px。但是值得注意的是，圖片內容的有效范圍不能超過網頁內容的有效范圍，控制在1200px以內，以免遇到小屏設備時顯示不全，而造成信息遺漏。
說到這里，網站設計規范部分的內容就算是講完了，當然上面的所有規范也只是規范，不要因為這些規范去限制自己的想法，規范是用來打破的，設計最重要的還是設計得美觀，設計的時候具體要給多大的數值，取決于設計師，規范是用來參考的。
Ps:如果想做一個好的UI設計師，一定要從規范入手。很多都是細節的東西，在于積累。