長(zhǎng)沙學(xué)web界面的設(shè)計(jì)原則有哪些

web界面的設(shè)計(jì)原則有哪些

web界面的設(shè)計(jì)原則有哪些？web界面設(shè)計(jì)原則主要有這些：一致性原則;主次性原則;扁平化原則;及時(shí)反饋原則。如果想具體了解web界面的設(shè)計(jì)原則有哪些，那不妨接著往下看吧!

1、一致性原則

對(duì)于相同或相近的業(yè)務(wù)功能，操作方式保持一致，培養(yǎng)用戶(hù)的操作習(xí)慣。比如查看聯(lián)系人功能，如果有的頁(yè)面是點(diǎn)擊彈出窗口查看，有的頁(yè)面是點(diǎn)擊從右側(cè)展出內(nèi)容，就會(huì)讓用戶(hù)產(chǎn)生困擾，降低用戶(hù)體驗(yàn)。所以要不就統(tǒng)一的彈出窗口查看詳情，要不就統(tǒng)一的從右側(cè)展開(kāi)詳情。

此外，對(duì)于組件顏色、組件尺寸、組件擺放位置也盡量保持一致。比如彈出窗口，類(lèi)似的業(yè)務(wù)不能有的窗口大，有的窗口小;一個(gè)查找聯(lián)系人的輸入框，不能有的頁(yè)面放在右側(cè)，有的卻放在左側(cè);確認(rèn)按鈕，不能有的頁(yè)面是藍(lán)色，有的頁(yè)面是灰色。

2、主次性原則

避免并列過(guò)多操作讓用戶(hù)選擇，在不得不并列多個(gè)操作時(shí)，需區(qū)分操作主次，減輕用戶(hù)的選擇難度。

3、扁平化原則

這里說(shuō)的扁平化除了指界面效果的扁平化外，還包含了操作的扁平化這一層意思。即：

（1）降低頁(yè)面層級(jí)，能夠一個(gè)界面解決的不要彈出窗口，能夠彈出一層窗口解決不要彈出兩層窗口;

（2）降低操作復(fù)雜度，以清晰明了的方式讓用戶(hù)完成操作。比如對(duì)于復(fù)雜的表單填寫(xiě)進(jìn)行分步處理，每一步給出指引;

（3）降低鼠標(biāo)點(diǎn)擊次數(shù)。比如一個(gè)新增用戶(hù)操作，如果是每增加一個(gè)用戶(hù)都要用戶(hù)點(diǎn)擊彈出一次窗口，完成后點(diǎn)擊“確定”窗口關(guān)閉，添加第二個(gè)人再?gòu)棾龃翱�。不如加入一個(gè)“確定并繼續(xù)添加”按鈕，這樣窗口并不關(guān)閉，讓用戶(hù)每次添加用戶(hù)都可以少點(diǎn)兩次鼠標(biāo)，降低用戶(hù)使用系統(tǒng)的疲勞感;

4、及時(shí)反饋原則

任何一個(gè)產(chǎn)品，即使用戶(hù)界面做的再好，也離不開(kāi)用戶(hù)引導(dǎo)和信息提示。操作過(guò)程中盡可能將狀態(tài)的反饋給用戶(hù)，即時(shí)的響應(yīng)會(huì)給用戶(hù)增加信賴(lài)感。包括：

（1）加載反饋。比如當(dāng)用戶(hù)點(diǎn)擊一個(gè)按鈕時(shí)，其實(shí)后臺(tái)已經(jīng)開(kāi)始處理業(yè)務(wù)，但如果界面無(wú)任何反應(yīng)會(huì)讓用戶(hù)覺(jué)得操作失敗，所以當(dāng)一個(gè)操作需要一定時(shí)間完成時(shí)，就需要即時(shí)告知進(jìn)度，保持與用戶(hù)的溝通;可以給一個(gè)進(jìn)度條或者一個(gè)信息提示，甚至是一個(gè)轉(zhuǎn)圈的小圖標(biāo)表示正在進(jìn)行中也可以;若加載時(shí)間較長(zhǎng)，應(yīng)提供取消操作。

（2）錄入反饋。比如操作過(guò)程中可通過(guò)校驗(yàn)規(guī)則，讓用戶(hù)及時(shí)發(fā)現(xiàn)并糾正錯(cuò)誤;使用輸入框組件的自動(dòng)完成功能，用戶(hù)輸入時(shí)，下拉列表會(huì)隨著輸入的關(guān)鍵詞顯示匹配項(xiàng);實(shí)時(shí)搜索，隨著用戶(hù)輸入，實(shí)時(shí)顯示搜索結(jié)果等。

（03）結(jié)果反饋。操作結(jié)束后，給出提示告知用戶(hù)。盡量使用toast這類(lèi)提示，這是不打斷用戶(hù)操作的輕量級(jí)提示方式。必要時(shí)也可使用彈窗反饋，彈窗是很強(qiáng)的反饋機(jī)制，只有在傳遞非常重要，且可操作的信息時(shí)才需要使用它。