2015-2016網(wǎng)頁(yè)設計趨勢分析 Web Design of Trends，接觸網(wǎng)頁(yè)也有5個(gè)年頭了，彎路走了不少，有付出必有回報，有得到必有所失，放眼世界，網(wǎng)頁(yè)設計其實(shí)很美妙，它帶著(zhù)一個(gè)夢(mèng)想。

近一年基本沒(méi)做過(guò)國內的網(wǎng)站，基本都是國外網(wǎng)站，自己對某些趨勢的把握還是有一定的想法的，雖然不能算是很厲害很完善，到時(shí)候會(huì )補充完善趨勢分析咯，先把以前歸納的簡(jiǎn)潔版的文字放出來(lái)：）

因為有些東西真的不知道怎么去配圖，更好的就用文字來(lái)描述，有點(diǎn)小懶，呵呵，有機會(huì )的時(shí)候會(huì )補充。這里我就專(zhuān)門(mén)精簡(jiǎn)的概括就好了，點(diǎn)明重點(diǎn)即可！

“接觸網(wǎng)頁(yè)設計也有5個(gè)年頭了，我也只是剛出頭的菜鳥(niǎo)，我很努力，我愛(ài)走彎路，我不在乎圈子是個(gè)什么，跟著(zhù)自己的夢(mèng)想走”----深圳網(wǎng)站建設--云梯設計師說(shuō)。接觸過(guò)游戲網(wǎng)頁(yè)，酷炫動(dòng)感的，FLASH的，HTML5的，SVG的，扁平化的，WIN8風(fēng)格的，擬物場(chǎng)景的，oh,no，不是單純接觸，應該是這些類(lèi)型都做過(guò)，作品雜七雜八，但是也一路跟著(zhù)自己的夢(mèng)想走來(lái)，多的不說(shuō)啦，正題開(kāi)始：網(wǎng)上很多各種雜七雜八的趨勢分析過(guò)的我就不列出來(lái)了，都是重復的沒(méi)啥意思，感覺(jué)2016年、未來(lái)2年內有這些趨勢存在，希望對設計師們有一定的研究方向！

1.傳感器訪(fǎng)問(wèn)賦予頁(yè)面對用戶(hù)環(huán)境的感知能力

很多年以來(lái)，web 頁(yè)面掌握的用戶(hù)情況十分有限，通常只有用戶(hù)的屏幕尺寸以及瀏覽器類(lèi)型等。但現在各種 W3C 標準把環(huán)境光、麥克風(fēng)、攝像頭等各種傳感器數據都提供出來(lái)了。這使得網(wǎng)站可以跳出頁(yè)面之外掌握更為豐富的信息。

2.信息推送

讓網(wǎng)站可以保持與用戶(hù)的連接—哪怕用戶(hù)關(guān)閉了網(wǎng)站的瀏覽器標簽頁(yè)，使用一些新的w3c新標準技術(shù)。比如可以使用websocket，還有其它標準技術(shù)實(shí)現信息推送的體驗。

3.SVG圖形和動(dòng)畫(huà)

以?xún)?yōu)越的處理性能和動(dòng)畫(huà)性能，加載速度，不言而喻它比png,jpg,gif效率質(zhì)量都高太多。

我自己主要使用SVGDeveloper這款工具結合jquery做動(dòng)畫(huà)，因為用的是mac系統，這款工具要使用虛擬機parallels desktop來(lái)配合mac系統運行

4.超快用戶(hù)體驗 

“離線(xiàn)優(yōu)先”，HTML5應用類(lèi)緩存

網(wǎng)頁(yè)的瀏覽速度和等待時(shí)間就不用多說(shuō)了，非常重要。

5.智能響應

根據用戶(hù)點(diǎn)擊等等而響應內容，而不是僅僅根據設備分辨率響應，所以這里說(shuō)的智能響應并不僅僅指響應式布局Responsive Layout.

比如：當你是新用戶(hù)開(kāi)始瀏覽文章時(shí)，會(huì )有在線(xiàn)FAQ的表單來(lái)響應你的操作，反之，在你登陸后閱讀一篇文章的時(shí)候，會(huì )有標注功能讓你更好的對文章進(jìn)行整理方便下次閱讀。

比如Medium和The Next Web在閱讀體驗上做得就非常棒。

6.ServiceWorkers

可讓網(wǎng)站安裝 Javas cript 文件，讓web原生應用化，離線(xiàn)推送，這就類(lèi)似一個(gè)基于WEB的半原生，甚至就是原生APP的實(shí)現。

7.360全景+視頻交互

使用HTML5技術(shù)生動(dòng)的360全景展示，視頻內置于其中，形成的場(chǎng)景交互，讓網(wǎng)站完全趨向真實(shí)場(chǎng)景。

這種體驗將攝影，技術(shù)，表現力，特效，音效等方面結合起來(lái)，在FWA上看到過(guò)幾個(gè)網(wǎng)站

8.基于HTML5的交互

比如碎片、離子、NDA、電影特效等運用到全屏輪播，tab切換，登陸注冊彈窗等模塊中。

9.PJAX的普及

早應該是體驗在behance和pinterest這兩個(gè)網(wǎng)站上，然后慢慢流行到了國內，比如花瓣，接著(zhù)是前不久dribbble的瀑布流和查看作品的改版體驗，利用HTML5的特性結合完全/局部刷新實(shí)現改變網(wǎng)址無(wú)刷新加載，同時(shí)滿(mǎn)足SEO的需求。

10.CSS3動(dòng)畫(huà)將更加廣泛

現在做國外的設計基本不用考慮IE9以下了，也就是說(shuō)基本不用考慮IE，所以很好的運用CSS3動(dòng)畫(huà)能大大提高網(wǎng)站的視覺(jué)舒適程度，特別是細節動(dòng)畫(huà)，小小的細節動(dòng)畫(huà)可能會(huì )是點(diǎn)睛之筆哦。

是不是看了這些感覺(jué)怎么都是PC端的趨勢？NO,NO，其實(shí)移動(dòng)端也同時(shí)存在這些趨勢，移動(dòng)不僅僅使用APP這個(gè)詞去衡量的，現在A(yíng)PP的技術(shù)門(mén)檻越來(lái)越低，滿(mǎn)大街都是，和賣(mài)白菜一樣，參差不齊，基于移動(dòng)端的體驗趨勢，也是非常重要的。

移動(dòng)端的一些常見(jiàn)趨勢就不說(shuō)了，谷歌百度一大堆，再增加一點(diǎn)：

11.web移動(dòng)端的PC效果移植

我們在PC網(wǎng)站上很常見(jiàn)視差，滾輪偵聽(tīng)，滑出等交互效果，使用HTML5的一些新特性，使用國外開(kāi)源的移動(dòng)框架，可以將PC上酷炫的效果同樣移植到移動(dòng)端上，體驗會(huì )大不一樣。

http://ezekroy.com/jianzhanzhishi/7736.html 2015-2016網(wǎng)頁(yè)設計趨勢分析