在一個(gè)瞬息萬(wàn)變的行業(yè)中，網(wǎng)站設(shè)計(jì)師必須不斷地在技術(shù)的最新更新與日新月異的設(shè)計(jì)趨勢(shì)和偏好之間進(jìn)行斗爭(zhēng)。作為負(fù)責(zé)網(wǎng)站設(shè)計(jì)的，我發(fā)現(xiàn)最顯著的趨勢(shì)是客戶抵制變化。

在過(guò)去幾年中，我們與要求過(guò)時(shí)的樣式和趨勢(shì)的客戶進(jìn)行了很多分析與解答。如果不及時(shí)更新網(wǎng)站這通常會(huì)導(dǎo)致網(wǎng)站過(guò)時(shí)，甚至無(wú)法開始構(gòu)建！為哈會(huì)這樣說(shuō)？這實(shí)際上很簡(jiǎn)單，大多數(shù)企業(yè)都喜歡對(duì)自己的競(jìng)爭(zhēng)對(duì)手進(jìn)行基準(zhǔn)測(cè)試。例如，金融服務(wù)業(yè)務(wù)網(wǎng)站的典型預(yù)期壽命約為4年。實(shí)際上，這些客戶的期望非常不準(zhǔn)確。隨著技術(shù)和設(shè)計(jì)趨勢(shì)的日新月異，大多數(shù)網(wǎng)站將在大約18個(gè)月后開始出現(xiàn)老化跡象。這意味著客戶從他們的競(jìng)爭(zhēng)對(duì)手那里汲取了靈感，而這些競(jìng)爭(zhēng)對(duì)手往往擁有過(guò)時(shí)的網(wǎng)站！

為了從新的Web設(shè)計(jì)趨勢(shì)中獲得靈感，我們必須首先考慮較早的那些，以避免出現(xiàn)。

1.動(dòng)畫網(wǎng)站輪播（滑塊）

網(wǎng)站輪播或動(dòng)畫橫幅廣告是趨勢(shì)的一個(gè)很好的例子，這種趨勢(shì)終于在2020年開始消失。研究表明，首頁(yè)是近95％的點(diǎn)擊都在第一?。Ｄ阄ㄒ豢赡軕?yīng)該考慮的動(dòng)畫幻燈片放映是在電子商務(wù)網(wǎng)站上進(jìn)行的，信息子網(wǎng)站應(yīng)堅(jiān)持使用單一橫幅，這也有助于提高網(wǎng)站加載速度。

2.高度分層的網(wǎng)站結(jié)構(gòu)

建立網(wǎng)站可以追溯到8年左右的老牌網(wǎng)站設(shè)計(jì)師將記住簡(jiǎn)單的網(wǎng)站被分成多個(gè)頁(yè)面的。這些在站點(diǎn)地圖上每頁(yè)有數(shù)百個(gè)單詞，深度超過(guò)4個(gè)級(jí)別。訪客不得不無(wú)休止地點(diǎn)擊頁(yè)面才能獲得基本信息?？紤]到耐煩的56kbps撥號(hào)調(diào)制解調(diào)器的連接速度，實(shí)際上令人困惑的是這是趨勢(shì)。如今，當(dāng)你在設(shè)計(jì)站點(diǎn)地圖時(shí)，必須確保少即是多，不要在頁(yè)面上填充文本！

3.過(guò)度使用動(dòng)畫

在被認(rèn)為引人入勝的動(dòng)畫效果良好的網(wǎng)站與大量的幻燈片，淡入淡出和視差動(dòng)畫之間，我在訪問成本較低的網(wǎng)站時(shí)經(jīng)常會(huì)看到它們之間的平衡，請(qǐng)記住，你擁有的動(dòng)畫越多，加載和呈現(xiàn)給普通用戶問題的時(shí)間就越大，網(wǎng)站簡(jiǎn)單點(diǎn)是最好不過(guò)的。不要誤解這一點(diǎn)，巧妙地使用動(dòng)畫并采用“少即是多”的方法，確實(shí)可以幫助提高訪問者的轉(zhuǎn)化率并提高頁(yè)面的參與度，只是不要過(guò)度使用。

4.Web設(shè)計(jì)趨勢(shì)將從2020年汲取靈感

與許多趨勢(shì)一樣，趨勢(shì)周期通常會(huì)隨著時(shí)間的推移而重復(fù)出現(xiàn)并不斷變化。最近，隨著陰影的復(fù)蘇，這一點(diǎn)顯而易見。

（1）平面設(shè)計(jì)和陰影的復(fù)興

盡管平面設(shè)計(jì)已經(jīng)存在了好幾年，但它仍然很強(qiáng)大?？赡艿闹饕蛑皇且?yàn)槠矫嬖O(shè)計(jì)通常是矢量圖像，可以高度壓縮并在SVG上輸出。這樣可以確保圖像保持視網(wǎng)膜清晰，而不會(huì)影響加載速度。

平面設(shè)計(jì)正逐漸變形為具有層次和深度的3D形狀，最新趨勢(shì)是少量使用陰影效果，使平面設(shè)計(jì)重獲新生。

（2）精美的動(dòng)畫

在2020年，動(dòng)畫應(yīng)該真正保持簡(jiǎn)單和微妙。在按鈕上使用懸停效果時(shí)，最好進(jìn)行細(xì)微的漸變變化和不分散訪客注意力的動(dòng)作。視差仍然是使頁(yè)面栩栩如生的一種好方法，到目前為止，全年都沒有跡象表明速度變慢。在多種設(shè)備上測(cè)試動(dòng)畫非常重要，以確保javascript / CSS不會(huì)導(dǎo)致頁(yè)面抖動(dòng)。

（3）抽象的形狀和冒險(xiǎn)的色彩

也許著重于確保網(wǎng)站快速加載的另一個(gè)結(jié)果是，矢量形狀是一種使網(wǎng)站看起來(lái)既現(xiàn)代又不降低體驗(yàn)速度的好方法?？梢栽贏dobe Illustrator（或類似工具）中創(chuàng)建小形狀，并將其導(dǎo)出為SVG。這樣可以使圖像變得敏感，而不會(huì)影響頁(yè)面大小。

（4）使用GIF表達(dá)情感

如果不確定GIF是什么，則你以前可能沒有使用過(guò)手機(jī)或社交媒體。他們無(wú)處不在。在面對(duì)面互動(dòng)急劇減少的時(shí)代，通過(guò)內(nèi)容和對(duì)話傳達(dá)情感變得越來(lái)越困難。網(wǎng)站所有者經(jīng)常難以傳達(dá)其內(nèi)容的關(guān)鍵領(lǐng)域之一是個(gè)性和情感。在博客文章，網(wǎng)站文章使用GIF是一種極好的方法，可以全面展現(xiàn)產(chǎn)品或服務(wù)，也可以提高與觀眾互動(dòng)。

（5）閱讀進(jìn)度條

一個(gè)相對(duì)較新的趨勢(shì)正變得越來(lái)越流行，那就是在博客文章或文章的頂部顯示一個(gè)簡(jiǎn)單的進(jìn)度條。這將自動(dòng)計(jì)算讀者閱讀文章的距離。這是一個(gè)不錯(cuò)的工具，可以降低跳出率并增加頁(yè)面停留時(shí)間，因?yàn)樵L問者無(wú)需擔(dān)心閱讀量會(huì)更多。

（6）Google AMP

Google AMP也許是2020年最重要的新趨勢(shì)之一，它是一種相對(duì)較新的方法，幾乎可以立即顯示內(nèi)容。前提很簡(jiǎn)單，少即是多，通過(guò)在你的網(wǎng)站頁(yè)面上啟用AMP，移動(dòng)查看者將能夠在熟悉的超快速環(huán)境中單擊你的文章并訪問你的頁(yè)面。Google會(huì)在本地緩存頁(yè)面，以便更快地呈現(xiàn)它們。唯一的限制是AMP頁(yè)面具有基本布局。