ui設(shè)計(jì)是現(xiàn)在各行業(yè)都需要使用的。網(wǎng)站ui設(shè)計(jì)跟其他的ui設(shè)計(jì)一樣,都有一定的標(biāo)準(zhǔn)和規(guī)范。關(guān)于網(wǎng)站ui設(shè)計(jì)尺寸規(guī)范以及其他的ui設(shè)計(jì)要求,今天就讓小編為大家好好介紹一下。
網(wǎng)站ui設(shè)計(jì)尺寸規(guī)范及其他要求
1、網(wǎng)頁(yè)規(guī)范:
網(wǎng)頁(yè)寬度為1920 高度不限,有效可視區(qū):950px~1200px寬度,具體尺寸根據(jù)項(xiàng)目,客戶(hù)要求以及用戶(hù)群決定。
首屏高約為700-750PX 主體內(nèi)容區(qū)域1200PX。
文檔建立:文件寬度為1920PX 高度不限,RGB顏色模式, 分辨率72。
2、字體規(guī)范:
中文常用字體:宋體-字體樣式(無(wú))、微軟雅黑-字體樣式(Windows LCD)、蘋(píng)方(MAC)。
英文常用字體:Times NewRoman、Arial、sans。
(1)中文字常用字號(hào):
導(dǎo)航文字大?。?4px、16px、18px、20px。
正文內(nèi)容:12px、14px。
標(biāo)題:22px、24px、26px、28px、30px。
輔助信息:12px、14px。

網(wǎng)站ui設(shè)計(jì)尺寸規(guī)范(圖片來(lái)自網(wǎng)絡(luò))
(2)英文字常用字號(hào):
標(biāo)題和內(nèi)容文字10-16px;中英文結(jié)合最小12px;全英文網(wǎng)站最小10px(比如底部信息)。
3、網(wǎng)頁(yè)頁(yè)面等級(jí)
?。?)首頁(yè):進(jìn)入網(wǎng)頁(yè)中看到的第一個(gè)頁(yè)面(LOGO、公司名稱(chēng)、導(dǎo)航、banner、新聞、相關(guān)信息、底部信息、banner一般是5個(gè)。注意:網(wǎng)站的首頁(yè)只能有一個(gè)。
(2)二級(jí)頁(yè)面:從首頁(yè)點(diǎn)擊進(jìn)入之后的頁(yè)面叫做二級(jí)頁(yè)面。
?。?)三級(jí)頁(yè)面:從二級(jí)頁(yè)面點(diǎn)擊進(jìn)入的頁(yè)面。
4、網(wǎng)頁(yè)常見(jiàn)板塊劃分
?。?)頭部區(qū)域-----top或header,Logo、主導(dǎo)航、搜索、注冊(cè)、登錄、版本等信息。
(2)主視覺(jué)區(qū)----banner,展示公司品牌形象、新品宣傳、主題活動(dòng)等輪播大圖。
?。?)主要內(nèi)容區(qū)---main,新聞動(dòng)態(tài)、產(chǎn)品與服務(wù)、公司介紹等。
?。?)底部信息區(qū)---footer,網(wǎng)站地圖、聯(lián)系我們、版權(quán)信息、ICP備案號(hào)等信息。

網(wǎng)站ui設(shè)計(jì)尺寸規(guī)范(圖片來(lái)自網(wǎng)絡(luò))
5、網(wǎng)頁(yè)的顏色
?。?)來(lái)自于LOGO的顏色。
?。?)來(lái)自于環(huán)境的顏色。
?。?)來(lái)自于產(chǎn)品的顏色。
?。?)公式:隨意選擇四個(gè)顏色,調(diào)整四個(gè)顏色的明度和直線色相。
?。?)選擇一個(gè)符合你產(chǎn)品的任意顏色圖片,然后在這個(gè)圖片中提出來(lái)四種顏色,來(lái)作為網(wǎng)頁(yè)的主色調(diào) (服裝,飾品、化妝品類(lèi)居多)。
網(wǎng)頁(yè)設(shè)計(jì)需注意的問(wèn)題有哪些
1、高清大圖,圖片不能有水印。有圖片的位置最好配有文字說(shuō)明不要大篇幅的圖片擺放。在網(wǎng)頁(yè)設(shè)計(jì)中不要有重復(fù)圖片,每個(gè)圖片必須有一個(gè)部分是完整的;圖片素材不要直接用設(shè)計(jì)好的圖片;在板塊中不要有純圖片的設(shè)計(jì),一定有文字解釋?zhuān)墟溄?;一個(gè)版塊內(nèi)的圖片要選擇同一種類(lèi)型;圖片距離文字不要過(guò)近。
2、文字排版,標(biāo)點(diǎn)符號(hào)不能在一行的第一個(gè),不要一個(gè)文字為獨(dú)立的一行;如果色塊中有文字,文字必須在色塊的中心,不能上或者下留有太多空白空間。
3、如果箭頭朝下必須有下拉菜單,如果下拉菜單是合起的狀態(tài),箭頭朝右。
4、banner不能是現(xiàn)成的圖片,需要進(jìn)行合成和設(shè)計(jì),也需要有文字的極差關(guān)系和對(duì)比。
5、產(chǎn)品分類(lèi)中必須有不同的產(chǎn)品體現(xiàn);在每一個(gè)板塊中都必須體現(xiàn)明顯的連接。
以上就是小編為大家介紹的關(guān)于網(wǎng)站ui設(shè)計(jì)尺寸規(guī)范的相關(guān)內(nèi)容。ui設(shè)計(jì)要有一定的規(guī)范和標(biāo)準(zhǔn),在設(shè)計(jì)的時(shí)候按照這些規(guī)范,設(shè)計(jì)出來(lái)的ui網(wǎng)站才能更容易被大眾所認(rèn)可和接受。


在微信中搜索faceui