/// 01 ///

網(wǎng)格使用

簡(jiǎn)單的確保您網(wǎng)頁(yè)是否平衡的方法是使用網(wǎng)格系統(tǒng)。曾經(jīng)在紙上的網(wǎng)格近幾年也都轉(zhuǎn)變成了數(shù)字介質(zhì)的網(wǎng)格概念，以便應(yīng)用。

通過(guò)網(wǎng)格來(lái)確定頁(yè)面上不同元素的位置，能使你的網(wǎng)頁(yè)之間連接起來(lái)。這可以幫助你提高頁(yè)面布局質(zhì)量，從而讓用戶(hù)看到一個(gè)清晰的結(jié)構(gòu)，這很重要，因?yàn)楫?dāng)你所有頁(yè)面的元素都相互連通，用戶(hù)會(huì)覺(jué)得整體效果更舒適，讓他們更易查看頁(yè)面內(nèi)容。

/// 02 ///

選擇單一焦點(diǎn)

其中有效的方式之一是用一顆平常心來(lái)選擇你布局的單一焦點(diǎn)。我們看到的一個(gè)很好的例子就是使用大圖片作為網(wǎng)頁(yè)上大的單一焦點(diǎn)。

強(qiáng)烈的視覺(jué)效果可以起到引導(dǎo)作用，也可以在頁(yè)面中提供結(jié)構(gòu)優(yōu)勢(shì)，讓周?chē)鷥?nèi)容得到用戶(hù)關(guān)注。如果你有多個(gè)視覺(jué)元素，可以采用格式塔理論的就近原則，將它們組合在一起來(lái)得到優(yōu)化。

/// 03 ///

使用三分法

使用三分法或者黃金比例。簡(jiǎn)單地說(shuō)，三分法規(guī)則就是將你的頁(yè)面垂直和水平換分成為三份，在該網(wǎng)格線(xiàn)相交的點(diǎn)則是天然焦點(diǎn)。通過(guò)調(diào)整你的關(guān)鍵要素到這四點(diǎn)，會(huì)讓你的頁(yè)面更賞心悅目。

黃金比例

黃金比例在網(wǎng)頁(yè)中的應(yīng)用——twitter

黃金比例在網(wǎng)頁(yè)中的應(yīng)用——habitat

就其本身而言，三分法不會(huì)神奇為你平衡布局，但通過(guò)延長(zhǎng)原理來(lái)從這個(gè)天然焦點(diǎn)發(fā)散，可以幫助你平衡布局。

/// 04 ///

使用空白

新手設(shè)計(jì)師在做一個(gè)頁(yè)面時(shí)，填充頁(yè)面上每一個(gè)空隙，充分利用每一個(gè)間隙填內(nèi)容到滿(mǎn)。而有經(jīng)驗(yàn)的設(shè)計(jì)師會(huì)知道，有時(shí)候將元素適當(dāng)舍棄會(huì)更好。

在打印中，利用空白的常見(jiàn)的方式是通過(guò)擴(kuò)大頁(yè)邊距來(lái)實(shí)現(xiàn)。而在網(wǎng)頁(yè)中，提供大量的周?chē)目臻g可以幫助布局感平穩(wěn)和協(xié)調(diào)，當(dāng)你有一個(gè)清晰的結(jié)構(gòu)，通過(guò)網(wǎng)格與內(nèi)容結(jié)合起來(lái)，使用負(fù)形效果會(huì)更好。但如果引入不恰當(dāng)，空白可能會(huì)使頁(yè)面與元素脫節(jié)。

/// 05 ///

重復(fù)設(shè)計(jì)元素

可重復(fù)的組合元素來(lái)建立連接與協(xié)調(diào)頁(yè)面。這個(gè)方式通過(guò)重組圖案或進(jìn)行設(shè)計(jì)來(lái)使整個(gè)布局協(xié)調(diào)，也可以讓用戶(hù)感到即使領(lǐng)域不同，但相互也有聯(lián)系，是一個(gè)整體。

重復(fù)給出了一個(gè)網(wǎng)站，強(qiáng)化了鮮明的地方感一致的視覺(jué)形象，這使得網(wǎng)站更令人難忘。通過(guò)一致的方法來(lái)布局和導(dǎo)航可以使用戶(hù)能很快適應(yīng)的設(shè)計(jì)，并在該網(wǎng)站的網(wǎng)頁(yè)能夠自信地預(yù)測(cè)信息和導(dǎo)航控件的位置。

/// 06 ///

使用等級(jí)制

建立結(jié)構(gòu)和層次清晰感是一個(gè)關(guān)鍵的方法來(lái)調(diào)整布局。既然談到了結(jié)構(gòu)，你要知道在頁(yè)面中傳達(dá)不同內(nèi)容的重要層級(jí)是非常重要的。例如，一個(gè)標(biāo)題，應(yīng)該比段落的內(nèi)容更直觀(guān)更重要。

通過(guò)看不同的元素表現(xiàn)方式就知道你的網(wǎng)頁(yè)中的重要層級(jí)關(guān)系，從而有了結(jié)構(gòu)等級(jí)制。

/// 07 ///

元素大小與比例

合理調(diào)整元素大小可以實(shí)現(xiàn)布局的視覺(jué)平衡。通過(guò)使一些元素大于其他，來(lái)形成層次感。這有助于幫你創(chuàng)造一個(gè)舒適的布局，因?yàn)橛脩?hù)會(huì)先看布局中較大的元素，然后繼續(xù)閱讀較小的元素。

這一原則也適用于增加對(duì)比度，通過(guò)頁(yè)面上的元素對(duì)比，讓用戶(hù)眼聚焦在重點(diǎn)上。在結(jié)構(gòu)上和布局上都有了些優(yōu)化。

大小對(duì)比做得好的話(huà)，可以使得元素從整體布局中脫穎而出。

版式是設(shè)計(jì)師必備技能之一，怎樣安排模塊內(nèi)容都是需要一步步思考再完成的。瀏覽網(wǎng)頁(yè)是我們的日常，在打開(kāi)網(wǎng)頁(yè)時(shí)可以多收藏一些別人的版式，以便做一些參考。

文章名稱(chēng)：網(wǎng)頁(yè)設(shè)計(jì)中如何展示內(nèi)容能給用戶(hù)帶來(lái)更好的效果？
分享網(wǎng)址：http://jinyejixie.com/news45/210145.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供移動(dòng)網(wǎng)站建設(shè)、商城網(wǎng)站、手機(jī)網(wǎng)站建設(shè)、App設(shè)計(jì)、虛擬主機(jī)、品牌網(wǎng)站制作

廣告

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