如何在網頁設計中使用留白

發佈時間：2014-09-02
瀏覽次數：3391次

說起留白，很多奢華品牌網站都邪魅一笑：悄悄地用著，出聲的不要。哼哼，偏偏不讓你得逞，今天從事網站建設的時代互聯小編就從留白的用色、可讀性、搜索流暢度等方面跟童鞋們分享了留白的使用技巧。

時代互聯：所謂留白，有時也稱作負空間，兩者是同一個概念。盡管這個術語尤其指留“白”，但它所指的區域並不一定要是白色的。它只是網頁布局中環繞各元素的空白空間。

這樣的空間體現爲多種不同形式，例如圖片、圖表、縫隙、外邊距、列甚至一行行文字之間的空間。盡管它似乎“空無一物”，裏面沒有任何其他設計元素占據一席之地，但我們不應該如此看待它。視之爲“無物”，也許打造美感與表現力的機會就流失了。

時代互聯認爲，處理得當的話，留白確實可以爲網頁設計帶來大量的益處。不應減少網頁設計中的留白，相反，應該增加網頁中的負空間。一些知名的大衆品牌已經在朝這個方向前進，更多的設計師們也在追隨他們的腳步。

更多的留白，等同于更奢華的品牌與網站

客戶往往要求設計師盡可能用盡網頁裏的空間，因爲網頁中的空間是昂貴的，只有有限的屏幕來展示信息。無論如何，反其道而行之——增加留白——促使設計師在更嚴格約束的空間中，打造更加光鮮的品牌信息。
另外，大家會覺得，留白更多的網站，它的內容比屏幕空間更重要。所以，品牌也顯得更盡奢華，因爲它犧牲了更多屏幕空間，反而將焦點彙聚在內容信息上。
奢華的品牌了解這層隱喻，通常都使用更多留白來達到這一確切效果。舉個例子說，PotteryBarn是個知名的高檔家具零售商，它的網站很聰明地使用了留白，恰恰反映了這一點。留白支配了主頁，頁面旁邊大片的留白，更好地將訪問者的注意力集中在頁面中間的交易與促銷信息上。甚至頁面頂部的品牌名稱本身，也在字符之間慷慨地運用了留白。

留白提升搜索流暢度

兩大搜索引擎谷歌和雅虎，诠釋了留白簡潔有效，這個簡單的例子再適合不過了。
Google准確地理解了一點，正在搜索某個話題的用戶，不想被嘈雜的背景和廣告分散注意力。因此，留白支配了整個Google搜索引擎頁面，實際搜索框只占據頁面中央窄窄一絲空間。類似的，Yahoo搜索也體現了使用留白的妙處。雖然這個頁面頂部有長長一條菜單欄，理念還是相同的：大量的留白，使用戶專注于搜索，別無他物。

可讀性和易讀性得到應有的大幅提升

時代互聯小編覺得，用好留白，任何網站的可讀性與易讀性都會得到改善。如果一個頁面上的文字過于擁擠，它就會妨礙舒適的閱讀體驗，從而阻礙整體用戶體驗。更多的留白使文字更易浏覽，從而提升閱讀體驗，也更易理解。
留白也可以用于不同內容區塊之間，不只是爲了提升閱讀體驗，也爲了將內容分隔成不同部分，使得信息的吸收更加專注。

搜索

Document

產品推薦

我的購物車

用戶登入