王 欣
[摘要]上個(gè)世紀(jì)九十年代初期,現(xiàn)代互聯(lián)網(wǎng)的模式開始初露端倪,當(dāng)今,互聯(lián)網(wǎng)已經(jīng)十分普及。隨之而來(lái)的是網(wǎng)頁(yè)成了和大家息息相關(guān)的信息傳達(dá)平臺(tái)。這個(gè)平臺(tái)在她外在的表現(xiàn)形式上不能脫離視覺傳達(dá)這么一件華麗的外衣,這就是這里要討論的——版式設(shè)計(jì)在網(wǎng)頁(yè)中的應(yīng)用,通過討論這些內(nèi)容,了解網(wǎng)頁(yè)其實(shí)應(yīng)該是功能性和美學(xué)完美結(jié)合的統(tǒng)一體。
[關(guān)鍵詞]互聯(lián)網(wǎng)信息傳達(dá)視覺版式設(shè)計(jì)功能美學(xué)
中圖分類號(hào):TP3文獻(xiàn)標(biāo)識(shí)碼:A文章編號(hào):1671—7597(2009)1020115--01
一□網(wǎng)頁(yè)版式設(shè)計(jì)應(yīng)遵循的原則
網(wǎng)頁(yè)的版式設(shè)計(jì)一定要遵循的就是功能性的突出表現(xiàn),它是一個(gè)網(wǎng)頁(yè)與用戶互動(dòng)的工具,要讓瀏覽網(wǎng)頁(yè)的人先從功能上對(duì)它有一個(gè)認(rèn)知,之后再在這個(gè)基礎(chǔ)上進(jìn)行版面的設(shè)計(jì)。
二□網(wǎng)頁(yè)版式設(shè)計(jì)的視覺流程
要做到符合網(wǎng)頁(yè)版式設(shè)計(jì)的視覺流程,可以遵循以下原則:
(一)按照方向與位置安排視覺流程
現(xiàn)代設(shè)計(jì)的理念就是追求簡(jiǎn)約、明確、清晰,在這樣的風(fēng)格下傳達(dá)各種美的概念。如從上到下、從左到右、從左上到右下等視覺流程方法,這些流程軌跡都是最符合人的視覺習(xí)慣的,也是視覺流程的最常見的表達(dá)形式。
(二)按照視覺中心安排視覺流程
在一個(gè)設(shè)計(jì)作品中,一個(gè)亮點(diǎn)是視覺的中心,通過這些如文字、色彩、符號(hào)、圖形、線條等視覺形式的元素處理,主動(dòng)引導(dǎo)視線向一定的方向運(yùn)動(dòng)。由主及次、由近及遠(yuǎn)、由實(shí)及虛的將版面的各個(gè)構(gòu)成因素有序的聯(lián)系起來(lái),形成一個(gè)整體,就能發(fā)揮最大的信息傳達(dá)功能。
(三)按照自由方式安排視覺流程
運(yùn)用自有視覺流程的方法,版面的各視覺元素就應(yīng)該是非并列的關(guān)系,元素的排列也是在非等量的空間內(nèi),將枯燥的元素付之新的視覺語(yǔ)言,使之更具視覺效果、更有沖擊力。
三□網(wǎng)頁(yè)版式設(shè)計(jì)的基本內(nèi)容
(一)網(wǎng)頁(yè)的標(biāo)題設(shè)計(jì)
在網(wǎng)頁(yè)的版式設(shè)計(jì)中好的標(biāo)題設(shè)計(jì)可令人賞心悅目,能形成網(wǎng)頁(yè)的整體風(fēng)格,并且包括網(wǎng)站的1080、導(dǎo)航以及一些快捷的欄目等主要的信息。標(biāo)題所在的欄目一般位于網(wǎng)頁(yè)的上方,并且左右貫穿了整個(gè)網(wǎng)頁(yè),標(biāo)題的背景可以使動(dòng)態(tài)的圖片也可以使一般的靜態(tài)圖片,這一點(diǎn)是有網(wǎng)頁(yè)的交互式特性所決定的,就是因?yàn)榫W(wǎng)頁(yè)是一個(gè)需要互動(dòng)的頁(yè)面t這一點(diǎn)在網(wǎng)頁(yè)版式設(shè)計(jì)中一定要考慮到。并且,要在網(wǎng)頁(yè)的美感和功能性兩者之間找到一個(gè)合理的臨界點(diǎn)來(lái)展示這個(gè)網(wǎng)頁(yè),讓這兩點(diǎn)都達(dá)到最大限度的發(fā)揮。
(二)欄目的分割設(shè)計(jì)
欄目分割的要點(diǎn)是分割后每個(gè)面積大小以及各個(gè)欄目的位置,這些決定了這個(gè)欄目在整個(gè)網(wǎng)頁(yè)版式中的主次關(guān)系,過于平衡,容易讓人覺得視線無(wú)處可放,沒有吸引視線的點(diǎn)。
(三)主體的突出
這里的“紅花”也就是主題,可以通過位置、面積大小、顏色等方式被突出出來(lái)的,就是主體的突出。一個(gè)事務(wù)是一個(gè)整體,整體又是由個(gè)體組成的,每個(gè)個(gè)體雖然都是個(gè)體,但也有主次之分。全部的主體就不能構(gòu)成主體這一個(gè)概念,就像一定要用綠葉來(lái)配紅花一樣。這里的“紅花”也就是主題可以通過位置、面積大小、顏色等方式被突出出來(lái)的,就是主體的突出。
(四)文字的編排
在前面我們把網(wǎng)頁(yè)的版式設(shè)計(jì)當(dāng)作是一個(gè)整體來(lái)看待,現(xiàn)在我們分析它的組成,主要的就是文字,文字可以說是任何視覺上展示的版面的設(shè)計(jì)主體。
1、點(diǎn)——文字在版面的設(shè)計(jì)中可以被我們當(dāng)做點(diǎn)來(lái)設(shè)計(jì),每個(gè)字都是一個(gè)個(gè)體也同時(shí)扮演著一個(gè)獨(dú)立的整體,就是我們要表現(xiàn)的那個(gè)點(diǎn)。
2、線——線有時(shí)也是通過文字展現(xiàn),這就是點(diǎn)動(dòng)成線。一條線是由一個(gè)個(gè)點(diǎn)構(gòu)成的,這一個(gè)個(gè)的點(diǎn)就是我們要設(shè)計(jì)的主要元素——文字。
3、面——線動(dòng)成面,這樣就產(chǎn)生了面積,也就是所謂“面”的形式。面分解開來(lái)也是有一個(gè)一個(gè)點(diǎn)——也就是文字——組成的。
(五)圖文的結(jié)合
圖文結(jié)合主要有兩個(gè)表現(xiàn)形式,首先是文配合圖這樣的形式,這里圖形是網(wǎng)頁(yè)的主體,文字是輔助存在的,比如一些新聞?lì)惖木W(wǎng)站,圖不能表明一件事情的始末,所以要用文字配合說明。另外一種情況正好是反過來(lái)的——圖配合文字。在這里要把握?qǐng)D和文的關(guān)系,根據(jù)不同類別的網(wǎng)站,網(wǎng)頁(yè)中文和圖應(yīng)當(dāng)靈活搭配。
(六)版塊的使用
一個(gè)綜合類的網(wǎng)站有很多的版塊,所以在整個(gè)網(wǎng)頁(yè)的設(shè)計(jì)上要以版塊為整體的大的元素,是版塊作為欄目的細(xì)節(jié)部分。比如說一個(gè)大的門戶類網(wǎng)站,它可能會(huì)包括很多內(nèi)容,像新聞、博客、體育、娛樂、音樂、社會(huì)、軍事、房產(chǎn)、家居、數(shù)碼、論壇等等,這些版塊都要簡(jiǎn)單明確的展示給觀者。
(七)頁(yè)面的節(jié)奏
節(jié)奏是從音樂中派生過來(lái)的一個(gè)很感性的詞匯,她需要根據(jù)設(shè)計(jì)的風(fēng)格和觀者本身的感情綜合起來(lái)體會(huì),一個(gè)實(shí)事類的網(wǎng)站給人的節(jié)奏就應(yīng)該是快速律動(dòng)的:一個(gè)軍事類的網(wǎng)站給人的節(jié)奏就是嚴(yán)肅莊重的等等,這就是節(jié)奏。這一點(diǎn)要求設(shè)計(jì)師要從整體上把握,若不能在網(wǎng)頁(yè)版式設(shè)計(jì)的美感和功能上做到完整或者有所突破而可以的追求節(jié)奏t反而會(huì)適得其反。
四□關(guān)于霸頁(yè)的視覺沖擊力
現(xiàn)在同類的網(wǎng)站多如牛毛,各種各樣的網(wǎng)頁(yè)也呈現(xiàn)出爭(zhēng)奇斗艷的趨勢(shì),那么怎樣能讓一個(gè)網(wǎng)頁(yè)在眾多的網(wǎng)站中獨(dú)樹一幟、讓人們能對(duì)它過目不忘呢?其實(shí)除了內(nèi)容上的新穎,極具視覺沖擊力的網(wǎng)頁(yè)設(shè)計(jì)也是起到了極大的作用!讓人們甚至在只看一眼的情況下能對(duì)這個(gè)網(wǎng)站產(chǎn)生興趣就是這個(gè)網(wǎng)頁(yè)版式設(shè)計(jì)的成功,因?yàn)楝F(xiàn)在很多網(wǎng)站之間彼此都做了鏈接,我們可以從這個(gè)頁(yè)面登陸到另外一個(gè)同類網(wǎng)站上面,這時(shí)如果在形式上具有獨(dú)到之處,視覺設(shè)計(jì)就起到了決定性的作用。視覺沖擊力能使人們的視線在這個(gè)頁(yè)面上停留,從而向人們傳遞信息。信息的傳遞是需要時(shí)間的,不管是花幾秒鐘粗略的掃一下頁(yè)面或版面。①那么視覺沖擊力是怎么形成的呢?
(一)層次性
圖形和元素之間層次的關(guān)系可以達(dá)到干擾多余視線的作用并且更能讓人注意到這個(gè)頁(yè)面中的主體元素,但是這里用于層次的干擾圖形必須是這個(gè)頁(yè)面中的輔助圖形。
(二)視覺牽引
利用元素來(lái)吸引觀者視覺,讓觀者隨著設(shè)計(jì)者的思維去觀看作品,大多數(shù)這樣的情況都是可以歸類為使用點(diǎn)、線、面等的引導(dǎo)來(lái)實(shí)現(xiàn)的。
(三)顏色誘導(dǎo)。顏色——特別是一些純的顏色,容易給人很強(qiáng)烈的視覺沖擊1在這里運(yùn)用對(duì)比等構(gòu)成使得頁(yè)面充滿吸引力!
五、結(jié)論
網(wǎng)頁(yè)的功能就是要傳達(dá)給人們信息。那么有關(guān)于網(wǎng)頁(yè)的設(shè)計(jì)就都不能離開這個(gè)最基本的出發(fā)點(diǎn),網(wǎng)頁(yè)的版式設(shè)計(jì)也是一樣。不管版式設(shè)計(jì)的內(nèi)容在網(wǎng)頁(yè)的設(shè)計(jì)中應(yīng)該得到怎樣的應(yīng)用,都要考慮到與功能的結(jié)合使用。所以在給一個(gè)網(wǎng)頁(yè)設(shè)計(jì)版式的時(shí)候,要首先考慮到整個(gè)網(wǎng)站的使用功能,在這個(gè)基礎(chǔ)上去發(fā)揮通過網(wǎng)頁(yè)版式設(shè)計(jì)傳達(dá)給人們信息的這么一個(gè)作用。最后把這些和我們所設(shè)計(jì)的結(jié)合在一起,形成一個(gè)完美的整體,各個(gè)方面都充分的發(fā)揮作用,使得人們?cè)跒g覽一個(gè)網(wǎng)頁(yè)的時(shí)候既接收到了需要的信息,又接受了這個(gè)網(wǎng)頁(yè)傳達(dá)給人們的整體設(shè)計(jì)風(fēng)格,這才是一個(gè)臺(tái)格的網(wǎng)頁(yè)版式。