什么是空白？
空白是中國(guó)藝術(shù)作品創(chuàng)作中常用的一種技法。一些藝術(shù)大師，如畫家，往往是空白的大師。在他們看來，白色空間具有很高的審美價(jià)值，可以給觀眾留下想象空間，達(dá)到“無贏”、“此時(shí)無聲勝音”。在你的網(wǎng)站上使用空白可以產(chǎn)生類似的效果。網(wǎng)站中的空白，又稱負(fù)空間，是指在空白處合理安排各種設(shè)計(jì)元素，實(shí)現(xiàn)頁(yè)面布局的干凈細(xì)膩。然而，很多人經(jīng)常陷入一個(gè)陷阱，認(rèn)為空白是為了讓你的網(wǎng)站的某個(gè)區(qū)域變白。白色并不意味著白色，它意味著白色，這是一種沒有裝飾的狀態(tài)，沒有額外的元素（下圖中的灰色區(qū)域也是白色的）。它可以采取多種形式，包括圖片、圖表、邊距、列，甚至單詞之間的空格。
如何在響應(yīng)性網(wǎng)站建設(shè)上留下空白？
響應(yīng)式網(wǎng)站建設(shè)的[敏感詞]特點(diǎn)之一是，在適應(yīng)計(jì)算機(jī)屏幕的同時(shí)，它們?cè)谑謾C(jī)等小屏幕上表現(xiàn)良好。網(wǎng)站上的空白是否合適，取決于它能否滿足不同設(shè)備的需求，主要是手機(jī)。以下建議正是基于此。
重置導(dǎo)航菜單
導(dǎo)航菜單是您在構(gòu)建網(wǎng)站時(shí)遇到的[敏感詞]個(gè)設(shè)計(jì)挑戰(zhàn)之一，但很少有設(shè)計(jì)師將導(dǎo)航菜單與空白區(qū)域結(jié)合起來。實(shí)際上，在導(dǎo)航菜單中也應(yīng)該注意空格。這是因?yàn)槿绻麤]有足夠的空白導(dǎo)航菜單，網(wǎng)站上顯示的小屏幕上，極有可能會(huì)出現(xiàn)菜單欄斷線（尤其是在橫導(dǎo)航菜單的情況下），效果不佳的視覺體驗(yàn)，此外，移動(dòng)用戶還容易點(diǎn)擊on單擊菜單項(xiàng)時(shí)出錯(cuò)，將影響用戶的操作體驗(yàn)。
如何使導(dǎo)航菜單為空？如果導(dǎo)航菜單欄上有太多的選項(xiàng)，而這些選項(xiàng)實(shí)際上是不可用的，我們可以使用隱藏的菜單，例如漢堡圖標(biāo)，來給網(wǎng)站足夠的空間。但是，在使用隱藏菜單之前，我們可以對(duì)導(dǎo)航菜單進(jìn)行一些設(shè)置，以便在不同的設(shè)備上以最合適的方式顯示它。
在fla的情況下，當(dāng)顯示在桌面上時(shí)，它會(huì)顯示一個(gè)類似于上面所示的并排導(dǎo)航菜單，而在一個(gè)小屏幕設(shè)備上，左側(cè)導(dǎo)航菜單隱藏在漢堡圖標(biāo)中，給用戶足夠的空間。此外，你可以看到，左邊的菜單選項(xiàng)之間有一定的距離，設(shè)計(jì)師特意添加了這些選項(xiàng)，以方便用戶在小屏幕設(shè)備上點(diǎn)擊和使用手勢(shì)。
Dorigati的導(dǎo)航菜單比佛羅里達(dá)州的網(wǎng)站要復(fù)雜一些。當(dāng)用戶在電腦等大屏幕上導(dǎo)航時(shí)，導(dǎo)航菜單在網(wǎng)站上水平排列。如果屏幕較小，導(dǎo)航菜單將以兩行（如上圖所示）的形式呈現(xiàn)給用戶，有些光柵化；當(dāng)站點(diǎn)需要調(diào)整到960px斷點(diǎn)時(shí)，導(dǎo)航菜單的布局將從水平變?yōu)榇怪?，出現(xiàn)在站點(diǎn)的側(cè)面，一個(gè)標(biāo)志會(huì)相應(yīng)地改變位置。如果斷點(diǎn)較小，則導(dǎo)航菜單將隱藏在漢堡圖標(biāo)中并顯示在頁(yè)面頂部。這種方法聽起來很乏味，但它是一個(gè)實(shí)用的解決方案，允許網(wǎng)站為不同設(shè)備的用戶提供自然、友好的瀏覽體驗(yàn)，同時(shí)確保適當(dāng)?shù)目瞻住?
注意垂直空白
過去，在為電腦桌面設(shè)計(jì)網(wǎng)站時(shí)，我們常常注意網(wǎng)站上不同元素的水平間距。但當(dāng)我們開始為響應(yīng)站點(diǎn)安排空白時(shí)，我們應(yīng)該更加注意元素的垂直方面。那是因?yàn)槭謾C(jī)的屏幕通常是垂直的。如果不注意元素在垂直方向的間距，會(huì)影響手機(jī)等小屏幕上各種元素的顯示，影響視覺效果。此外，垂直空白（white space）的數(shù)量在某種程度上決定了網(wǎng)站在移動(dòng)設(shè)備（如手機(jī)）上加載的速度。讓栗子證明吧！
顯示了手機(jī)屏幕上的jisc站點(diǎn)，由于設(shè)計(jì)師在字體、圖像和其他元素之間留出了空間，因此看起來很舒服。jisc網(wǎng)站在電腦桌面上出現(xiàn)的時(shí)候有很多橫向的導(dǎo)向塊，實(shí)際上在共享服務(wù)[敏感詞]，行業(yè)交易是一種平行關(guān)系，在電腦屏幕上呈現(xiàn)的是一個(gè)橫向的方向，但設(shè)計(jì)師不僅注重橫向間距，同時(shí)考慮到網(wǎng)站在小屏幕上垂直渲染的習(xí)慣，使得較高的網(wǎng)站更清晰可讀。
網(wǎng)站上的空白也可以用來劃分不同的區(qū)塊，給用戶一些喘息的空間。mashable的博客使用負(fù)空間來實(shí)現(xiàn)這一點(diǎn)。mashable的計(jì)算機(jī)顯示三列：small+text、medium+text和large+text，這在手機(jī)上看起來很糟糕。不過，設(shè)計(jì)師們考慮到了手機(jī)的垂直屏幕，在不同的元素垂直方向留下了足夠的空間，使得不同文本塊之間的邊界清晰可見，界面看起來也更簡(jiǎn)單。
因此，在空白問題上，我們?cè)O(shè)計(jì)一個(gè)響應(yīng)站點(diǎn)記住不要總是從元素的水平方向開始，也要考慮更多不同元素和不同間隔和距離的塊在垂直方向上，所有元素在小屏幕上都是畢竟，傾向于顯示垂直的，從而起到真正的白色空間中反應(yīng)位點(diǎn)的作用。
字體和間距
響應(yīng)網(wǎng)站建設(shè)上的空白處也需要注意文本的字體。除了改變字體大小，我們還可以調(diào)整行高、間距、顏色，甚至兩個(gè)文本塊之間的距離，使文本更容易閱讀，使圖片看起來更和諧。
在網(wǎng)頁(yè)上顯示的計(jì)算機(jī)標(biāo)題與導(dǎo)航菜單之間的空白區(qū)域比較大，但當(dāng)在移動(dòng)設(shè)備上顯示時(shí)，空白區(qū)域縮?。ㄒ妶D表），下頁(yè)眉下文字字體少，段落間距在底部文字有所擴(kuò)大，下一步是根據(jù)合理利用白色空間的特點(diǎn)。
agra文化也是如此，在計(jì)算機(jī)上顯示時(shí)，每個(gè)圖像上的單詞都會(huì)掛起。但由于懸浮在手機(jī)等設(shè)備上不起作用，agra文化果斷地放棄了在小屏幕上的懸浮，允許文本直接出現(xiàn)在圖像的中心。雖然這個(gè)變化不是很大，但它保證了用戶的舒適體驗(yàn)。
調(diào)整圖片大小
響應(yīng)性設(shè)計(jì)中經(jīng)常涉及的一個(gè)大問題是圖形。當(dāng)在網(wǎng)站上使用空白時(shí)，我們還需要考慮圖像是如何放置的。由于大多數(shù)顯示器都是寬屏的，許多網(wǎng)站都使用寬屏圖像。這也意味著在移動(dòng)設(shè)備上顯示圖像時(shí)，我們需要縮小圖像或重新定義圖像大小?？纯碵敏感詞]的栗子能不能給你一些啟發(fā)！
當(dāng)upp Broadgate Park站點(diǎn)顯示在桌面上時(shí)，它會(huì)在主頁(yè)上顯示一個(gè)幻燈片，當(dāng)設(shè)備的分辨率低于500px時(shí)，它會(huì)顯示一個(gè)拉長(zhǎng)的圖像（如下所示）。雖然圖片較長(zhǎng)，但設(shè)計(jì)師仍然注重垂直方向的空間，并刪去不必要的元素，使網(wǎng)站看起來更簡(jiǎn)單、更清晰。很難做到這一點(diǎn)，因?yàn)槟阈枰缊D像的大小和每幅圖像的實(shí)際價(jià)值，才能正確地重新定義圖像的大小，但如果你愿意付出努力，小菲認(rèn)為這是值得的。
金島是另一個(gè)故事。網(wǎng)頁(yè)設(shè)計(jì)師認(rèn)為電腦桌面上的幻燈片在移動(dòng)設(shè)備上沒有多大意義，所以為了清晰起見，他們會(huì)將其隱藏起來。同時(shí)，將水平導(dǎo)航菜單垂直排列在兩列中，以填充空間并防止網(wǎng)站顯示為空。
很多設(shè)計(jì)師認(rèn)為網(wǎng)絡(luò)空間是有限的，認(rèn)為通過有限的空間盡可能多地傳達(dá)更多的內(nèi)容才是王道。事實(shí)上，更多的內(nèi)容對(duì)用戶未必是好事，但可能會(huì)對(duì)用戶造成干擾。我們?cè)谧?a href="http://www.kgky02.com/" target="_blank">響應(yīng)式網(wǎng)站建設(shè)的時(shí)候要記住少即是多，要學(xué)會(huì)利用白色的空間給網(wǎng)站帶來獨(dú)特的美和強(qiáng)大的表現(xiàn)力。在你的響應(yīng)網(wǎng)站上使用空白！
