網(wǎng)頁設(shè)計(jì)的四大基本原則

2021-09-30    分類: 網(wǎng)站建設(shè)

四大基本原則

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

1. 親密性

為了減少用戶視線移動,相關(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. 對齊

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

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

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

3. 重復(fù)

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

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

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

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

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

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

4. 對比

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

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

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

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

廣告

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

h5響應(yīng)式網(wǎng)站建設(shè)