留白的意義是為了實(shí)現(xiàn)產(chǎn)品的目標(biāo)，而大空間和小空間的區(qū)別也讓留白更加細(xì)致，細(xì)致的結(jié)果也變成高品質(zhì)的極簡(jiǎn)主義。由于屏幕是有限的，因此網(wǎng)頁(yè)設(shè)計(jì)也是有限的。可以這么說(shuō)，在屏幕這個(gè)小小的盒子中，每個(gè)像素都是一塊不動(dòng)產(chǎn)。就算是菜鳥，也懂得一個(gè)頁(yè)面不能加載過(guò)多的內(nèi)容，但涉及到究竟應(yīng)該規(guī)劃多少留白，包括經(jīng)驗(yàn)老道的設(shè)計(jì)師或許也很茫然。今天臨沂網(wǎng)站建設(shè)-科海網(wǎng)絡(luò)就分享下關(guān)于網(wǎng)頁(yè)留白的內(nèi)容。

留白，另一說(shuō)為“負(fù)空間”，這兩個(gè)詞常?；Q使用。它們共同所指的都是屏幕中出現(xiàn)的元素之間的一種關(guān)系。所謂留白不一定是要白色，或黑色。就算是圖案、色彩或紋理背景都可以被稱為留白。負(fù)空間是在內(nèi)容外創(chuàng)造一個(gè)空白的環(huán)境，好讓觀者將注意力更加集中于內(nèi)容。

在此，我們將討論，設(shè)計(jì)師怎樣運(yùn)用錦囊妙招中的超強(qiáng)致勝工具：留白。  

留白的原因
 

就像已經(jīng)被大家所討論過(guò)的，負(fù)空間一開(kāi)始是作為審美而不可或缺的一部分。
 

在網(wǎng)頁(yè)設(shè)計(jì)中，在哪里留白顯得更加重要?？梢赃@么說(shuō)，它決不僅僅處于視覺(jué)審美的需要，它得肩負(fù)更重要的角色，即在視覺(jué)審美與引導(dǎo)用戶之間達(dá)成完美平衡。而且，如果現(xiàn)在有一段文字，留白還需在此基礎(chǔ)上讓文字清晰，創(chuàng)造具有可讀性的環(huán)境。

總的來(lái)說(shuō)，留白直接的影響如下。

1、眼球掃描

在網(wǎng)頁(yè)中，兩塊較大內(nèi)容元素之間的空間（在此稱大空間），這類留白能吸引并引導(dǎo)用戶的眼球掃描頁(yè)面的方式。當(dāng)運(yùn)用得當(dāng)，就能引導(dǎo)用戶的視線去注意那些你想突顯的元素。這在品牌標(biāo)識(shí)展示或增加用戶交互行為的時(shí)候最為有效。

2、清晰度

在兩個(gè)較小的內(nèi)容元素之間的空間（在此稱小空間）諸如一個(gè)文字，或一行文字，列表，圖標(biāo)等，恰當(dāng)?shù)牧舭滓材茏屵@些元素更加易于辨認(rèn)。

3、視覺(jué)審美

當(dāng)你看到一張大圖片，留白在視覺(jué)審美中發(fā)揮了很大的作用。舉例來(lái)說(shuō)，如果內(nèi)容亂七八糟絕不會(huì)是一張好看的圖片。

4、高品位

豐富的留白將為你的頁(yè)面灌注一種精致優(yōu)雅高大上的氛圍。

為了更好的理解和運(yùn)用它，我們將要梳理不同類型的留白（大空間和小空間），以及運(yùn)用它們的不同的方法（被動(dòng)和主動(dòng)）。

大空間和小空間

網(wǎng)頁(yè)設(shè)計(jì)中，在哪里運(yùn)用以及怎樣運(yùn)用負(fù)空間將取決于它們的角色。簡(jiǎn)言之，我們把這些角色大致分為大元素和小元素。

1、大元素的留白

大元素的留白是涉及到兩個(gè)大型元素之間的留白。主要運(yùn)用于：

總體內(nèi)容

獨(dú)立的不同元素

文本分列

Margin

Padding

圖片之間的距離

譯者注：這里的Margin和Padding指的是網(wǎng)頁(yè)設(shè)計(jì)中元素標(biāo)簽外部范圍的區(qū)域。參考下圖可以幫助理解。

這類型的留白空間很大程度影響用戶的視覺(jué)流，不管是潛在引導(dǎo)或者強(qiáng)勢(shì)推動(dòng)都可以讓注意力引導(dǎo)到你想要他們停留的地方。但在此要強(qiáng)調(diào)的一個(gè)法則即是距離越大動(dòng)力越強(qiáng)。想要打破平衡，然而，由于太多的留白違反了格式塔原則，其結(jié)果就是消弱了對(duì)象間的關(guān)系。

讓我們看看下面這個(gè)網(wǎng)站，以此作為例子來(lái)說(shuō)明留白是如何誘發(fā)用戶交互行為。

大多數(shù)用戶首先都會(huì)注意到頁(yè)面標(biāo)題，也就是“Digital art&Experiments”這句話，而在它外圍的則是大面積的留白，這樣就使得用戶的注意力完全集中于此。

盡管頁(yè)面的頂部和底部只有一側(cè)留白，但它們也同樣可以引起注意?？偠灾诖?，留白的區(qū)域很好發(fā)揮了吸引注意力的作用，而設(shè)計(jì)也就似乎看上去不可思議的簡(jiǎn)潔起來(lái)。

設(shè)計(jì)師實(shí)際上是采用留白區(qū)域作為一個(gè)空白幕布，以便給觀眾留下驚喜，好讓我們可以看到他的作品的豐富細(xì)節(jié)。一旦鼠標(biāo)移動(dòng)到底部導(dǎo)航的任一欄目時(shí)，幕布上就會(huì)出現(xiàn)作品的圖片作為背景全屏展示。這種效果創(chuàng)造出類似年幼時(shí)的一種探索和發(fā)現(xiàn)的樂(lè)趣：無(wú)意間闖入一片空白的場(chǎng)所，發(fā)現(xiàn)了每個(gè)抽屜都藏匿著豐富多彩的視覺(jué)盛宴。

你可以試試鼠標(biāo)滑過(guò)時(shí)屏幕上發(fā)生的戲劇性效果。

通過(guò)留白區(qū)域作為工具來(lái)誘導(dǎo)用戶注意到他的作品，設(shè)計(jì)師創(chuàng)造出了一種新鮮奇特的體驗(yàn)。在第一個(gè)作品出現(xiàn)后，我們就很想看看他還有哪些佳作。這感覺(jué)蠻吸引的，因?yàn)槟銓?huì)抑制不住地想要找到最為重要的內(nèi)容。但這都要建立在一個(gè)完美的點(diǎn)燃你好奇的切入點(diǎn)基礎(chǔ)上。