中白頁(yè)的提示想要從用戶吸引足夠注意力的元素通常需要被周圍的空白區(qū)域引起。此設(shè)計(jì)可創(chuàng)建更優(yōu)雅的用戶體驗(yàn)。
今天，當(dāng)極簡(jiǎn)主義風(fēng)格成為主流時(shí)，“少即是多”是設(shè)計(jì)師視為標(biāo)準(zhǔn)的標(biāo)準(zhǔn)?？刂婆渖桨傅臄?shù)量，限制視覺(jué)元素的數(shù)量，并在明確的層面，呈現(xiàn)核心元素，抓住人們的眼睛，打擊核心。
這種設(shè)計(jì)非常依賴于空白區(qū)域，所以留空是很重要的。
白色空間不一定是白色，可以是任何其他顏色，另一個(gè)名稱留空是“負(fù)空間”。白色空間可以突出并突出視覺(jué)主體，這也是它的主要工作方式。
雖然白色空間看起來(lái)并不復(fù)雜，但在復(fù)雜多變的設(shè)計(jì)環(huán)境中，這通常不是一件簡(jiǎn)單的事情。優(yōu)秀的白色空間設(shè)計(jì)平衡了風(fēng)格的簡(jiǎn)潔性和功能的可用性，并且這需要相當(dāng)多的練習(xí)和積累。
在什么地方用留白
必須承認(rèn)，并非每個(gè)設(shè)計(jì)都需要大量空白。必須確定空白區(qū)域的使用范圍，并且空白區(qū)域的存在將對(duì)設(shè)計(jì)中的以下因素產(chǎn)生影響：
排版布局
圖像圖像
功能控制
文字內(nèi)容
保證金差距
Mark Boulton將白色空間分為兩種尺寸。
小白色空間是較小元素之間的小間隙，如下面元素周圍的白色空間是小白色：
鏈路
列表
圖標(biāo)
按鈕
文字段落
相反，當(dāng)處理相對(duì)較大的元素時(shí)，周圍的負(fù)空間是一個(gè)很大的空白。
正確使用白色空間可以為整個(gè)設(shè)計(jì)帶來(lái)平衡感。對(duì)于文本內(nèi)容，您會(huì)發(fā)現(xiàn)易讀性水平與小空白的控制密切相關(guān)，這對(duì)內(nèi)容的呈現(xiàn)有重要影響。
使用空白區(qū)有很多好處：
消隱可以增加內(nèi)容的可理解性。
消隱突出顯示特定的UI元素，主要是CTA元素。
可以使設(shè)計(jì)更整潔和友好。
Bear Creek Distillery
憑借形式和影響力以及引人注目的副本，Bear Creek Distillery可以輕松地從同行中脫穎而出。為了突出他們的“蒸餾技術(shù)”作為葡萄酒供應(yīng)商的核心競(jìng)爭(zhēng)力，設(shè)計(jì)師試圖盡可能減少可能分散注意力的因素，以便信息可以準(zhǔn)確，直接地傳遞給參觀者。
Squarespace
Squarespace設(shè)計(jì)者試圖限制他們?cè)诮缑嫔鲜褂玫腢I元素的數(shù)量，同時(shí)確保用戶可以訪問(wèn)足夠的信息。搜索框允許用戶輕松找到他們想要的信息，而復(fù)制設(shè)計(jì)的獨(dú)特性使品牌的音調(diào)得到放大。文本的字體顏色為黑色，與淺色背景形成對(duì)比，使閱讀和信息更容易。
Progressive Punctuation
如何用標(biāo)點(diǎn)符號(hào)來(lái)表達(dá)復(fù)雜的情感？漸進(jìn)式標(biāo)點(diǎn)符號(hào)此站點(diǎn)顯示這些“新”標(biāo)點(diǎn)符號(hào)。
與其他頁(yè)面的區(qū)別在于頁(yè)面需要攜帶許多不同的非標(biāo)準(zhǔn)標(biāo)點(diǎn)符號(hào)。為了準(zhǔn)確傳達(dá)信息，設(shè)計(jì)師巧妙地利用白色空間來(lái)控制符號(hào)之間的間距，以確保整體的優(yōu)雅。保證信息的溝通。
Apple
關(guān)于空白的設(shè)計(jì)，很難繞過(guò)Apple的經(jīng)典案例。雖然他們不是先鋒，但Apple已將此技能應(yīng)用于自己的產(chǎn)品設(shè)計(jì)和網(wǎng)站設(shè)計(jì)。
在他們的網(wǎng)站上，您將看到清晰的視覺(jué)上下文，頁(yè)面的每個(gè)部分都有清晰的視覺(jué)焦點(diǎn)，主要和次要，用戶永遠(yuǎn)不會(huì)迷失和分心。
Tinker
您可以在Tinker自定義您的手表。在網(wǎng)站上，您可以選擇手表的款式，顏色和裝飾元素。
為突出產(chǎn)品的可定制性，Tinker在本網(wǎng)站上可以看到的最明顯的視覺(jué)元素是分離的手表組件的清晰畫(huà)面。就像Apple的官方網(wǎng)站一樣，設(shè)計(jì)師不希望你的注意力分散注意力。事情已經(jīng)消失，減少了二次信息的顯示，從而增強(qiáng)了核心要素的呈現(xiàn)。只顯示必要的內(nèi)容，直接為您提供所需的一切——手表很好。
The Pisacco Chronicle
Pisacco Chronicle是一本致力于食品，電影和藝術(shù)的在線雜志，是大多數(shù)人非常喜歡的。
有趣的是，該網(wǎng)站使用寶麗來(lái)風(fēng)格的旋轉(zhuǎn)木馬來(lái)吸引人們。頁(yè)面上的標(biāo)題和導(dǎo)航非常吸引人，很大程度上是因?yàn)轫?yè)面上的元素確實(shí)沒(méi)有多少可以被注意到。如果文本內(nèi)容更多，則很難確保每個(gè)元素都清晰直觀。
沒(méi)有炫目的顏色和彈出的顏色組合，因此頁(yè)面上的圖像內(nèi)容沒(méi)有令人不快的原因。
Seedlip
這個(gè)品牌也是一個(gè)酒莊，但這次他們的網(wǎng)站推薦了軟飲料。這次飲料是基于一個(gè)新概念創(chuàng)建的，并且使用具有大量空白的網(wǎng)站是一個(gè)不錯(cuò)的選擇。
該網(wǎng)站還使用了大量空白來(lái)突出顯示信息。更重要的是，設(shè)計(jì)師還增強(qiáng)了瀏覽體驗(yàn)。當(dāng)用戶瀏覽時(shí)，高清飲料圖像將成為整個(gè)視覺(jué)的中心。為了增強(qiáng)品質(zhì)感，設(shè)計(jì)師可以讓用戶快速注意到品牌巴洛克風(fēng)格的華麗LOGO，而這種效果也離不開(kāi)空白的貢獻(xiàn)。
Pocket Penguins
Penguin一直以其出色的封面設(shè)計(jì)而聞名。大膽的文字和大膽的色彩是他們的特點(diǎn)，Pocket Penguins網(wǎng)站完美地延續(xù)了他們的品牌形象，允許用戶通過(guò)顏色和排版來(lái)注意他們的書(shū)籍。
Sweetgreen
這是一種用白色和彩色圖像吸引用戶的非常有效的方法，因?yàn)檫@兩者可以進(jìn)行比較。
特別是對(duì)于食品，在三種顏色中，顏色和視覺(jué)是第一個(gè)傳達(dá)給人們的。誘人的畫(huà)面是Sweetgreen吸引用戶的最強(qiáng)大武器，因此請(qǐng)盡可能多地保留照片以制作這些食物。
Jomor Design
當(dāng)您想要傳遞信息時(shí)，讓用戶專注于該信息是最有效的。如果用戶有這樣的消息，他自然不會(huì)錯(cuò)過(guò)它。
柔佛設(shè)計(jì)本網(wǎng)站一直致力于傳達(dá)清晰的信息。作為一個(gè)設(shè)計(jì)機(jī)構(gòu)，他們使用精心設(shè)計(jì)的副本來(lái)吸引你的注意力，“我想幫你踢屁股?！?（讓我?guī)椭愠蔀樽詈玫?。?/p>
如果頁(yè)面上有圖像，則不會(huì)注意到該段落，因?yàn)槲谋就ǔ](méi)有吸引力。
結(jié)語(yǔ)
巧妙地使用白色空間可以使您的設(shè)計(jì)足夠優(yōu)雅，您需要使用它來(lái)保持簡(jiǎn)單和直接。消除不必要的干擾并專注于提供關(guān)鍵信息，所有這些都需要空白參與。