2015年值得關注的21個網頁設計趨勢

 

網頁設計發展很快，它主要是跟著設計潮流以及Web技術一起演變。從純文字的網頁到FLASH、然後現在流行的HTML5網站都有著很大的變化。網站可以有很多用途，比如用企業網站宣傳、社交、博客、營銷、個人品牌展示以及提供在線工具和服務等等，真是個多樣化而且充滿活力的行業。

回顧我們之前分享過的“優秀網頁設計”作品，裡面有很多新的設計靈感，並可能從中預測到2015的設計趨勢。在這篇文章中我們整理了值得關注的21個網頁設計趨勢。

 

這些趨勢主要由設計師Tomas Laurinavicius自身經驗研究整理，我們可以嘗試這些設計但也不一定要跟風，創新、實用、好用才是最重要的。

 

趨勢1：自然攝影

在2014年已有很多網站使用高品質的照片作為設計元素，優秀的照片視覺是非常有吸引力的，所以2015將會繼續這個趨勢走下去。而這趨勢特別適用於全屏網頁設計。
Brave People

瀏覽網址:http://bravepeople.co/

 

趨勢2：單色網站

網站設計元素的背景、文本顏色、圖像等都使用同一色系，這樣的單色網頁也許會更有吸引力，並讓訪客對你的品牌網站有著深刻的印象。

Nine Sixty

瀏覽網址:http://www.ninesixty.co.uk/

 

趨勢3：視頻背景網站

通過加入視頻背景到網站上，在視覺上比純圖像更有吸引力，2014年已經有不少這樣案例，相信明年會繼續增加。

其次不一定把視頻放在網頁背景上，我們也可以用在首頁幻燈片上也是很不錯方案。

BORN

瀏覽網址:http://www.borngroup.com/

 

趨勢4：獨特的導航菜單

網站導航不再那麼死板，將出現更多創意的方案，向下滑動、向上滑動、彈出、動態動畫、二次信息展示等有助於創造令人難忘的瀏覽體驗。

Impossible Bureau

瀏覽網址:http://www.impossible-bureau.com/

 

趨勢5：卡片式

像卡片、瓷磚的排版設計在2015會繼續流行，Pinterest是這種設計潮流的領導者，我們將看到更多博客和電子商務網站使用這具設計技術。

Firebox

瀏覽網址:http://www.firebox.com/

 

趨勢6：固定塊（Fixed Blocks）

固定塊像css 的fixed屬性，我們常見有導航菜單用這個技術，而在2014年，有些網頁上一些小部件也使用這個技術，但多用於邊欄上的內容。

PS 其次相關的Scroll to fixed技術也流行，不了解請看設計達人網站（PC版，手機看不到哦）右下角的廣告區域，當頁面Scroll到頂部後，廣告會懸停於頂部。

Build in Amsterdam

瀏覽網址:http://www.buildinamsterdam.com/

 

趨勢7：精緻的視差效果

2014年已經介紹過視差滾動這個技術，但遺憾的是，從用戶角度來看，過量的視差特效會毀掉整個瀏覽體驗。 2015年，將會有所改善，會有更多精緻的視差效果呈現。

Cher Am

瀏覽網址:http://www.cher-ami.tv/

 

趨勢8：垂直滑屏（滾動）

垂直滑屏相當於一個幻燈片將它全屏化，並且以垂直滑動動畫形式展示出來，這對於訪客來說是個新鮮友好的瀏覽體驗。特別適用於產品描述、情景營銷的單頁面網站。

Smart Water

瀏覽網址:http://www.drinksmartwater.com/#/home

 

趨勢9：增加插畫

Dropbox我想很多用戶聽過，該網站的手繪插畫佔居了網站的一大部分。通過可愛精美的插畫來展示描述。

One Design Company

瀏覽網址:http://onedesigncompany.com/

 

趨勢10：大數據 研究統計

大數據正在成為高新的技術行業，網頁設計也一樣重要，2015我​​們將看到更多交互圖形、圖表數據。複雜、未知但卻美麗和吸引。

Personal Brand Institute

瀏覽網址:http://personalbrandinstitute.com/

 

趨勢11：互動產品

我們知道在網頁上很難表達好一個有形的產品，特別是用戶無法觸感，無法真正感受。很多初創公司為了描繪出逼真感覺以及體驗，將在網頁上使用一些互動技術，比如3D展示，讓訪客能轉動產品來瀏覽產品更多微小的細節。

瀏覽網址:http://my.deejo.fr/

 

趨勢12：延續扁平化設計

扁平化可以說默認為大型科技公司以及設計師首要的設計風格，從WEB、APP上都能看到扁平化的影子，我們肯定在2015年這個趨勢將會延續。

Pennies

瀏覽網址:http://www.getpennies.com/

 

趨勢13：移動優先

隨著移動互聯網用戶的飛快增長，“移動優先”的想法將會增加。而響應式設計將會成為一個必須擁有的功能。所以以後設計網站都需要考慮到移動用戶的瀏覽體驗了。

Medium

瀏覽網址:https://medium.com/

 

趨勢14：更人性化

手繪插圖已被利用過一段時間了，為了讓訪客從外觀上感受到更人性化、親切感，可以嘗試在網頁上使用手寫字體或插圖，讓訪問者脫離沉悶的Web體驗，並加深對網站的印象。

Adventure

瀏覽網址:http://adventure.com/

 

趨勢15：微交互

我說的微交互是從設計上的一些小細節和互動上給用戶帶來驚喜和愉悅的體驗。如有趣的圖像、表情、表達文字。

如下面這個案例，當用戶輸入用戶名稱時，會提示“好名”，這用戶看到後會有什麼感覺？呵呵！

Virgin America

瀏覽網址:https://www.virginamerica.com/

 

趨勢16：幾何設計

你在學校學習幾何的時候也許覺得他是很乏味的，但如果能使用得當，將會有大不同哦。

Letters

瀏覽網址:http://letters-inc.jp/

 

趨勢17：大文字版式

在過去一年，我看已經看到不少使用大大的標題來排版，簡單、有力、有效！

Webflow

瀏覽網址:http://interactions.webflow.com/

 

趨勢18：網站生成工具增加

我們已經看到網站生成工具一直試圖取代設計師和程序員，比如在線網頁製作網站Generator, Squarespace, Macaw,Webflow 和Froont等，有的可以直接生成響應式網頁，功能確實強大。

Squarespace

瀏覽網址:http://squarespace.com/#alex

 

趨勢19：個人品牌

重視個人品牌，設計師、工程師、博客作者和企業家將在網絡上建立更強大的個人品牌網站，變得更具權威性和更容易找到本人。所以2015你將看到更多個性的個人網站出現。

Tobias van Schneider

瀏覽網址:http://www.vanschneider.com/

 

趨勢20：更多Material Design風格

Material Design由谷歌創造，是由扁平化設計中派生出來的風格，雖然現在還沒普及，但在未來一年絕對會增加。

Inbox by Gmail

瀏覽網址:http://www.google.com/inbox/

 

趨勢21：互動之旅

互動型網站將得到更多曝光，通過聲音、攝影像頭、麥克風來與訪客交互，讓用戶置身於現場的感覺，感受獨特和個性化的體驗。正如下面網站一樣：

Echoes of Tsunami

瀏覽網址:http://www.echoesoftsunami.com/

整體而言，這些趨勢當中扁平化設計、大文本排版和高品質圖像為主要的流行趨勢，這是令人興奮的，2015讓我們一起創造更多創新的設計作品出來吧！

---

文章出處:

https://designrockin.wordpress.com/
英文原文：http://designmodo.com/web-design-trends-2015/