海淘科技編者，為大家提供2017年最全面的網頁設計趨勢，并結合了大量優質案例，也想在這里分享給更多人。這篇文章有點長不過很易讀，希望大家看了能有所收獲~~
【文章目錄】
01 半扁平化設計
02 動態照片
03 更多的3D
04 動畫
05 登錄頁
06 幾何圖形，圖案，線條和圓
07 大膽的用色
08 創新滾動和視差
09 漸變色
10 移動瀏覽 (響應設計)
11 定制圖形和插圖
12 中性空間與網格的創造性運用
13 講故事
14 懶加載
15 拆分內容
16 全屏幕形式
17 視頻無處不在
18 SEO 很重要
19 隱藏導航
20 微小的細節設計
21 logo設計趨勢
22 字體設計趨勢
【正文開始】
設計趨勢受到媒體，技術，時尚行業和實用性的影響。一種趨勢的形成是緩慢而漸進的，它以這種方式滲透到設計的所有分支，然后再以同樣的方式消失。大體來說，一種設計趨勢的壽命不過一兩年時間。2017年的設計將繼續2016年出現的趨勢，同時增加一些新的影響，但這種感覺是眾所周知且熟悉的，你可能已經在過去幾年看到它。主要影響者仍然是谷歌的Material Design，并產生一些變化。
在過去的幾年里，扁平化設計統治了網頁設計市場，但現在，受Material Design的影響，它變得更加立體化。這種轉變始于一些輕柔的陰影，使其成為半扁平化設計。從極簡主義風格的扁平化設計演變以適應新發展的技術。扁平化設計仍在進行中，但已經經歷了一些改進。
輕柔的陰影增加了深度和復雜性，卻不會破壞扁平化設計的感覺。這是扁平化趨勢新增的一個特征，并將繼續在2017演進。
項目: Resourсe | UI/UX Tool for Web Services
作者: Ruslan Latypov; LS Graphics; Anton Mishin; Valery Gurkov
項目: Listener’s Playlist
作者: Anzi .
動態照片不是我們在網上常見的那種GIF。動態照片就是靜態的圖像中有少量的動態元素。這種技術通過賦予簡單的照片以生命，使其更貼近現實。
3D絕對是我們的方向，我們將看到它在所有設計領域的影響力。隨著VR / AR革命迅速建立勢頭，這個領域進步的相當快。
項目: LUV.IT
作者: AARON MARTINEZ
項目: Open Annual Awards
作者: TAVO
項目: Air Max ’17
作者: Berd -; Lukas Vojir; mark haley; Oliver Harris; Jeff Thomson
項目: NIKE F.C. | 3D Golden balls in the real world
作者: TAVO
項目: Better You Brand
作者: Craig Minchington; Satellite Office; Brand Nu
動畫越來越多的出現在網頁設計中，他們可以是gif，SVG，WebGL的CSS或視頻。動畫肯定是在去年的網頁設計趨勢中最大的事情之一，所以請毫不猶豫地使用它們。
項目: Nickelodeon Kids Pick The President
作者: JeanPierre Le Roux
項目: AR Virtual Fitness Coach App | AR 虛擬健身教練
作者: 曲 植Daz_Qu
項目: UI Collection in Motion
作者: Minh Pham
項目: ZH OURO- Rio 2016
作者: Leo Natsume; Guilherme Maron
在2017，我們將看到著陸頁的上升趨勢，這是由于它的市場營銷潛力和更好定位顧客的能力。
這一趨勢始于2016，并肯定會在2017延續下去。你可以通過添加一些現代化的幾何形狀來使你的網頁更加個性化，無論是扁平的或是帶有微投影的。
項目: Pfizer – Active and 50+ for The New York Times
作者: justyna stasik; Vladimir Marchukov
項目： DRAP.agency Branding
作者：Mireldy Design; Filip Gjurin
使用大膽的顏色來強調。大膽的色彩與Material design和扁平化設計相襯得如此完美?？梢允褂糜?Google 提供的調色板來選擇和搭配你想要的顏色。
項目: Edris – Logo Designed by MiLo
作者: Loredana Papp-Dinea; Mihai Baldean; Milo Themes
項目: Rendered — Responsive Demo Website for Adobe
Serge Vasil
項目: b2mach
作者: Natalia ?erko; Kuba Enzowski; Kommunikat Studio
這個視覺的主意很棒，它能將獨特的元素添加到任何網站。從多圖層視差到視頻視差，一切皆有可能。
看看D.ex Multilayer Parallax。這個產品是完全由 Milothemes在Loredana Papp和 Mihai Baldean的帶領下開發的。它在Envato Market / codecanyon.net上可以買到。
它是一個 WordPress 插件，能讓你用一個以上的圖層創建美麗的視差作品。勇于創新，以任何你想要的風格組合圖層。我們創建了12 個不同的例子，來引導你走向美麗的多層世界的第一步。來和圖層一起玩吧。
漸變色是現在最大的趨勢之一。開始于 2016 年，并隨后獲得迅速增長，像 Instagram這樣響當當的品牌，也決定將自己的logo從扁平單一的顏色變成多色漸變。從logo到按鈕或是圖片疊加層，這一趨勢無處不在。
移動瀏覽在2015 年和 2016年獲得了可觀的增長。超越了臺式機、 筆記本電腦，平板電腦和智能手機現在是瀏覽網站時的第一選擇，這種趨勢將繼續下去。任何不專注于響應設計的網站都需要盡快升級!
項目: Responsive Website Animation
作者: Muharrem Senyil
Stock photos仍然非常流行，但 2016 年出現了一個顯著增長的新趨勢，并將在 2017 持續發展： 使用定制的圖形和插圖。如果你想要一個讓訪客過目不忘的獨特網站，請聯系一個數字化設計師。所以，少用Stock photos，多用原創、獨特的圖像。
作者: Margarita Mar
前幾年 web 設計已適應有組織的列和網格，但在 2016 年，我們看到了大量轉向不規則圖層和超現代的設計。
為了使顧客多停留在頁面上，網站現在開始講故事了。相對平鋪直敘的信息而言，人們趨向于在故事中獲得更多。
懶加載延遲加載長網頁中的圖像，基本上是當需要的時候才讓信息出現。
拆分內容在響應式網頁設計中越來越流行，它將屏幕分成兩個或兩個以上的部分。一個分屏網站將在一個頁面上向觀眾展示幾個同樣重要的信息。這種趨勢自2015年底以來正在上升，但在2017，它將進一步增長，并可能在許多網站上遇到。
不需要去另一個頁面填寫一個表格，因為新的網站都配備了全屏幕形式，與響應式設計相適應。
視頻內容在去年增加，人們要求高質量的、有故事的視頻。在網站上播放的視頻是短而循環的，展示產品或大型電影項目，這將使觀眾對故事保持興趣。
項目: Hillsong
作者: Ruslan Siiz
搜索引擎優化在一個網站中是非常重要的，一個漂亮的網站沒有一個良好的SEO很可能會被拋在后面。
就用戶找到菜單有多難這點，漢堡菜單引發了許多贊成和反對的爭論，但有一點是肯定的——這種趨勢將會留下來，并且人們最終會習慣它。
今年關注細節真的很重要。從小細節，如導航點到角落的標志，專注于小細節，以更好完成工作。
項目: Barometa – Next-generation Job Platform
作者: Netguru Team; ?ukasz Pachytel
作者: Konstantin Zhenchur
21.1 極簡主義
隨著所有大品牌都切換到更簡約的、 最小的設計，這一趨勢將保留下去。
作者: Mingo Ideas Up
21.2 手繪
這是一個在聚光燈下存在了幾年的趨勢，它完全符合“潮人”業務。這種風格用于咖啡餐飲業、理發行業或藝術和工藝品行業。
作者: Sam Healy
21.3 負空間
這是一個古老的趨勢，但在過去的幾年中，我們看到它再次出現，它只會在2017增長，所以它肯定是值得關注的。
21.4 裁剪
這種趨勢追求盡可能的簡潔，只展示到足夠知道一個標志是什么，沒有更多。
作者: Aleksandr Maksimov
21.5 幾何
這種趨勢肯定是老派的，但它是那些永遠不會過時的樣式之一。
作者: Mingo Ideas Up
21.6 線條藝術
這種趨勢在新興、現代的商業中很流行。
作者 : Sam Healy; Andrea Schlaffer; Jacek Janiczak
21.7 圖案
圖案是一種新的趨勢，這種重復是讓企業脫穎而出的獨特方式。這種原始的趨勢也可用于徽標的演示文稿。
作者: Nick Edlin; Stanislav Aleynikov; Lucas Gil-Turner
21.8 動畫logo
運動的設計是今年一大趨勢，我們可以在所有的設計領域中找到它。
作者: Javier Miranda Nieto; The Woork Co
21.9 復古
復古風格仍在。即使這種趨勢已經存在了一段時間，它仍然有一些可以說。
作者: Роман Додонов; Mingo Ideas Up; Will Try Further
21.10 漸變色
漸變色今年無處不在——即使是logo。
作者: Mingo Ideas Up
21.11 logo中的插畫
插圖是使企業logo給人留下獨特、個性印象的好辦法。今年他們變得越來越流行。
作者: Bodea Daniel; Jacek Janiczak
21.12 logo中的攝影
圖像與排版的組合現在實在太熱了。他們一起配合得很好，他們之間形成了有趣的對比。
22.1 大，粗和漂亮的字體
字體設計也許是創造優秀的設計中最重要的部分。今年標題的字體設計將變得粗而大。
作者: Alexander Laguta
作者: Quim Marin
22.2 字體設計中的漸變色
漸變色絕對是“IT”的趨勢，現在你也會在字體設計中發現它。
作者: The Woork Co
22.3 視覺的層次結構
在所有設計領域中，排版層次都是非常重要的。字體的大小和重量可以很容易地表明哪些單詞或字母是最重要的，所以當你創建你的文字時，請記住這個方面。你還得記住，可以通過文本的位置和顏色實現很棒的視覺層次結構。
22.4 小字體
超小文本通常被負空間包圍，但你可以通過顏色或圖像之間的對比，使其更加凸顯。你也可以使用動畫來幫助它脫穎而出。
作者: Slava Oleinik; Bahaa Samir; Witty Digital
22.5 動畫字體
動畫無處不在，即使在字體設計。如果你使用柔和的動作，今年你不會出錯。
項目: Gotham Pro Animated Typeface Free
作者: Yaroslav Kononov; Daria Zalyatskaya; Nastya Sokha; Katerina Pavlenko; Max Kravchenko; Nadezhda Shymchenko; Kate Nizhegorodova
22.6 字體遇上攝影
文字與攝影的結合可以達到很好的效果?？纯催@些優秀的例子。
作者: Quim Marin
22.7 幾何圖形和字體
幾何圖形也可以結合排版，實現現代感效果。
作者: Quim Marin
作者: ? Studio—JQ ?
22.8 字體配對
同時使用兩個或多個字體仍然是今年的趨勢。看看下面的例子，一些有趣的配對，將有助于你的項目。
Typography: Google Fonts Combinations – Volume 1
Typography: Google Fonts Combinations – Volume 2
