網(wǎng)頁設(shè)計一直都是設(shè)計行業(yè)中比較熱門的關(guān)注點，也是網(wǎng)站設(shè)計中的關(guān)鍵內(nèi)容之一。目前網(wǎng)頁設(shè)計的風(fēng)格有很多，大家對全屏網(wǎng)頁設(shè)計了解多少。今天就讓faceui為大家介紹全屏網(wǎng)頁設(shè)計規(guī)范有哪些，常見的網(wǎng)頁設(shè)計風(fēng)格。

　　全屏網(wǎng)頁設(shè)計規(guī)范有哪些

　　1、網(wǎng)頁尺寸

　　制作網(wǎng)頁時，我們選用的分辨率是72像素/英寸，使用的畫布尺寸1920px*1080px。但是并不代表我們可以在整個畫布上作圖。網(wǎng)頁的布局主要有兩種，左右型布局和居中型布局。布局的不一致，使得可設(shè)計的空間也不相同。

　　左右布局：靈活性強， UI的限制??；左邊通欄為導(dǎo)航欄，寬度沒有具體的限制，可根據(jù)實際情況調(diào)整；右側(cè)為內(nèi)容版塊范圍，是網(wǎng)站內(nèi)容的展示區(qū)域。

　　居中布局：中間的藍色部分為有效的顯示局域，用于網(wǎng)站內(nèi)容的展示；換句話說，兩邊均為留白，沒有實際用途，只是為了適配而存在；一般網(wǎng)站內(nèi)容顯示的區(qū)域為996px；國內(nèi)網(wǎng)站大部分還是以1000個像素為界限，因超過1000像素適合在大屏幕上瀏覽，小屏幕會顯得擁擠。所以網(wǎng)站寬度在1000像素以內(nèi)可以保證大部分用戶舒適的瀏覽網(wǎng)頁。

　　2、網(wǎng)頁字體

　　字體設(shè)計的總原則是：可辨識性和易讀性。網(wǎng)頁的文字設(shè)計是系統(tǒng)默認(rèn)的字體：宋體、微軟黑體、蘋果系統(tǒng)黑體，英文則建議使用arial無襯線字體。

　　常用的字號大小有以下幾種：

　　12px是應(yīng)用于網(wǎng)頁的最小字體，適用于非突出性的日期，版權(quán)等注釋性內(nèi)容。

　　14px 則適用于非突出性的普通正文內(nèi)容。

　　16px、18px或者20px 適用于突出性的標(biāo)題內(nèi)容。

　　圖片來源于網(wǎng)絡(luò)

　　3、字體間距

　　相鄰兩個文字的間距，其實不需要太過介意，除了特殊的需求之外，都可以使用默認(rèn)數(shù)值的間距。

　　行間距，推薦以 字體大小的1.5—2倍 作為參考；段間距，推薦以 字體大小的2—2.5倍 作為參考。即，當(dāng)選用14px 的字體時，行間距：21—28px；段間距：28px—35px。

　　4、字體顏色

　　主文字顏色，建議使用 公司品牌的VI顏色，可提高公司網(wǎng)站與公司VI之間的關(guān)聯(lián)，增加可辨識性和記憶性。

　　正文字體顏色，保險起見，選用易讀性的深灰色，建議選用 #333333到#666666 之間的顏色。輔助性的，注釋類的文字，則可以選用#999999之類的比較淺的顏色。

　　5、首屏內(nèi)容

　　做網(wǎng)頁設(shè)計時，你還要特別注意網(wǎng)頁的首屏內(nèi)容，在構(gòu)圖和內(nèi)容呈現(xiàn)上，首屏模塊的設(shè)計至關(guān)重要。除去任務(wù)欄，瀏覽器菜單欄以及狀態(tài)欄的高度，剩下的是首屏的高度。Window XP的首屏高度平均值是580px，Window 7的首屏高度平均值是710px。

　　另外，是關(guān)于圖片尺寸的問題。需要全屏顯示的圖片，寬度尺寸嚴(yán)格設(shè)計為1920px。

　　6、響應(yīng)式布局設(shè)計

　　響應(yīng)式設(shè)計指的是不同設(shè)備、屏幕、分辨率、操作方式（鼠標(biāo)、鍵盤、觸摸），保證信息在不同環(huán)境下表現(xiàn)一致，保證可交互可操作。由于頁面的寬度發(fā)生了變化，進而信息展現(xiàn)也改變了就是響應(yīng)式設(shè)計。直到最后在手機屏幕上的顯示圖片信息變成了一列。

　　圖片來源于網(wǎng)絡(luò)

　　常見的網(wǎng)頁設(shè)計風(fēng)格

　　1、響應(yīng)式網(wǎng)頁設(shè)計

　　響應(yīng)式網(wǎng)頁設(shè)計是目前大家所關(guān)注的一種設(shè)計，在網(wǎng)站設(shè)計風(fēng)格中也是很有口碑的?？梢约袆?chuàng)建頁面的圖片排版大小，可以智能地根據(jù)用戶行為以及使用的設(shè)備環(huán)境進行相對應(yīng)的布局，能夠適應(yīng)不同的終端，夠滿足現(xiàn)在不同設(shè)備的顯示模式。響應(yīng)式網(wǎng)頁設(shè)計是未來很長一段時間的設(shè)計趨勢，而目前不同的電子設(shè)備種類也正好順應(yīng)了這種趨勢。

　　2、全屏網(wǎng)頁設(shè)計

　　如今全屏網(wǎng)頁設(shè)計是近幾年的潮流，一般背景是采用漂亮地圖、簡短新穎的文字來進行合理、整齊地頁面布局和排版，很注重細節(jié)方面的設(shè)計，整體純凈、留白、簡單明了且讓人感覺干凈舒服，但全屏網(wǎng)頁設(shè)計所承載的內(nèi)容較少，適合攝影或是一些個人網(wǎng)站等。

　　3、扁平化網(wǎng)頁設(shè)計

　　扁平化網(wǎng)頁設(shè)計是一種新的設(shè)計思維，去掉多余的透視、紋理、漸變以及能做出3D效果的元素，也就是去除網(wǎng)頁冗余、厚重和繁雜的裝飾效果，讓網(wǎng)頁變得簡單，凸顯網(wǎng)頁核心“信息”，同時在設(shè)計元素上，則強調(diào)了抽象、極簡和符號化。同時扁平化的設(shè)計，在移動系統(tǒng)上不僅界面美觀、簡潔，而且還能達到降低功耗、延長待機時間和提高運算速度的效果。

　　4、視差滾動網(wǎng)頁設(shè)計

　　視差滾動是指讓多層背景以不同的速度移動，形成立體的運動效果，帶來非常出色的視覺體驗。而視差滾動網(wǎng)頁設(shè)計是網(wǎng)頁設(shè)計的熱點趨勢，在整個網(wǎng)站設(shè)計風(fēng)格中占有很大優(yōu)勢，越來越多的網(wǎng)站應(yīng)用了這項技術(shù)，給人們帶來獨特的視覺享受，且通過鼠標(biāo)來控制網(wǎng)頁，讓網(wǎng)站有一種控制感，這是一種響應(yīng)式的交互體驗，也是視差滾動網(wǎng)頁設(shè)計的趣味性所在。

　　以上就是faceui為大家介紹的關(guān)于全屏網(wǎng)頁設(shè)計的相關(guān)內(nèi)容。作為一種常見的網(wǎng)頁設(shè)計風(fēng)格，全屏網(wǎng)頁設(shè)計也是當(dāng)下很流行的一種網(wǎng)頁設(shè)計，要設(shè)計這類網(wǎng)頁，了解全屏網(wǎng)頁設(shè)計規(guī)范很有必要。