四大基本原則

我們可以通過減少視線移動(dòng)、增強(qiáng)視覺刺激來進(jìn)行元素設(shè)計(jì)。網(wǎng)頁設(shè)計(jì)主要遵循以下四個(gè)基本原則：“親密性”、“秩序性”、“一致性”、“差異性”。

1. 親密性

為了減少用戶視線移動(dòng)，相關(guān)的元素（操作相關(guān)、功能邏輯相關(guān)、響應(yīng)邏輯相關(guān)）應(yīng)當(dāng)放置在一起組成視覺單元（物理位置相近）；邏輯聯(lián)系較弱，彼此無關(guān)的元素則不應(yīng)該靠近，使得整個(gè)頁面的邏輯層次清晰。

元素相關(guān)性強(qiáng)弱和物理位置遠(yuǎn)近的適當(dāng)設(shè)計(jì)，便于用戶理解元素邏輯內(nèi)容，減少混亂干擾。

2. 對(duì)齊

元素的擺放另一個(gè)重要原則就是對(duì)齊。對(duì)齊，不是說橫平豎直，九宮格式的簡單排列，而是在保證親密性原則下，打亂無關(guān)元素的物理位置位置，保持各部分對(duì)齊，即所謂“亂中有序”。

隨意擺放的元素在視覺上會(huì)造成混亂，同時(shí)在邏輯上也不易理解，因此在布局設(shè)計(jì)時(shí)，應(yīng)當(dāng)保證元素對(duì)齊，建立視覺聯(lián)系。一般來說，不建議采用居中對(duì)齊的方式。

Apple 開發(fā)者網(wǎng)站，頂部導(dǎo)航條、產(chǎn)品分類、標(biāo)題、介紹內(nèi)容等在邏輯聯(lián)系上親密，根據(jù)親密性原則物理位置相近，為了避免視覺混亂，將元素對(duì)齊，使得元素更具有秩序性。

3. 重復(fù)

對(duì)于類似的設(shè)計(jì)元素，要保持復(fù)用設(shè)計(jì)，保持整體設(shè)計(jì)的風(fēng)格一致。

書籍的文章標(biāo)題使用一樣的字體、大小，使得整本書脈絡(luò)清晰。

重復(fù)元素包含很多，符號(hào)、顏色、線條、字體甚至字間距等，組織重復(fù)信息利于幫助用戶理清頁面的層次邏輯，將設(shè)計(jì)中一致的元素統(tǒng)一起來，在外觀上即可作為整體元素進(jìn)行展示。

如下圖中一級(jí)導(dǎo)航與二級(jí)導(dǎo)航的重復(fù)樣式，視覺上相同，便于用戶理解不同頁面間的邏輯設(shè)置。

出現(xiàn)重復(fù)的元素，即提示用戶上一段的結(jié)束和新一段的開始，免去用戶判斷過程。但要注意，沒有邏輯相關(guān)的元素需要避免相同的設(shè)計(jì)，人的直觀認(rèn)知中，外觀類似的元素會(huì)被自覺歸為一類，如果沒有邏輯相關(guān)的元素設(shè)計(jì)雷同，會(huì)讓用戶存在認(rèn)知錯(cuò)誤，增加其判斷過程。

這就引出了最后一個(gè)原則：對(duì)比。

4. 對(duì)比

上面說過，含義不同，外觀雷同的元素設(shè)計(jì)會(huì)使用戶多加判斷，這也是用戶疲勞的來源之一。

元素的對(duì)比設(shè)計(jì)，可以是顏色也可以是粗細(xì)，有鮮明的對(duì)比可以在視覺上形成層次效果。

當(dāng)前文章：網(wǎng)頁設(shè)計(jì)的四大基本原則
文章地址：http://jinyejixie.com/news/129035.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供面包屑導(dǎo)航、移動(dòng)網(wǎng)站建設(shè)、建站公司、小程序開發(fā)、自適應(yīng)網(wǎng)站、網(wǎng)站設(shè)計(jì)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)