版式設(shè)計在網(wǎng)頁中的重要性

李明妍（江蘇省聯(lián)合職業(yè)技術(shù)學院徐州財經(jīng)分院,江蘇 徐州 221008）

版式設(shè)計在網(wǎng)頁中的重要性

李明妍
（江蘇省聯(lián)合職業(yè)技術(shù)學院徐州財經(jīng)分院,江蘇 徐州 221008）

在這個互聯(lián)網(wǎng)的時代，瀏覽網(wǎng)頁就成了人們必不可少的生活方式，那么網(wǎng)頁設(shè)計這個行業(yè)便逐漸走俏，為了便于人們設(shè)計出布局合理，形式獨特的網(wǎng)站，網(wǎng)頁設(shè)計的版式設(shè)計將變得越來越重要，本篇文章便是對如何將版式設(shè)計合理的運用在網(wǎng)頁中進行研究。

網(wǎng)頁設(shè)計；互聯(lián)網(wǎng)；瀏覽網(wǎng)頁

1 網(wǎng)頁的原則

網(wǎng)頁設(shè)計由于是在電腦屏幕上觀看的，還需要跟瀏覽者進行互動，這就和普通的平面設(shè)計有了質(zhì)的不同。觀看載體不同，所以我們在研究網(wǎng)頁設(shè)計的時候，除了要研究網(wǎng)頁的美觀還要研究瀏覽者在面對網(wǎng)頁的心理感受，要讓讀者先從功能上對其有個認知，在認知基礎(chǔ)上才能進行制作版面的設(shè)計。這就使得網(wǎng)頁設(shè)計的這門技術(shù)還需我們做更多的相關(guān)探究。

2 網(wǎng)頁的布局風格

網(wǎng)頁布局，就是以最適合瀏覽的方式將圖片和文字排放在頁面的不同位置。 看看我們經(jīng)常用到的版面布局形式:

（1）“同”字型布局。這種布局結(jié)構(gòu)的最上面一般是網(wǎng)站的標志、廣告以及導航欄；下面是主要內(nèi)容，左有一些欄，右也有一些欄目，在結(jié)構(gòu)的中間位置是內(nèi)容主體；結(jié)構(gòu)的最下面是一些網(wǎng)站的基本信息及版權(quán)信息。國內(nèi)一些大中型網(wǎng)站常見的是這種結(jié)構(gòu)布局方式。這種結(jié)構(gòu)的優(yōu)點是把版面充分的利用了起來，讓讀者有很大的信息量進行閱讀；它的缺點是頁面看上去靈活性不夠，有時也給人一種擁擠的感覺。

（2）“廠”字型局：這種布局結(jié)構(gòu)的特點是在頁面的頂部設(shè)為標志和廣告條，下方左面為主菜單，右面顯示正文信息。本布局方式是目前應(yīng)用比較廣泛的一種。本布局的優(yōu)點是主次非常分明，頁面結(jié)構(gòu)一目了然，很清晰；它的缺點是對色彩搭配要求比較高，如果搭配不當?shù)脑挘瑫o人以規(guī)矩呆板，甚至容易引人厭煩。

（3）“框架”型布局：這種布局結(jié)構(gòu)一般為上下或左右布局，一欄是導航欄，一欄是正文信息。也有將頁面分為三欄的，上邊一欄放圖片廣告，左側(cè)欄放導航欄，右側(cè)為正文信息。

3 網(wǎng)頁布局清晰的原則

3.1 網(wǎng)頁的標題設(shè)計

在網(wǎng)頁的版式設(shè)計中成功的標題可以讓人一目了然和賞心悅目，也能給整個網(wǎng)站提高氣氛。網(wǎng)站的首頁上方會有公司的標題，標題后面的背景也有靜態(tài)的和動態(tài)的區(qū)分，也可以形成交互性。這也是網(wǎng)頁的版式與普通印刷品版式的區(qū)別。

3.2 文字的編排

文字本身是以傳達內(nèi)容和表達信息為主題的。在網(wǎng)頁設(shè)計過程中，網(wǎng)頁的設(shè)計一定要抓住這個主題不要放松，但是同時也可以利用字體也表達一定的感情，例如：粗體字強壯有力，有男性特點，適合機械、建筑業(yè)等內(nèi)容；細體字高雅細致，有女性特點，更適合服裝、化妝品、食品等行業(yè)的內(nèi)容。同時設(shè)計者也要考慮到一些細節(jié)的內(nèi)容，如很多讀者的計算機中只裝有三種字體及一些相應(yīng)的特定字體，如果沒有特別強的針對性的要求，最好采用缺省字體。

字號的大小也有一定的要求，如標題和其他需要強調(diào)的地方用字號大一些，如9磅，而網(wǎng)頁的正文，這是人們閱讀量最大的，12磅的字體是比較合適的，像一些頁腳的和輔助性的信息，可以使用能小一點的字號。

頁面里的正文部分，這個部分是最重要的部分，這部分的內(nèi)容是由許多單個文字經(jīng)過編排組成的群體，這個群體影響著讀者的閱讀，可以從藝術(shù)、個性、情感方面對這部分進行處理，以達到最好的抓住讀者眼球的作用。

3.3 圖文結(jié)合

版式有可以分為無圖的版式和有圖的版式，有圖的版式鋼架豐富，無圖的版式需要給人不容易枯燥的感覺就需要巧妙的排版了，兩種版式都不可缺少，當然網(wǎng)站上更多的還是圖文結(jié)合的版式。

在視覺順序上，從吸引人的注意力角度來說，圖形對人眼球的吸引力遠遠是超過了純文字對人眼球的吸引力，圖形給人的視覺印象要比文字強烈得多，這是因為圖形的色彩變化明顯，所含內(nèi)容也異常豐富，同時圖片的引入也對頁面起到好很好美化作用。可以說，要使網(wǎng)頁更好的吸引人的眼球，更好的抓住人們的視線，并在純文本基礎(chǔ)上變得更有趣味，最為簡捷省力的辦法就是使用圖片。幾乎所有的網(wǎng)頁都用到了圖形，善于使用圖形，可以讓網(wǎng)頁的主題表現(xiàn)的更加生動、形象和直觀，同時也較好地增強網(wǎng)頁的宣傳力、號召力和感染力，吸引讀者的注意，引起讀者的興趣。網(wǎng)頁可以圖文并茂地向用戶提供信息，成倍地加大了它所提供的信息量。對于一條信息來說，圖片對瀏覽者的吸引遠遠超過單純的文字。頁面的節(jié)奏韻律。這也是圖文排版的魅力所在。

4 網(wǎng)頁視覺美觀的原則

網(wǎng)頁的顏色表達一種情感，也象征不同的含義。這些象征含義在人們思想交流形成了復(fù)雜的問題，如人們的時代、民族、年齡、地域、階層、工作能力、經(jīng)濟地區(qū)、通過不同的顏色組合，呈現(xiàn)給他們的心理感受是截然不同的。如紫紅和土黃搭配，可以產(chǎn)生高貴的，的氣氛。粉色和白色混合，能體現(xiàn)柔順、雅致、浪漫的氣氛。金色和大紅、金色的搭配能渲染喜慶的氣氛。而橙色和黃色的搭配則會給人帶來暖意。設(shè)計主題的不同，顏色搭配的方法也隨之改變。兼顧網(wǎng)頁的適應(yīng)性，應(yīng)盡量使用網(wǎng)頁安全色。可先確定一種能表現(xiàn)主題的主體色，然后根據(jù)具體的需要，應(yīng)用顏色的近似和對比來完成整個頁面的配色方案。整個頁面在視覺上應(yīng)是一個整體，以達到和諧、悅目的視覺效果。

總是，一個優(yōu)秀網(wǎng)頁的實現(xiàn)離不開以上幾點原則，只要每個細節(jié)都做到合理設(shè)計一定能夠呈現(xiàn)出一個精彩的網(wǎng)站。

[1]董海斌.平面視覺元素在網(wǎng)頁設(shè)計中的應(yīng)用研究[J].科技信息,2008(05):155.

[2]尹振鶴．云計算的特點及應(yīng)用分析[J].硅谷,2014(12):126.

[3]鄒鈺．AutoCAD動態(tài)塊在室內(nèi)設(shè)計制圖中的應(yīng)用[J].硅谷,2014(12):126.

[4]楊翠芳.淺析視錯覺手段在平面設(shè)計中的運用技巧[J]。電腦知識與技術(shù),2011(11):8037.