推薦：留白的意義是為了實現產品的目標，而大空間和小空間的區別也讓留白更加細緻，細緻的結果也變成高品質的極簡主義。由於螢幕是有限的，因此網頁設計也是有限的。可以這麼説，在螢幕這個小小的盒子中，每個畫素都是一塊不動產。就算是菜鳥，也懂得一個頁面不能載入過多的內容，但涉及到究竟應該規劃多少留白，包括經驗老道的設計師或許也很茫然。今天 WordPress 網站建設就分享下關於網頁留白的內容。

留白，另一説為 “負空間”，這兩個詞常常互換使用。它們共同所指的都是螢幕中出現的元素之間的一種關係。所謂留白不一定是要白色，或黑色。就算是圖案、色彩或紋理背景都可以被稱為留白。負空間是在內容外創造一個空白的環境，好讓觀者將注意力更加集中於內容。

這篇文章中，我們將討論，怎樣運用設計師的錦囊妙招中的超強致勝工具：留白。

留白的原因

就像已經被大家所討論過的，負空間一開始是作為審美而不可或缺的一部分。

在網頁設計中，在哪裏留白顯得更加重要。可以這麼説，它決不僅僅處於視覺審美的需要，它得肩負更重要的角色，即在視覺審美與引導多用户之間達成平衡。而且，如果現在有一段文字，留白還需在此基礎上讓文字清晰，創造具有可讀性的環境。

總的來説，留白直接的影響如下。

1 、眼球掃描

在網頁中，兩塊較大內容元素之間的空間（在此稱大空間），這類留白能吸引並引導多用户的眼球掃描頁面的方式。當運用得當，就能引導多用户的視線去注意那些您想突顯的元素。這在品牌標識展示或增加多用户互動行為的時候為有效。

2 、清晰度

在兩個較小的內容元素之間的空間（在此稱小空間）諸如一個文字，或一行文字，列表，圖示等，恰當的留白也能讓這些元素更加易於辨認。

3 、視覺審美

當您看到一張大圖片，留白在視覺審美中發揮了很大的作用。舉例來説，如果內容亂七八糟絕不會是一張好看的圖片。

4 、高品位

豐富的留白將為您的頁面灌注一種精緻優雅的氛圍。

為了更好的理解和運用它，我們將要梳理不同型別的留白（大空間和小空間），以及運用它們的不同的方法（被動和主動）。

大空間和小空間

網頁設計中，在哪裏運用以及怎樣運用負空間將取決於它們的角色。簡言之，我們把這些角色大致分為大元素和小元素。

1 、大元素的留白

大元素的留白是涉及到兩個大型元素之間的留白。主要運用於：

總體內容

獨立的不同元素

文字分列

Margin

Padding

圖片之間的距離

譯者注：這裏的 Margin 和 Padding 指的是網頁設計中元素標籤外部範圍的區域。參考下圖可以幫助理解。

這型別的留白空間很大程度影響多用户的視覺流，不管是潛在引導或者強勢推動都可以讓注意力引導到您想要他們停留的地方。但在此要強調的一個法則即是距離越大動力越強。想要打破平衡，然而，由於太多的留白違反了格式塔原則，其結果就是消弱了物件間的關係。

讓我們看看下面這個網站，以此作為例子來説明留白是如何誘發多用户互動行為。

大多數多用户先都會注意到頁面標題，也就是 “Digital art&Experiments” 這句話，而在它外圍的則是大面積的留白，這樣就使得多用户的注意力完全集中於此。

儘管頁面的頂部和底部只有一側留白，但它們也同樣可以引起注意。總而言之，在此，留白的區域很好發揮了吸引注意力的作用，而設計也就似乎看上去不可思議的簡潔起來。

設計師實際上是採用留白區域作為一個空白幕布，以便給觀眾留下驚喜，好讓我們可以看到他的作品的豐富細節。一旦滑鼠移動到底部導航的任一欄目時，幕布上就會出現作品的圖片作為背景全屏展示。這種效果創造出類似年幼時的一種探索和發現的樂趣：無意間闖入一片空白的場所，發現了每個抽屜都藏匿着豐富多彩的視覺盛宴。

您可以試試滑鼠滑過時螢幕上發生的戲劇性效果。

通過留白區域作為工具來誘導多用户注意到他的作品，設計師創造出了一種新鮮奇特的體驗。在個作品出現後，我們就很想看看他還有哪些佳作。這感覺蠻吸引的，因為您將會抑制不住地想要找到為重要的內容。但這都要建立在一個的點燃您好奇的切入點基礎上。