在網(wǎng)頁設(shè)計(jì)中，版式設(shè)計(jì)占的比重非常大，可以說版式的好壞直接決定頁面的成敗，也可以說它是網(wǎng)頁視覺識別的基礎(chǔ)。那么在具體視覺設(shè)計(jì)的時候，版式上有哪些原則及方法的？

DJ：設(shè)計(jì)的時候，如果設(shè)計(jì)者隨意地進(jìn)行處理而不考慮當(dāng)中的原則方法及對象規(guī)律的話，那么很多時候都會出現(xiàn)一些不太好的結(jié)果。雖然感性是一種相當(dāng)重 要的因素，設(shè)計(jì)中一定要帶有情感，但并不代表簡單地依靠情感就能做出好的設(shè)計(jì)。相反，如果設(shè)計(jì)的時候能夠考慮到各方面的因素并運(yùn)用恰當(dāng)?shù)姆椒ǖ脑?，那么?品將更加得體和出色。

建立網(wǎng)格

為設(shè)計(jì)對象建立一個合適的網(wǎng)格。

排版網(wǎng)格是由一些垂直和水平的線構(gòu)成的結(jié)構(gòu)，可以用來幫助內(nèi)容結(jié)構(gòu)化，它能夠讓對象產(chǎn)生秩序感。有些人說網(wǎng)格太過于呆板，影響設(shè)計(jì)創(chuàng)意，我個人覺得 可以把網(wǎng)格當(dāng)做一個整體大的框架，也可以作為設(shè)計(jì)師組織文字、圖片的支架，它相當(dāng)于是設(shè)計(jì)的基礎(chǔ)，沒有好的基礎(chǔ)怎么能夠談得上出色的設(shè)計(jì)呢？所以網(wǎng)格不僅 不影響創(chuàng)意的發(fā)揮，反而能使設(shè)計(jì)師思路得到理性地梳理。網(wǎng)格地使用，能較好地解決設(shè)計(jì)師關(guān)于頁面中各元素定位的問題，在這基礎(chǔ)之下可以做科學(xué)的精準(zhǔn)的版式 的規(guī)劃。同時使用網(wǎng)格也是一個令您的設(shè)計(jì)變得高效的方法之一，在把草圖轉(zhuǎn)化為設(shè)計(jì)稿的過程中，在版式方面主要的難點(diǎn)是如何精確地安排各個元素，如果這時候 呢夠選擇合適的網(wǎng)格進(jìn)行設(shè)計(jì)，那么這個起點(diǎn)的意義是不可小看的。

節(jié)奏韻律

網(wǎng)頁中版式的節(jié)奏感及韻律，來源于排版中的疏密的間隔安排，它就好比音樂作品里的節(jié)拍，也是組織內(nèi)容的一個重要單元。當(dāng)然在繪畫作品中也是能體現(xiàn) 的，只不過繪畫作品和設(shè)計(jì)作品有些類似，都是通過疏密的控制讓對象形成畫面節(jié)奏的和諧感受。在網(wǎng)頁中可以通過一系列的重復(fù)和固定的間隔來建立一種視覺和諧 的美感，如在一些字體大小，行距、模塊與模塊間的距離等等的制定。

縱向的節(jié)奏在網(wǎng)頁設(shè)計(jì)中是比較運(yùn)用廣泛且明顯的，如大部分資訊型的站點(diǎn)。縱向節(jié)奏在這方面起到的優(yōu)化網(wǎng)站的作用還是挺大的。什么是網(wǎng)頁縱向節(jié)奏感？ 其實(shí)就是為網(wǎng)站設(shè)定一個縱向的單元高度，就好比我們的記事本那樣，每一頁都是布滿了固定高度的線。如果文字正好處于單元高度上，那版面就能獲得連貫的縱向 平衡和節(jié)奏感。很顯然，按縱向垂直節(jié)奏排列的設(shè)計(jì)更加容易掃描或閱讀，因?yàn)樗箖?nèi)容的“出現(xiàn)”更加有規(guī)律。

這個方法不僅適用在局部的文字內(nèi)容區(qū)，對于整個頁面的內(nèi)容排布也是有用的，當(dāng)然在包含復(fù)雜元素的頁面中，如包含多種尺寸的圖片、標(biāo)題、文字格式的時 候，就需要對單元高度的設(shè)定做更多的考慮。不過根據(jù)以往個人的設(shè)計(jì)經(jīng)歷，這種精準(zhǔn)的節(jié)奏方法因受限于各種情況的影響而不總是可以完全實(shí)現(xiàn)，尤其是在設(shè)計(jì)復(fù) 雜頁面的時候。盡管如此，我個人認(rèn)為這個方法還是值得設(shè)計(jì)師們?nèi)パ芯孔非蟮摹?/p>

體現(xiàn)層級

實(shí)際上，任何一個版面或界面都存在著不同層級關(guān)系、不同組織結(jié)構(gòu)的內(nèi)容和元素，而且內(nèi)容版面層級的設(shè)計(jì)規(guī)劃和視覺層次的設(shè)計(jì)規(guī)劃其實(shí)是一樣的原理， 視覺美術(shù)渲染有主次之分，那么版面內(nèi)容的層級也一樣具有主次之分的，進(jìn)行排版設(shè)計(jì)的時候，設(shè)計(jì)師應(yīng)該把這種客觀存在的層級關(guān)系用編排的手段把它還原出來。

做好版面層級區(qū)分的核心作用是，能夠提升文本、圖片等的元素的視覺線索從而獲得更好的界面清晰度，簡單地說就是使內(nèi)容更容易閱讀了。在設(shè)計(jì)中可以通 過字體大小對比、文字效果、色塊等的方法來處理分級效果。比如哪些字應(yīng)該大一些，哪些字應(yīng)該小一些；哪些色塊要重一些，哪些淺一些……

頭疼的事情

一個版面設(shè)計(jì)完成了，拿去填充內(nèi)容后發(fā)現(xiàn)不好看了，嚴(yán)重時導(dǎo)致面目全非了，這是為什么？哦！那是因?yàn)榫庉嬋藛T沒有按設(shè)計(jì)師的版面設(shè)定去填充內(nèi)容，這 就破壞了頁面的原有的規(guī)劃了，難怪不好看了。所以，設(shè)計(jì)師還應(yīng)盡量地與編輯人員進(jìn)行溝通，并附帶上設(shè)計(jì)說明書。因?yàn)椴皇敲總€編輯人員都對設(shè)計(jì)有所了解，有 時他并不懂得你關(guān)注的問題，所以我們要嚴(yán)格把關(guān)，以免在作品出版后令你捶胸頓足。

小結(jié)

做好排版設(shè)計(jì)也不是一件困難的事情，我們可以通過字體、行距、色塊、對齊和網(wǎng)格等等的方法來規(guī)劃和控制，我個人覺得網(wǎng)站版面也是能與用戶形成交流的，作為設(shè)計(jì)者，我們必須讓這種交流保持順暢和愉悅，這樣用戶才會去喜歡它。

原文地址：uedc.163
作者：DJ