淺談網頁設計留白的虛實之美

摘 要：網頁留白內涵的包含三個方面，頁面的空白部分、大面積的有色范圍和重復出現的、在視覺上呈現出整體性的規則圖形的組合。從網頁的可用性和藝術性兩個方面闡述了網頁留白的功能，從網站整體設計和頁面設計兩個方面闡述了網頁留白的處理方法。

關鍵詞：虛實;留白;網頁設計

“留白”作為中國畫特有的繪畫語言之一，隨著現代數字媒體技術與藝術的發展，在現代設計藝術中的重要地位和作用越來越突出，在網頁設計、版面設計、室內設計等設計中多有運用。網頁設計是Web設計中最直接可見的部分，簡潔、單純、可用是當代Web標準網頁設計的主流，迅速、有效地傳達信息，少用裝飾，強調虛實、留白的運用成為網頁設計的時尚追求。在網頁設計中有效運用留白的技法和觀念，無疑是對Web標準網頁設計技術與藝術思維的極大豐富和拓展，也必將促使我們對這一思維方法展開更高層次的研究和探索。

1 關于網頁設計的“虛實”和“留白”

“留白”是中國傳統繪畫藝術千錘百煉的結晶，這種藝術思想源于傳統的中國哲學思想，基于陰陽辯證、虛實相生的原理。虛與實作為我國古代美學的一對范疇，在古代哲學思想中有很深淵源。古代的虛實相生正是哲學上的樸素辯證法在藝術領域的應用。 網頁設計通過網頁上的文字、圖形、音視頻、動畫等元素向用戶傳達信息，把各種網頁元素做藝術而合理的處理，讓用戶在接收信息的同時享受到美感，獲得良好的用戶體驗。虛實與留白是網頁設計要遵循形式美的法則之一。網頁設計留白的內涵包括三個方面：一是頁面的空白部分。“白色是一切色彩中最完美的顏色，我們幾乎找不到白色有消極意義的情境。”如logo區的空白、標題區的空白、內容和圖片周圍的空白、網頁背景空白等等。二是大面積的有色范圍。如在頁面設計中只放置極少的必要元素，背景則用大面積的單純色彩渲染，利用單純色彩的力量來突出和烘托網頁上的主要元素。在網頁設計中，無論是頁面的空白，還是大面積的有色范圍，或是規則圖形的組合背景，都是頁面的“虛”，是為了強調主體，明晰層次，突出主要的、關鍵的元素這個“實”的。

2 Web標準網頁設計留白的功能

留白是一種藝術形式，在Web標準網頁設計中，留白可以發揮重要作用。利用留白來達到頁面平衡，使整個頁面布局松緊有度，形成虛實、濃淡、動靜、輕重的效果，給人以跌宕起伏之感。與其他藝術形式不同的是，網頁設計是以傳達頁面信息為主要目的的，留白更多的是服務和服從于網頁的可用性。

可用性體現在以下幾個方面。一是突出設計主題。人們在完整地接收平面元素信息時，視線會形成一個習慣性的流動順序：視點先落入視覺焦點，后隨個元素間的強弱變化而作有序流動，最后完成對全部分元素信息的吸收。認知心理學的研究證明，留在空白之中的東西更容易被人注意和想起，留白對瀏覽起強調和停頓的作用，有助于視覺向主體元素集中凝聚，它所創造出的空間形成一種路徑進而左右用戶的瀏覽方向。如在主題文字的周圍留出恰當的空白空間，會比更改變主題文字大小和色彩更顯突出，同時也使頁面在統一性上更易處理。二是簡潔頁面元素。少就是多，簡潔就是豐富，單純就是飽滿。在單純中求豐富，在簡練中求明快。

網頁設計可用性的研究表明，簡潔的、瀏覽性強的網頁能使用戶獲得更加良好的體驗。過多的裝飾性元素或重復強調往往會導致讀者的拋棄性反應，使刻意設置的形象失去震撼效應。因此，無論從整體設計，還是結構設計、顏色搭配等方面，網頁設計都要求簡單明了，每一個符號、每一個標題、每一個版塊都要緊扣主題，堅決去掉不必要的、與主題無關的東西，盡量做到用最簡潔的元素來傳遞最豐富的意蘊、最準確的信息。

藝術性體現網頁設計中的藝術性是從屬于可用性的，但這并不影響網頁藝術性的存在和它帶給用戶的美感體驗。恰恰相反，網頁的藝術性是可用性延伸和擴展。當用戶被網頁上滿滿的文字、聲音、圖像等淹沒時，適當合理的留白空恰似一個心靈歇息的驛站，讓我們的神經得到了有效的緩和，從而使用戶輕松瀏覽。

3 Web標準網頁設計留白處理方法

在版面設計中，處理好大與小、主與次、疏與密、虛與實，都是美的比例基礎，可謂是一種既可瀏覽又可休閑的兩全其美的藝術享受。 但對留白如果不加控制的任意使用，它不僅不能有效發揮作用，反而會造成版面混亂，影響整個頁面設計。Web標準網頁設計留白可從兩個方面把握。

網站整體設計留白：在網站設計的整體方案中，廣泛利用留白的方法構建設計框架，創造統一的視覺傳達意境，使整個設計理念能夠準確而有效，形成網站獨特的風格和廣闊的系統擴展空間，使的頁面中的各個元素更加具有活力和結構組織的多元性，激發出強大的視覺能量。

網站頁面設計留白：在網頁設計中，也要注重細節的處理，尋求設計在不角度的精致表現，力求把設計延伸到每一個角落，無論從哪一個角度審視，都展現出完美的設計魅力，從而達到局部帶動整體的設計目的。具體說來，包含以下幾個方面。

一是網頁頂部（頭部）留白。保留傳遞網站的類型、風格的logo和提供簡單明了導航鏈接。二是頁面背影留白。去除阻礙視線順暢流動的底紋等裝飾性元素，根據實際需要設計好頁面邊空。三是簡化標題表現，去除題花等裝飾性元素，特別是頭條、置頂、圖版等，不作圍框、流動、色彩變換等特效重復強調。

參考文獻：

[1] 屈一鋒.論現代水墨畫中虛與實的運用[J].美術大觀，2007（11）.

[2] 愛娃·海勒（德）.色彩的文化[M].吳彤，譯.北京：中央編譯出版社，2004.

作者簡介：孟媚（1981—），女，遼寧人，魯迅美術學院（設計藝術學）碩士，魯迅美術學院視覺傳達設計學院講師。