為了在競爭中脫穎而出，許多網(wǎng)站管理員正在探索獨(dú)特的網(wǎng)站布局設(shè)計(jì)。事實(shí)并非如此，空間共享網(wǎng)頁布局開始興起，它指的是一種排版設(shè)計(jì)，它允許網(wǎng)站上的元素跨越不同的塊并實(shí)現(xiàn)空間共享。這個概念可能聽起來很復(fù)雜，但很容易識別，例如文本區(qū)域的文本區(qū)域延伸跨越圖像或補(bǔ)丁區(qū)域，共享其他組件的空間。這種共享的網(wǎng)頁布局簡單而有效，它可以填滿整個網(wǎng)站。它還可用于攜帶大量創(chuàng)意設(shè)計(jì)，以創(chuàng)建一個引人注目的網(wǎng)站。那么我應(yīng)該如何在網(wǎng)站上使用這種類型的網(wǎng)頁布局？小飛將介紹什么是共享空間類型的網(wǎng)頁布局以及如何使用空間共享網(wǎng)頁設(shè)計(jì)。

　什么是空間共享式網(wǎng)頁排版?

許多人認(rèn)為空間共享網(wǎng)頁布局是分屏設(shè)計(jì)的延伸。然而，與明確定義的分屏設(shè)計(jì)相比，空間共享網(wǎng)頁布局的核心是元素與其他元素共享空間，元素可以跨越多個層或塊，有時甚至元素重疊。這種布局布局有兩個優(yōu)點(diǎn)。一方面，網(wǎng)頁元素相互區(qū)分（具有分屏設(shè)計(jì)的特點(diǎn)），關(guān)鍵信息結(jié)構(gòu)清晰，有助于用戶更好地理解網(wǎng)站的重要內(nèi)容。另一方面，網(wǎng)頁的元素融合在一起，兩個矩形卡片樣式相互連接，這樣可以更好地?cái)y帶元素，尤其是文本元素（突破分屏設(shè)計(jì)的局限性）。除了用于網(wǎng)頁設(shè)計(jì)之外，空間共享網(wǎng)頁布局還可以用于海報(bào)或明信片設(shè)計(jì)中以發(fā)展其自身的光和熱。

在空間共享網(wǎng)頁布局中，跨越多個塊的元素可能是顯而易見的或微妙的。下圖是Hometown Trolley網(wǎng)站的主頁，該網(wǎng)站使用了空間共享網(wǎng)頁布局。右側(cè)文本的行延伸到左側(cè)的圖片，將用戶的視覺引導(dǎo)到圖片上，而左側(cè)車輛的后視鏡嵌入右側(cè)的文本塊中，兩側(cè)的元素共享空間。這種分享是微妙和細(xì)致的，使頁面看起來特別協(xié)調(diào)。

下面是空間共享式排版的一些應(yīng)用方式：

　　混搭圖片和文字

在空間共享排版中，圖片和文本mashup是最經(jīng)典的設(shè)計(jì)。許多設(shè)計(jì)師更喜歡在共享排版中使用垂直方向的圖像（這種類型的圖像通常不常用于網(wǎng)站，因?yàn)榇蠖鄶?shù)設(shè)備屏幕都是水平的）。在這種排版樣式中，文本的應(yīng)用是完全免費(fèi)的。它可以存在于圖片或空白區(qū)域，也可以在每個區(qū)域單獨(dú)使用。圖片和文本的混搭通常會給用戶留下令人印象深刻的視覺效果。

Square Apartments網(wǎng)站是栗子。它在首頁上使用空間共享排版方法。上面的標(biāo)題跨越圖片和文本塊，而下面文本的細(xì)節(jié)是分開的，并顯示文本和圖像的屬性。圖片和文字混合的方式也有好處。由于文本需要跨越不同的區(qū)域，因此顏色匹配不需要完全統(tǒng)一，并且調(diào)整文本周圍的背景顏色。這種設(shè)計(jì)簡單易用。這也是在空間共享排版中學(xué)習(xí)的最簡單的方式。

選用大膽的字體

在空間共享布局中使用有趣且獨(dú)特的文本也是一個不錯的選擇。不同塊的大膽?yīng)毺刈煮w不僅帶來獨(dú)特的視覺體驗(yàn)，還可以創(chuàng)建頁面重心而不會降低焦點(diǎn)。

如果在空間共享排版中使用粗體，獨(dú)特的字體，請記住選擇有趣且顯眼的字體，并且應(yīng)用程序文本不應(yīng)太短。另外，圖像和背景顏色應(yīng)該是一致的，字體和兩者應(yīng)該用顏色對比，這樣可以在整個頁面上更容易地讀取字體?？勺x性是此設(shè)計(jì)方法中最重要的一點(diǎn)。通常，文本部分建議使用黑色或白色字體。盡管許多用戶發(fā)現(xiàn)它很簡單，但它們可以平衡圖像，背景和文本的顏色。該系統(tǒng)實(shí)際上非常麻煩。

色塊和文本組合

早些時候我們說圖像和文本mashup是最經(jīng)典的空間共享排版方式之一。但是，如果您的網(wǎng)站主頁上沒有圖片，您還可以使用空間共享設(shè)計(jì)。這時，我們不得不問顏色塊和幾何圖形。顏色塊或幾何圖形和文本也可以顯示非凡的視覺。影響。

Startup Lab的網(wǎng)站以極其時尚的方式結(jié)合了色塊和文本，創(chuàng)建了幾個層，使頁面完整和完整。清晰的陰影字體不僅突出了它作為主體的狀態(tài)，而且還與輔助字體形成了良好的對比。合理的色彩匹配也使整個網(wǎng)站視覺上舒適，并可以為用戶提供不同的瀏覽體驗(yàn)。

　結(jié)合動畫效果

使用空間共享排版并不意味著您不能使用其他設(shè)計(jì)技術(shù)，例如運(yùn)動，您可以很好地結(jié)合它。在用戶界面或?qū)Ш巾?xiàng)中使用動畫效果使用戶可以輕松了解您的設(shè)計(jì)并鼓勵用戶與頁面進(jìn)行交互。當(dāng)有更多頁面元素時，微妙的效果也可以創(chuàng)建視覺焦點(diǎn)。

在“瓶中消息”網(wǎng)站中，主頁中間的圓形徽標(biāo)將緩慢旋轉(zhuǎn)。在這個不對稱的頁面中，它是當(dāng)之無愧的視覺焦點(diǎn)。它填補(bǔ)了圖片和文本之間的空白，使整體設(shè)計(jì)更加完整和平衡。動畫效果將使您對品牌的印象更加深刻。

　簡約設(shè)計(jì)

在大多數(shù)情況下，極簡主義設(shè)計(jì)非常有效。雖然您可能認(rèn)為這是陳詞濫調(diào)，但簡單的設(shè)計(jì)通常可以完美地避免復(fù)雜設(shè)計(jì)所面臨的問題，并且高效的直接布局設(shè)計(jì)更有效。如果您認(rèn)為以前的空間共享設(shè)計(jì)方法過于復(fù)雜，您可能需要選擇一種簡單的排版方法，這種方法非常直觀并且可以吸引用戶的注意力。

Melviie網(wǎng)站采用最簡單的簡約布局框架，使用黑色文本和白色背景使中間圖像成為視覺焦點(diǎn)。如果您不知道從哪里開始，您可以學(xué)習(xí)以這種方式設(shè)計(jì)空間共享布局！

在空間共享網(wǎng)頁中，排版設(shè)計(jì)，圖像和文本等元素的格式可能看起來更現(xiàn)代，但它并不比傳統(tǒng)的設(shè)計(jì)技術(shù)復(fù)雜得多?？臻g共享設(shè)計(jì)方法允許用戶經(jīng)常忽略的頁面中的元素與其他元素具有更多交叉，允許頁面內(nèi)的元素“交互”。

來到起飛頁自助網(wǎng)站（http://www.qifeiye.com/?t_wd=a5）成為一個快速響應(yīng)的網(wǎng)站！

« 企業(yè)網(wǎng)站建設(shè)在線促銷。不要忽略這一點(diǎn) | 黑玫瑰高端禮服和360shop微信發(fā)行開啟微商時尚新時代 »