喪心病狂十六夜貓：幾何圖案與全屏背景圖結(jié)合、灰色的高級用法、色彩疊加... 這篇總結(jié)的這5個網(wǎng)頁設(shè)計趨勢，其實在年底就初現(xiàn)端倪，所以2017年大面積運用幾乎勢在必行，想不落人后記得打開閱讀喲。

最全面的設(shè)計風(fēng)格：《沒靈感？這里是最全的15個設(shè)計風(fēng)格總結(jié)！》

趨勢系列：

1. UX設(shè)計丨《2017年即將流行的9大UX設(shè)計趨勢》
2. 前端技術(shù)丨《騰訊工程師：2017年前端領(lǐng)域可能迎來的6個發(fā)展趨勢》
3. UI設(shè)計丨《趨勢丨8個你需要知道的2017年UI設(shè)計流行趨勢》
4. 硅谷設(shè)計師的預(yù)言丨《2017年，這五條設(shè)計趨勢將驚艷整個設(shè)計圈》
5. 為什么你不適合看趨勢文丨《自學(xué)丨從零基礎(chǔ)新手到高級UI/UX設(shè)計師的階段心路分享》

?01. 幾何圖案與全屏背景圖相結(jié)合

全屏背景圖的設(shè)計，是最受歡迎的背景風(fēng)格之一，利用大圖將用戶的視線集中是最合適不過的了。在多數(shù)情況下，利用全尺寸圖像作為主頁的背景，文字和導(dǎo)航菜單，CTA按鈕或信息等會布置在圖像的頂部。

如果想實現(xiàn)更有趣的視覺效果，我們可以在圖上使用重疊幾何圖案的技術(shù)。設(shè)計師可以添加各種各樣簡單的樣式和形狀。

做好這項工作，就要記住目的是利用幾何圖案。視線集中的幾何圖案重疊的部分，如果能促使用戶進(jìn)行特定的行為就更好了。在黑色或黑暗系等沉重的背景之中加上顏色，將會起到非常棒的引導(dǎo)視線的作用。

02. 灰色的運用

?加入少許灰色，你可以很輕松的在網(wǎng)頁上實現(xiàn)簡約風(fēng)格。作為平凡的白色背景的代替，在背景上加入淡灰色的網(wǎng)頁正在逐漸增加。

灰色背景最棒的地方就是：不管色彩多么豐富，不管是暖色還是冷色的圖片都能很好的表現(xiàn)出來，在品牌顏色或圖像周圍使用灰色與之調(diào)和也能給人留下不錯的印象。還有，在平面的色彩上使用淡黑的灰色作為陰影也是很不錯的。（如圖2）

不管你選擇怎樣的顏色與灰色配合，你都要記住他們的工作都是幫助用戶去感受顏色。例如上述中的例子 Paul Valentine ，與淡粉色相組合給人一種柔和的印象，而投資組合網(wǎng)站 S.Dallyn 則表現(xiàn)出一種現(xiàn)代的氛圍。

03. 重疊鮮艷的色彩

?在圖層上重疊幾何圖案作為背景，使用色彩元素也可以實現(xiàn)相同的效果。選擇鮮艷的配色，對于背景設(shè)計來說可是非常大膽而又獨特的。

通過這些顏色的背景，將用戶引導(dǎo)至設(shè)計全體，添加了具有視覺效果關(guān)注點的同時創(chuàng)造出了留白空間，能夠達(dá)成一舉多得的效果。

04. 采用非對稱的設(shè)計

?讓我們不使用網(wǎng)格來布局吧。（或者至少嘗試一下調(diào)整為左右不對稱。）

背景設(shè)計并不需要完全的對齊每一個要素、圖案。此外，他也沒有必要是純色或者圖案。

將網(wǎng)頁設(shè)計所需要的要素組合起來，圍繞左右不對稱來平衡它們。例如在上述案例 Nap Luxury GuestHouse 中，畫面被整個背景圖所充滿，僅在右側(cè)留有少許留白。還有在 CMMNTY 中，文字文本破壞了空白空間的平衡，將用戶的視線強制性的轉(zhuǎn)移到文字上來了。還有在 vase 這個案例中，在特大的商品圖案上，仔細(xì)斟酌文字文本放置的位置使得設(shè)計整體十分出眾。

05. 抽象效果與抽象藝術(shù)設(shè)計

??在做背景設(shè)計時想法有時也會不切實際，在那種時候就來試試抽象設(shè)計吧。顏色、形狀、和一些小花樣而組合起來，表現(xiàn)出與別人不一樣的有趣的視覺效果。

在做網(wǎng)頁設(shè)計的時候，與其他的作品有著視覺上的差異是非常重要的，引起用戶的興趣抱著“這是什么？”這樣的想法來點開網(wǎng)頁是必要的。設(shè)計與別人相似的情況下，用戶也沒有什么理由來訪問你的網(wǎng)站了。

將看起來漂亮的設(shè)計時刻掛在心上。將有魅力的文字一起組合起來，去享受設(shè)計的樂趣吧。大膽的將嘗試別人所有沒有使用過的有趣的想法運用到實踐中吧。

后記

你的網(wǎng)站是否使用了老舊的，過時的背景風(fēng)格呢？

那個時候，重新設(shè)計一個更具現(xiàn)代感的背景風(fēng)格會讓你的網(wǎng)站變得更棒。參考介紹的這些案例，讓每一次設(shè)計都變得不同，多嘗試一些具有創(chuàng)意的風(fēng)格吧。

趨勢系列：

1. UX設(shè)計丨《2017年即將流行的9大UX設(shè)計趨勢》
2. 前端技術(shù)丨《騰訊工程師：2017年前端領(lǐng)域可能迎來的6個發(fā)展趨勢》
3. UI設(shè)計丨《趨勢丨8個你需要知道的2017年UI設(shè)計流行趨勢》
4. 硅谷設(shè)計師的預(yù)言丨《2017年，這五條設(shè)計趨勢將驚艷整個設(shè)計圈》
5. 為什么你不適合看趨勢文丨《自學(xué)丨從零基礎(chǔ)新手到高級UI/UX設(shè)計師的階段心路分享》

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：yuan@uisdc.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國內(nèi)人氣最高的網(wǎng)頁設(shè)計師學(xué)習(xí)平臺，專注分享網(wǎng)頁設(shè)計、無線端設(shè)計以及PS教程。
【特色推薦】
設(shè)計師需要讀的100本書：史上最全的設(shè)計師圖書導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計微博：擁有粉絲量180萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計 ，歡迎關(guān)注獲取網(wǎng)頁設(shè)計資源、下載頂尖設(shè)計素材。
設(shè)計導(dǎo)航：全球頂尖設(shè)計網(wǎng)站推薦，設(shè)計師必備導(dǎo)航：http://hao.uisdc.com