朱紀蘭

江蘇省揚中市供電公司，江蘇鎮(zhèn)江 212200

1 版面設計方法與布局原則

1.1 版面設計方法

網頁版面設計的方法和技巧主要有以下幾點：

1)簡潔

網頁版面首先映入眼簾的是布局，而布局最重要的原則就是簡潔，簡潔的版面設計能夠給人帶來煥然一新的感覺，這有利于瀏覽者更順利的進行網頁信息閱讀，對其更好的選擇，只有先簡潔的閱讀網頁主題內容，其次才是從屬的內容。往往瀏覽者會被網頁圖片的精美吸引住，所以這時網頁只有在訪問中體現它的使用價值，他們才會反復性的進行瀏覽訪問。這個網頁版面在百度、谷歌中比較常見，因為他們給人的感覺簡潔、瀏覽器來更高效。

2)要有主色調

網站版面給人的第一感覺，要從主色調說起，主色調主要布局與網站網頁設計中。主色調多的頁面會給客戶帶來厭煩的感覺，不利于瀏覽者長期觀看。簡單來說，網頁版面的主色彩應用中不能超過5 種，而且其中應以一種主色調為主，讓其占主導地位，用其他4 中顏色作為襯托和點綴。網頁版面設計的主色調一般包括黃色、藍色、橙色、灰色、黑白色系列。

3)注意字體的設置

網頁版面的布局也包括字體的樣式，字體在網頁版面中也應遵循簡易的原則，也以不超過3 種樣式為主。既然遵循簡易原則，且版面設計字體應不要太大，這樣在網頁版面顯示的字體會給瀏覽者帶來更多有用的信息。哪些閃爍的文字就最好不要出現在網頁版面設計中，圖片的閃爍會給瀏覽者帶來厭煩的感覺，甚至會不舒服。一般而言，標題欄中的字體應比正文相對大些，顏色也應該區(qū)分開來。

4)視覺效果要好

網頁版面中的網頁結構與排版設計中最重要的成分是視覺效果。優(yōu)秀的設計者能制作出更完美的網頁排版和結構，翻閱那些成功的網頁分析發(fā)現，網頁主題部分設計的比例是1：2；2：1；再者也可以按1：2：1 的結構，這些比例結構是網頁版面設計中較為常見和比較流行的結構方式。網頁版面的標題和結尾處，也應合理的發(fā)布網頁信息，更應遵循合理組織、靈活多變的結構方式去布局。

1.2 版面布局原則

網頁版面的布局類似于雜志排版的布局。作為一種頁面布局，可以是圖片、或者是文字，也有可能是動畫等等。同時，或大或小的文本，圖片的大?。粍屿o態(tài)的運用。當瀏覽者瀏覽版面時，看到的畫面是由文字和圖片構成的，假如文字和圖片雜亂五章的羅列在一起，會顯得頁面比較復雜。所以版面的布局應根據版面的內容需要，進行合理的排序編輯，布局，這樣在版面布局中形成一個有機的整體，讓用戶更好的瀏覽。以下是版面布局的原則：

1)整體布局，和諧統(tǒng)一。網頁設計中占據關鍵地位的整體布局頁面，起著主導作用。聰明的整體布局，充分顯示了設計師的想法，設計師的靈感，這個頁面必須協調統(tǒng)一。

集成是布局的傳統(tǒng)方法是使用一個對稱的形式。通過空間，和之間的交互文本和圖形建立整體的均衡狀態(tài)，產生和諧的美感。然而，對稱平衡有時使頁面顯得呆板，僵化、缺乏活力。對稱平衡輔助設計一些新的單詞和模式，需要時可以使用一些夸張，和強烈的緊張和運動，能給對稱頁面添加一些生動、有趣；

2)主次分明，中心突出。在一個頁面布局中，您必須首先考慮視覺中心，該中心一般在頁面的關鍵領域，即中部和上部的位置。因此應該最溝通的信息，在這個網站最具吸引力的內容。在視覺的中心可以安排那些次要的內容，略，突出關鍵頁面上的，優(yōu)先考慮。

最終的目的是使頁面布局頁面產生清晰有序，更好地突出主體，達到最好的顯示效果，因此，內容頁面的視覺中心應該是主體。網頁可以視覺秩序、空間層次、主從關系和相互之間的邏輯關系，通過組織掌握和使用來突出主體?？臻g層次，按照訂單的主從關系使得放大視覺中心的主要形象，表達主體思想，將一個總體布局設計文檔在各種信息，幫助建立的主要形象，和雙方的主要形象適當地增加一些空白，可以讓更突出強調的主要形象；

3)疏密有度，錯落有致。在版面布局的內容中，一定要緊密結合，恰當留出空白，合理的運用空格，例如字間距和行間距的制造；在對稱的原則下講究非對稱和對稱美；對于形態(tài)和色彩的運用更要結合黑白搭配，圓形和方形的搭配，進而更好的獲得視覺帶來的效果；

4)圖文并茂，相得益彰。圖形的美觀，文字的整潔，都需要二者相互搭配，如果圖形在版面設計中比例較大，而文字使用較少，就會大大降低頁面所呈現的額信息容量；反之，文字占用太多則會顯現出整個版面的沉悶，沒有生氣，所以圖文并茂，合理搭配，互相協調，才能給網頁版面帶來靈活的展現，繼而豐富了頁面的內容。

2 常見版面布局

版面通常所指的是在網頁瀏覽器中呈現的完整布局，布局呈現的文字和圖形相得益彰，以下是常見的頁面布局形式：

2.1 T 型布局

T 型結構是頂部的頁面布局的條紋網站標語和橫幅，下面左邊主菜單的一部分，右側的布局來顯示內容。因為菜單背景更深，整體效果類似于英文字母T，T 布局，這是最廣泛應用于網頁設計布局。其優(yōu)點是頁面結構清晰，明確，主次是最容易學習初學者的布局方法;缺點是沉悶的，如果把握不好，不注意細節(jié)和色彩搭配，容易看后讓人覺得無趣。T 的布局結構如圖1 所示。

圖1 T 型布局結構圖

2.2 “口”型布局

“口”型布局映入眼簾的感覺是頁面最中間的主題內容，像一個口字，左右為注冊信息，內容導航以及搜索引擎，右側往往是動態(tài)新聞，熱點內容，以及友情鏈接，上下則為橫條廣告，以及橫條菜單。而另一個口型布局相對簡單些，主要有橫條廣告或標題以及主題內容來布局的。

2.3 “川”型布局

在頁面布局中，川型布局是最特殊的，整個頁面呈現川字形狀，一般分為3 列，網站的內容欄目主要呈現3 列中，這樣就可以更大限度的呈現主頁的索引功能。這種布局針對網站內容欄目較多。它區(qū)別于國形布局，其內容主要是頁面的二級鏈接，不足之處就在于欄目在配置的比例上是不平衡的，色彩也不容易得到統(tǒng)一。

2.4 POP 布局

流行布局的海報，一個美麗的照片作為頁面設計中心，在適當的位置放置主菜單，用于POP 布局。這個布局不是上下和左右對稱，但是需要平衡和節(jié)奏，可以實現動態(tài)效果，其優(yōu)點是美麗迷人，缺陷是速度運行中是很緩慢的。

圖2 POP 布局

3 新技術對企業(yè)網站的挑戰(zhàn)

真正的媒體行業(yè)的變化是由數字信息傳播方式演變而來的，傳統(tǒng)媒體的企業(yè)應該跟上步伐，大膽的擁抱，積極為數字方式進行傳輸。終端設備的發(fā)展，使大量的桌面的網絡時代企業(yè)再次面臨嚴峻考驗。新的在線閱讀設備催生了新的開發(fā)技術，顯示技術，當然也帶來了新的設計技術。新一代的數字新媒體文化的游客的感知達到了不可逆轉的趨勢，他們會像往常一樣，忘記了傳統(tǒng)媒體網絡的緩慢。通過互聯網媒介為核心企業(yè)，因此，媒體，還需要繼續(xù)跟蹤新技術，密切關注數字波的進展，為了保持良好的市場競爭力，將不會被讀者拋棄。網頁設計的過程中，我們應該繼承我國的傳統(tǒng)文化，形成獨特的設計風格，擴大的設計視覺語言的同時，我們還需要創(chuàng)新，突出現代化、引領時尚潮流。在現代極簡主義風格中融入中國傳統(tǒng)元素以及符號的提煉為版面設計做出突出貢獻，促進網頁設計變得更加強烈的視覺認知和藝術魅力，創(chuàng)造一個自然、合理、平穩(wěn)的視覺過程，更好地激發(fā)人們的審美情趣和引導瀏覽者更好的接受信息。

[1]趙曉莉.iv+css布局在網頁設計中的應用[J].管理學家，2010.

[2]章學明.淺談水工自動化監(jiān)測系統(tǒng)在城西水庫的應用[J].管理學家，2010.

[3]嚴加瓊.淺析網頁設計中的頁面布局[J].電腦學習，2010.

[4]艾妮.基于三維全景技術的通用電子商務系統(tǒng)的研究與開發(fā)[D].貴州大學，2009.

[5]馬馳.語文課堂的幽默應充滿理趣[J].小作家選刊（教學交流），2013.

[6]周歡.論網頁設計留白[J].小作家選刊（教學交流），2013.

[7]李玲玲.關于"網頁布局"方式的研究[J].淮北職業(yè)技術學院學報，2011.