淺析平面設計元素在網(wǎng)頁布局中的應用

馮志兵

摘 要：網(wǎng)頁布局設計有很多構成要素，其中，點、線、面、體是構成網(wǎng)頁頁面布局設計最基本的要素。點、線、面、體作為視覺語言中的基本元素，通過巧妙的互相穿插、互相襯托、互相補充構成最佳的頁面效果，可以充分表達出完美的設計意境。

關鍵詞：平面設計元素；網(wǎng)頁設計；網(wǎng)頁布局

中圖分類號：TP393.092；J51 文獻標識碼：A 文章編號：1005-5312（2017）14-0066-01

網(wǎng)頁設計是以視覺傳達為基礎的，主要是傳達網(wǎng)站的各種信息，使網(wǎng)站的頁面設計更加符合人機交互和使頁面更加符合人們的視覺瀏覽習慣，感官上給人一種直接、美觀、合理的視覺感受，也是網(wǎng)站要表現(xiàn)的內容之一。這就要求我們在進行網(wǎng)頁設計之前，應該找到構成網(wǎng)頁頁面的各種不同的空間效果，然后再合理安排那些視覺要素。點、線、面、體在網(wǎng)頁設計中扮演著至關重要的作用，不同的點、線、面、體組合會帶來不一樣的的心理感受，也可以體現(xiàn)不同的情感訴求。點、線、面、體的組合關系，影響著網(wǎng)頁頁面的設計風格和網(wǎng)站的主題，它是網(wǎng)頁設計的基礎，也是構成網(wǎng)頁布局的基本形態(tài)元素。

一、網(wǎng)頁布局中的點

在網(wǎng)頁設計中，點是在對比中存在的一個相對的概念，在網(wǎng)頁設計中，一個標志、一張圖片、一個文字、一個按鈕都可以稱之為點。點的形狀也是改變的，不一定是圓的，現(xiàn)實中的點也是各式各樣的，有的點是規(guī)則的點，呈圓形、三角形或方形；有的點是不規(guī)則的，一般多為異形。自然界中的任何形態(tài)，只要縮小到一定的程度，都可以產生不同形態(tài)的點。點的外形不同，給人的視覺和心理反應也不一樣。在實際應用的點的時候，重點不僅在于點的外形，更在于點在整個空間中起的作用，在相同的視覺環(huán)境下，相對面積越小，點的視覺效果越強。當畫面上只有一個點出現(xiàn)的時候，我們的視線會只集中在這一個點上，這個點就成了頁面中的視覺焦點。如果頁面有兩個點出現(xiàn)，我們可以觀察兩個點的位置和大小，如果兩個點大小相同，位置不同，頁面的注意力就會集中在連接這兩個點的連線上，在視覺上產生連續(xù)的效果；當兩個點大小不同時，大的點會首先引起我們的注意，然后再移動到小的點上。當頁面有三個或者三個以上的點的話，我們就可能感覺到一個虛面，點越多，其“面”的感覺就會越強。

二、網(wǎng)頁布局中的線

線是由無數(shù)個點構成的，具有長度、寬度、方向等性質。線的類型較多，常見的有直線、曲線、斜線等等，不同的線會帶給人不同的心理感受。一般來說，直線給人一種平穩(wěn)、挺拔的感覺；弧線給人感覺流暢、輕盈；曲線使人跳動、不安。不同粗細的線給人的感覺也是不一樣的，粗線表現(xiàn)粗礦、陽剛之感，細線可以表達銳利、敏感、速度感等等，當粗線和細線搭配的時候，粗線必定會首先進入人們的視野。斜線給人移動的錯覺，一根斜線蘊含著潛在的能量，把一組直線作為背景元素，它會給網(wǎng)頁設計帶來紋理的感覺，如果使用一組斜線代替直線，就會使設計有緊張感，會讓瀏覽者的眼睛不停的跟隨它移動。

現(xiàn)在，許多設計師也會把線作為網(wǎng)頁空間分割的主要手段之一。線的空間分割會產生許多不同比例的面，所以線的分割也可以理解為面的分割，面分割后形成的邊緣就是線。因此，對網(wǎng)頁頁面進行分割的時候，既要考慮各形態(tài)元素彼此之間的形狀，又要注意不同空間所具有的主次關系和空間關系，以保證良好的視覺秩序，并獲得視覺空間的整體感和和諧感。

三、網(wǎng)頁布局中的面

幾何學定義中，面是線的移動軌跡。點和線的密集可形成面，面的分割、面與面的合成亦可形成新的面。面是構成體的基本單位，面在網(wǎng)頁設計中也經(jīng)常出現(xiàn)，可以說，網(wǎng)頁設計的設計離不開面的組合，一段文字可以看做一個面，一張圖像可以看做一個面，頁面的留白也可以看做是一個面，“面”的概念是不固定的，面是網(wǎng)頁設計中常用的元素，它的大小、區(qū)直變化都會影響頁面的布局。面也有規(guī)則和不規(guī)則之分，一般認為方形和圓形的面是規(guī)則的，這兩種面相加或者相減可以產生無數(shù)個多樣的面；不規(guī)則的面，沒有規(guī)律可以遵循，一般很難判斷屬于哪種面。不同的面在視覺上有不同的心理作用和情感的表達。在網(wǎng)頁設計中，規(guī)則的面給人一種簡潔明了、規(guī)則有序的感覺；不規(guī)則的面給人一種輕松、活躍的感覺，但是這些面在設計和排版的時候要注重相關設計原則，有效合理地處理頁面版式設計中面的構成關系，可以使整個頁面布局充滿美感，富有藝術感；反之可能給人一種無序混亂的感覺。

四、網(wǎng)頁布局中的體

網(wǎng)頁設計發(fā)展的另一個趨勢是二維朝著多維的方向發(fā)展，在網(wǎng)頁布局設計中，有時為了營造一種立體的視覺效果，讓整個頁面在視覺上更加具有立體感，會采用立體幾何圖形中的基本形體的形式來表達，不同的立體幾何圖形會給頁面帶來不同的藝術效果。而我們常見的形體一般有球體、立方體和圓錐體三種。網(wǎng)頁頁面設計根據(jù)畫面中不同體的不同編排和布局，會給用戶營造一種不同的心理感覺，例如，球體往往給人一種圓滑、柔和得心理感受；椎體則給人一種尖銳、刺激的感覺；立方體會給人一種平穩(wěn)、大氣、安全的心理感受。網(wǎng)頁設計中合理的“體”的應用，極大的提高了頁面整體的藝術效果。

綜上所述，我們在進行網(wǎng)頁布局設計的時候，平面設計元素點、線、面、體是需要首先考慮的因素，我們只有掌握了它們之間的關系，并且了解了在使用它們的過程中，通過不同的表現(xiàn)形式帶給受眾的情感和心理感受是不同的，這樣才能設計出具有良好視覺效果的網(wǎng)頁布局頁面設計。

參考文獻：

[1]梁日升，楊杰.網(wǎng)頁藝術設計[M].北京：機械工業(yè)出版社，2011.

[2]倪洋.網(wǎng)頁設計[M].上海：上海人民美術出版社，2012.