網(wǎng)站建設主流網(wǎng)頁(yè)設計趨勢預測發(fā)布者：本站     時(shí)間：2022-03-21 16:03:20

創(chuàng )業(yè)界流行一句話(huà)，“站在風(fēng)口上，豬都會(huì )飛”。其實(shí)這句話(huà)我覺(jué)得放在設計界等很多其他地方都適用，比如在設計界，我們可以說(shuō)，“如果你把握住了設計 風(fēng)潮的脈搏，你很快就會(huì )飛躍成設計先驅?！钡浅绷鬟@個(gè)東西就好像真愛(ài)一樣，人人都說(shuō)這個(gè)世界上總有一個(gè)最適合的TA在等著(zhù)你，但是你窮其一生尋尋覓覓上 下而求索，卻往往空手而歸。又或者給你找到了那個(gè)TA，卻發(fā)覺(jué)TA已經(jīng)成為別人的新郎/娘，自己卻只能一邊深夜獨自空垂淚。

其實(shí)創(chuàng )業(yè)界和設計界的風(fēng)潮也一樣，你一直想比別人先一步找到未來(lái)的流行風(fēng)潮，期望能率先站在風(fēng)口上，孰料最終不是走錯了方向和風(fēng)口出現的地方背道而 馳，或者就是慢了別人半拍，最終只能走到風(fēng)尾巴上面，而且還要是Peter Thiel在他的《從0到1》中提到的長(cháng)尾理論(冪次法則)的那條長(cháng)長(cháng)的尾巴上面，眼巴巴地看著(zhù)別人投入了風(fēng)口的懷抱。

所以風(fēng)潮這個(gè)東西是一個(gè)非常神秘的事物，上帝往往不會(huì )輕易的給你暗示。所謂“國之利器，不以示人”，如果大家都知道風(fēng)口在哪里了，那大家一窩蜂的跑過(guò)去不就把風(fēng)口給堵死了，從而也就無(wú)風(fēng)口可言了。

但是，今天我就自動(dòng)請纓，敢冒天下之大不韙，用本人尚算深厚的設計背景以及對這幾年設計風(fēng)向的觀(guān)察，跟大家提提我對未來(lái)網(wǎng)頁(yè)設計風(fēng)潮的風(fēng)口的猜想。如果大家覺(jué)得說(shuō)的還算有點(diǎn)道理的，有錢(qián)的捧個(gè)錢(qián)場(chǎng)給個(gè)打賞，沒(méi)錢(qián)的捧個(gè)人場(chǎng)評論轉發(fā)來(lái)聲吶喊。當然，如果大家覺(jué)得這是一派胡言的話(huà)，那也就只能請你趕快離場(chǎng)，等下一篇文章上來(lái)再請你來(lái)好好捧場(chǎng)。

滑動(dòng)優(yōu)先于點(diǎn)擊
先上圖：

主流網(wǎng)頁(yè)設計趨勢預測

上圖是否非常熟悉呢？當然了，這不就是我們今天打開(kāi)電腦天天在做的事情嘛。

但是你要知道現在已經(jīng)是移動(dòng)互聯(lián)的年代，移動(dòng)設備占據了用戶(hù)大量的網(wǎng)上瀏覽時(shí)間，而移動(dòng)設備的特點(diǎn)是屏幕相對比較小，而控件一般設計的比較大以方便 點(diǎn)擊。所以用戶(hù)更希望的是能隨心所欲的通過(guò)指尖快速的瀏覽到指定的信息，而非通過(guò)鼠標慢慢的往下拉，然后找到一行小的可憐的鏈接點(diǎn)進(jìn)去進(jìn)行查看。

所以這個(gè)時(shí)候的設計更多應該是手勢操作優(yōu)先，讓用戶(hù)可以通過(guò)手勢快速的定位到自己想要的內容。

況且現在移動(dòng)互聯(lián)網(wǎng)的用戶(hù)越來(lái)越急躁和越來(lái)越懶，很少人有耐心去一個(gè)個(gè)條目仔細去查看去找到想要的內容信息。所以他們更希望的是能快速的在簡(jiǎn)潔的屏幕上定位到自己想要的目標，如果能不讓自己動(dòng)手就能自己出現就更好了。

主流網(wǎng)頁(yè)設計趨勢預測

主流網(wǎng)頁(yè)設計趨勢預測

這個(gè)就是我們都熟知的泰晤士周刊網(wǎng)絡(luò )版，它甚至的是無(wú)限循環(huán)的去滾動(dòng)著(zhù)顯示文章，而不像傳統的PC瀏覽那樣，分成無(wú)數個(gè)tag和頁(yè)面來(lái)讓用戶(hù)進(jìn)行點(diǎn)擊選擇。而這，我認為就是這種風(fēng)潮到來(lái)的一種暗示。

雖然我不知道可穿戴設備如智能手表等什么時(shí)候能完全流行起來(lái)，但是我相信如果真流行起來(lái)的話(huà)，它里面的應用肯定是能更好的滾動(dòng)顯示和通過(guò)手勢進(jìn)行方便的操作的。

折疊顯示將成明日黃花
正因為現在對頁(yè)面進(jìn)行滑動(dòng)是如此的簡(jiǎn)便和隨心所欲，且當今的智能設備的大小型號琳瑯滿(mǎn)目，所以因為一些內容過(guò)長(cháng)而進(jìn)行折疊顯示的方式已經(jīng)過(guò)時(shí)了 -僅僅將一些關(guān)鍵信息顯示給用戶(hù)，當需要的時(shí)候再去點(diǎn)擊個(gè)“＋”號什么的進(jìn)行展開(kāi)。

同時(shí)你也再沒(méi)有必要在一篇文章的前面堆積大量的文字內容來(lái)讓用戶(hù)知道你下面將要描述的是什么內容，因為用戶(hù)很容易就能通過(guò)手勢操作滑動(dòng)到它想要看的內容上面去。

比如你看下人家Medium的做法，點(diǎn)擊一篇文章進(jìn)去，開(kāi)門(mén)見(jiàn)山的就是一張大圖鋪天蓋地的映入眼簾。用戶(hù)只有往下滑動(dòng)才會(huì )出現文章的內容，而用戶(hù)如果想快速查看某一個(gè)章節，只需要多滑動(dòng)幾下就到了。

主流網(wǎng)頁(yè)設計趨勢預測

所以取消折疊內容的顯示，這我認為也肯定是將要風(fēng)靡網(wǎng)頁(yè)設計界的風(fēng)潮之一。

快速的呈現和簡(jiǎn)約的設計
我不知道讀者您算不算是個(gè)脾氣比較溫順比較隨和的人，如果你自認為是的話(huà)，那么如果因為網(wǎng)絡(luò )太慢，本文下面的內容到了現在還沒(méi)有完全加載完畢。那 么，我相信你肯定會(huì )立刻火冒三丈，把網(wǎng)絡(luò )提供商的先人都會(huì )問(wèn)候一遍(網(wǎng)絡(luò )出問(wèn)題的時(shí)候，我本人往往首先問(wèn)候的就是網(wǎng)絡(luò )供應商，因為人家貪污的話(huà)還收了錢(qián)干 活，而這班人往往是收了錢(qián)還不干活)。

在當今這個(gè)生活節奏這么快速的年代，什么最貴？時(shí)間最貴。每個(gè)人都在爭分奪秒的不甘落后的往前狂奔，而因為通過(guò)你的應用或者網(wǎng)頁(yè)找到一個(gè)想要的內容卻要耗掉我好幾十秒的寶貴時(shí)間，我能不暴跳如雷立刻拉黑嗎？

所以我們的設計要迎合我們這些暴躁的用戶(hù)的需求，在能快速顯示之余，還要能足夠簡(jiǎn)潔的將內容顯示出來(lái)讓用戶(hù)能快速的弄懂這是怎么一回事。

主流網(wǎng)頁(yè)設計趨勢預測

上圖顯示了頁(yè)面加載時(shí)間和用戶(hù)放棄繼續瀏覽的可能性的一個(gè)關(guān)系，可以看出來(lái)，一個(gè)頁(yè)面如果加載太慢的話(huà)，對于大部分用戶(hù)來(lái)說(shuō)，跟沒(méi)有加載是沒(méi)有什么區別的，因為他們等不了幾秒就將你的頁(yè)面或者應用給關(guān)閉掉，刪除拉黑掉了。

簡(jiǎn)潔快速的設計應該是讓人能夠快速的打開(kāi)并能愉悅的開(kāi)始欣賞里面的內容的，而不是等半天只顯示了一半內容，或者內容顯示出來(lái)了卻耗掉用戶(hù)半天時(shí)間才發(fā)現這里面根本沒(méi)有我TMD想要的東西。下面就是這兩種設計的一個(gè)對比例子，誰(shuí)更簡(jiǎn)單扼要，相信不用我明說(shuō)了吧。

主流網(wǎng)頁(yè)設計趨勢預測主流網(wǎng)頁(yè)設計趨勢預測

大家對比下現在很多手機優(yōu)秀App的設計和其他一些門(mén)戶(hù)網(wǎng)站的設計，就會(huì )為這些網(wǎng)站的設計感覺(jué)汗顏。因為那些優(yōu)秀應用里面的界面超級簡(jiǎn)約和漂亮，而之所以做成這么簡(jiǎn)約的原因又正是因為需要有好的性能來(lái)滿(mǎn)足浮躁的用戶(hù)的需求。

主流網(wǎng)頁(yè)設計趨勢預測

現在炙手可熱的扁平化設計其實(shí)只是一個(gè)開(kāi)始，其最終的目標瞄準的就是簡(jiǎn)潔和實(shí)時(shí)性。而這，就是我認為的另外一個(gè)網(wǎng)頁(yè)設計的風(fēng)潮。

矢量圖將迎來(lái)春天
相信大家在欣賞一個(gè)朋友通過(guò)微信發(fā)過(guò)來(lái)的聲稱(chēng)有亮點(diǎn)的圖的時(shí)候，應該都會(huì )嘗試將其進(jìn)行放大再開(kāi)始亮點(diǎn)查找。你在Retina屏上面放大還好，但是如 果在其他非Retina屏幕上對圖片進(jìn)行放大，到時(shí)你就真的找到亮點(diǎn)了，且找到很多，一個(gè)個(gè)方塊的格子狀的像素點(diǎn)。旁邊美女一邊走過(guò)時(shí)瞥見(jiàn)的話(huà)還以為你在 看什么東西了，竟然還要打馬賽克！立刻投以鄙視的眼光或者一頓拳腳(如果是公交上的話(huà))！怪誰(shuí)？怪你朋友發(fā)給你的是位圖。

主流網(wǎng)頁(yè)設計趨勢預測

而隨著(zhù)現在Retina屏的流行和現代瀏覽器地矢量圖的支持越來(lái)越好，所以一度因實(shí)現和支持難度而少人問(wèn)津的矢量圖相信將會(huì )再次回到風(fēng)口浪尖上，因為如果是矢量圖的話(huà)，無(wú)論你做多大比例的縮放，它都不會(huì )失真。

主流網(wǎng)頁(yè)設計趨勢預測

而其實(shí)現在這種風(fēng)潮已經(jīng)初露端倪，你看下當今流行的字體圖標和谷歌在大力推的Material Design就可見(jiàn)一斑了。

所以很有可能不久的將來(lái)你再打開(kāi)朋友發(fā)給你的圖片找亮點(diǎn)的時(shí)候，可以放心的跟自己說(shuō)：“自從有了矢量圖，媽媽再也不用擔心我被人打了”。

動(dòng)圖將上演王者歸來(lái)
曾幾何時(shí)，動(dòng)圖曾經(jīng)到處泛濫，泛濫到在你的網(wǎng)站需要更新的時(shí)候都要在上面貼個(gè)“網(wǎng)站正在更新”的Flash上去，泛濫到大家都覺(jué)得有點(diǎn)噁心了。

但是現在情況有所轉變了，不少的流行因素正在試圖讓動(dòng)畫(huà)上演一出王者歸來(lái)的好戲。

扁平化設計的流行：正因為太扁太平太飛機場(chǎng)般的過(guò)于單調，動(dòng)圖的作用就顯示出來(lái)了。只要你不像以前一樣在你的網(wǎng)站上鋪天蓋地的使用動(dòng)圖，那么它就能將很多東西融合在一張動(dòng)圖中來(lái)給你扁平略顯單調的頁(yè)面帶來(lái)不少的活力和視覺(jué)沖擊。

主流網(wǎng)頁(yè)設計趨勢預測

移動(dòng)應用的風(fēng)靡：移動(dòng)應用對人們的預期重新進(jìn)行了定義，它更多是通過(guò)動(dòng)畫(huà)來(lái)傳遞不同的意義，而我們的網(wǎng)頁(yè)設計也很應該開(kāi)始效仿。

主流網(wǎng)頁(yè)設計趨勢預測

HTML5等新技術(shù)的支持: 這些技術(shù)讓我們不需要安裝任何插件的情況下就能使用動(dòng)畫(huà)。

所以說(shuō)GIF動(dòng)畫(huà)將要上演一出王者歸來(lái)的好戲。其實(shí)在本文你就已經(jīng)看到了好幾張GIF動(dòng)畫(huà)。有必要相信，動(dòng)畫(huà)將再一次引領(lǐng)大家進(jìn)入到下一波網(wǎng)頁(yè)設計風(fēng)潮。

Web Components組件標準化的到來(lái)
另外一個(gè)我認為在網(wǎng)絡(luò )設計上將會(huì )盛行起來(lái)的是Web Components組件技術(shù)。大家都知道現在的網(wǎng)絡(luò )實(shí)現技術(shù)正變得越來(lái)越復雜，而可讀性卻又變得越來(lái)越差。所以大家都期待有一個(gè)統一的標準來(lái)讓設計師們 簡(jiǎn)單的完成一些如增加個(gè)打開(kāi)Google Analystics的按鈕之類(lèi)的事情，比如簡(jiǎn)單的加一行下面的代碼來(lái)達成這個(gè)目標：

而這就是Web Components所能做的事情，但是現在很多設計師都沒(méi)有用它把自己給武裝起來(lái)。而現在谷歌Material design就是一個(gè)很好的開(kāi)始，它提供了豐富的動(dòng)畫(huà)和交互方面的組件，用戶(hù)只需要如下圖般簡(jiǎn)單幾行代碼就能進(jìn)行使用：

主流網(wǎng)頁(yè)設計趨勢預測

如果一切如我猜想般正常發(fā)展下去的話(huà)，那么很有可能我們的2015年下半年將會(huì )有更多基于組件的框架浮出水面，比如Bootstrap 4.0?

社交網(wǎng)絡(luò )內容的泛濫和郵件列表風(fēng)格的復古風(fēng)
在當今社交媒體這么盛行的年代，每天都有無(wú)數的內容產(chǎn)生，讓人目不暇接。但是很多內容提供商/者卻并不因此而歡喜雀躍。

大家都在用微信，相信大家每天微信上面都有無(wú)數的圖片和日日更新的人生新方向的感悟出現在朋友圈里，開(kāi)始的時(shí)候還好奇瞄幾眼，到了后來(lái)這些信息越來(lái) 越多且千篇一律了，就變得視若無(wú)睹直接飄過(guò)了。同時(shí)也很有可能將一些朋友發(fā)送的優(yōu)秀內容都錯過(guò)了，比如天地會(huì )珠海分舵發(fā)送的這篇好文。

怎么回事呢？其實(shí)說(shuō)白了就是內容已經(jīng)飽和得有點(diǎn)泛濫了。比如你在微博上發(fā)個(gè)消息，很有可能立刻就會(huì )淹沒(méi)在信息海洋中消失得無(wú)影無(wú)蹤了。

當然，這并不是說(shuō)社交網(wǎng)絡(luò )將會(huì )從此沒(méi)落。我這里想表達的是，正是社交網(wǎng)絡(luò )所碰到的這種信息泛濫的問(wèn)題，讓一些看上去陳舊而不起眼的利基市場(chǎng)茂發(fā)了生 機。比如2014年就有不少如Tim Ferriss等的基于郵件列表的杰出博客開(kāi)始冒起來(lái)，它們提供了優(yōu)秀的迎合郵件列表樣式博客的設計，吸引了不少人的眼球。因為它們很清楚的知道，社交媒 體泛濫的信息也許會(huì )引起讀者的反感而被忽略掉，但是讀者往往還是很樂(lè )意去看每一封發(fā)送到他們的電子郵箱的郵件的。