人們對(duì) 2022 年感到謹(jǐn)慎興奮。我們度過(guò)了充滿挑戰(zhàn)的兩年，這不僅考驗(yàn)了我們的韌性和耐心，還考驗(yàn)了人際關(guān)系、心理和財(cái)務(wù)健康等等。

世界已經(jīng)發(fā)生了變化，這些變化促使企業(yè)改變營(yíng)銷和銷售產(chǎn)品和服務(wù)的方式。

我們到處都能看到這些變化，包括在網(wǎng)站設(shè)計(jì)中。

讓我們?cè)敿?xì)看看國(guó)外這些網(wǎng)頁(yè)設(shè)計(jì)趨勢(shì)中的每一個(gè)。

1.健康溫馨的設(shè)計(jì)

我們期待激動(dòng)人心的 2022 年，但人們?nèi)栽谶m應(yīng)新常態(tài)。

人們更加小心。他們更頻繁地消毒。他們更注重清潔和安全。

當(dāng)人們尋找產(chǎn)品和服務(wù)時(shí)，他們自然會(huì)問(wèn)他們是否可以安全購(gòu)買、消費(fèi)和使用。

網(wǎng)站設(shè)計(jì)必須適應(yīng)讓人們相信所提供的產(chǎn)品和服務(wù)是安全和健康的。

您如何讓您的客戶和潛在客戶相信您的產(chǎn)品和服務(wù)是安全的？

使用能喚起舒適感、減少焦慮和壓力并促進(jìn)健康習(xí)慣的圖像、形狀和顏色。

包括家居裝飾、戶外風(fēng)景或?qū)挸ㄞk公空間中的綠化的圖像和設(shè)計(jì)可以減少焦慮和壓力并提高舒適度。

有機(jī)形狀（例如我們?cè)谧匀唤缰锌吹降哪切⒆匀簧剩ù蟮厣{(diào)和綠色）以及流暢和諧的簡(jiǎn)潔設(shè)計(jì)元素都有助于增強(qiáng)舒適和安全感。設(shè)計(jì)中的空間（例如大型工作空間）模仿健康安全的社交距離習(xí)慣，從而緩解健康焦慮。

2022 年網(wǎng)站設(shè)計(jì)的目標(biāo)是創(chuàng)造一種鼓舞人心的感覺(jué)，讓人們?cè)谛颅h(huán)境中更舒適、更少煩躁和更少壓力。

2.微動(dòng)畫(huà)與微交互

人們的注意力持續(xù)時(shí)間很短。我們沉迷于短視頻、朋友圈和 微博 等社交網(wǎng)絡(luò)，只用幾百個(gè)字符就可以表達(dá)全部想法。

如果您想在瀏覽您的網(wǎng)站時(shí)吸引人們的注意力，您應(yīng)該考慮如何利用人們短暫的注意力。畢竟，最初的目標(biāo)是吸引他們的注意力，然后維護(hù)它并邀請(qǐng)他們花更多時(shí)間瀏覽您的網(wǎng)站。

在您的網(wǎng)站上吸引注意力的最佳方法之一是通過(guò)動(dòng)畫(huà)。

一種方法是為您的背景圖像合并小型移動(dòng)設(shè)計(jì)。這通常在網(wǎng)站的頂部完成，這樣人們一登陸您的頁(yè)面就可以看到動(dòng)態(tài)圖像。例如，您可以對(duì)網(wǎng)站上的一些關(guān)鍵元素使用移動(dòng)圖標(biāo)來(lái)吸引人們對(duì)這些圖標(biāo)的注意。

在結(jié)合動(dòng)畫(huà)和微交互時(shí)，要注意顏色和對(duì)比度。確保顏色不沖突。使用自然色，如藍(lán)色、綠色和棕色作為背景。保留黃色、橙色和紅色等較亮的顏色，以突出顯示動(dòng)態(tài)圖像和交互。因?yàn)榇蠖鄶?shù)人更容易看到更亮的顏色，所以它們會(huì)使動(dòng)態(tài)圖像和交互更加明顯。

但是，要小心過(guò)度動(dòng)畫(huà)，因?yàn)檫@可能會(huì)分散注意力。

使用允許人們與這些設(shè)計(jì)進(jìn)行交互的動(dòng)畫(huà)設(shè)計(jì)。這可以創(chuàng)造更有趣和愉快的用戶體驗(yàn)。

3.勵(lì)志插圖

人們希望受到啟發(fā)，尤其是在過(guò)去幾年的挑戰(zhàn)之后。

您可以使用網(wǎng)站設(shè)計(jì)直接或間接地激勵(lì)人們。

您可以通過(guò)使用簡(jiǎn)單、鼓舞人心的設(shè)計(jì)來(lái)直接激發(fā)靈感。例如，與著陸頁(yè)主題相關(guān)的勵(lì)志名言可能會(huì)很有效。

有什么比說(shuō)出來(lái)更好的方式來(lái)傳播積極性？

或者，您也可以通過(guò)選擇顯示積極和溫暖互動(dòng)的設(shè)計(jì)來(lái)嘗試間接方法（如上圖所示）。這樣的設(shè)計(jì)令人舒適和受歡迎，將有助于創(chuàng)造積極的用戶體驗(yàn)。記住要使用明亮有趣的顏色，而不是經(jīng)常傳達(dá)悲傷的深色。

目標(biāo)是注入更多快樂(lè)并創(chuàng)造有趣的用戶體驗(yàn)，讓人們?cè)谠L問(wèn)您的網(wǎng)站后感到高興。

4.簡(jiǎn)約和現(xiàn)代極簡(jiǎn)主義

如果大膽的設(shè)計(jì)或鮮艷的顏色不適合您的品牌標(biāo)識(shí)，您可以在設(shè)計(jì)網(wǎng)站時(shí)始終選擇現(xiàn)代極簡(jiǎn)主義。

不要以為極簡(jiǎn)設(shè)計(jì)是沉悶的。相反，簡(jiǎn)約的網(wǎng)站設(shè)計(jì)有助于大多數(shù)公司更有效地展示他們的產(chǎn)品或服務(wù)。而且，簡(jiǎn)單的設(shè)計(jì)通常更容易創(chuàng)建且成本更低。

您可以通過(guò)選擇與您的品牌一致的簡(jiǎn)單元素來(lái)實(shí)現(xiàn)完美的“現(xiàn)代極簡(jiǎn)主義”氛圍。例如，如果您經(jīng)營(yíng)護(hù)膚品業(yè)務(wù)，請(qǐng)?jiān)诒尘爸屑尤胨驑?shù)葉等自然元素以及單一混合色，以幫助營(yíng)造輕松的感覺(jué)并使您的產(chǎn)品成為焦點(diǎn)。

如果您有服裝品牌，請(qǐng)仔細(xì)考慮您在網(wǎng)站上使用的顏色。響亮、更鮮艷的顏色更適合更隨意的感覺(jué)。這就是為什么你會(huì)看到像 Old Navy、Target 和其他公司在他們的服裝設(shè)計(jì)中使用更亮的紅色、藍(lán)色和黃色的原因。單色通常反映更奢華的感覺(jué)。

極簡(jiǎn)主義使您的產(chǎn)品和服務(wù)成為明星，并幫助您保持品牌。

5.定制內(nèi)容

互聯(lián)網(wǎng)使一切變得更容易訪問(wèn)、可定制和相關(guān)。您的網(wǎng)站設(shè)計(jì)也應(yīng)該反映這一點(diǎn)。

例如，地理位置可以幫助您為地理位置接近您業(yè)務(wù)的人使用不同的消息傳遞。同樣，您可以使用某人在您網(wǎng)站上的瀏覽歷史記錄，以便根據(jù)他們以前看到和閱讀的內(nèi)容更好地集中您的消息和優(yōu)惠。

流行的電子商務(wù)網(wǎng)站在這方面做得很好。他們根據(jù)客戶的需求、他們的搜索歷史和他們的瀏覽行為來(lái)改變內(nèi)容。社交問(wèn)答網(wǎng)站也做得很好。一個(gè)人可以看到與他們正在研究的主題相關(guān)的問(wèn)題和線程的答案。

定制內(nèi)容創(chuàng)造了更加個(gè)性化的瀏覽體驗(yàn)。

如果您可以為人們提供他們想要的東西，他們就更有可能回到您的網(wǎng)站。

6.3D 視覺(jué)效果

多年來(lái)，三維圖像在網(wǎng)站設(shè)計(jì)中一直流行。我們預(yù)計(jì)這一趨勢(shì)將在 2022 年繼續(xù)。

有什么比通過(guò)真實(shí)的維度展示興奮更好的方式呢？

3D 是激發(fā)興奮和為您的設(shè)計(jì)增添樂(lè)趣的好方法，特別是如果您的品牌是科技、前衛(wèi)或現(xiàn)代的。

展示 3D 視覺(jué)效果的最佳方式是使它們大膽、大且易于查看。確保圖像清晰且質(zhì)量高，以免造成混亂。而且，重要的是，確保 3D 設(shè)計(jì)與您的品牌相得益彰。盡管 3D 設(shè)計(jì)很有趣，但它并不適用于所有品牌或風(fēng)格。

3D 視覺(jué)效果（如大圖片或插圖）最適合用于網(wǎng)站標(biāo)題或作為主圖（顯示在網(wǎng)站頂部）。但請(qǐng)注意不要使用過(guò)多的大型 3D 視覺(jué)效果，因?yàn)樗鼈儠?huì)壓倒您的整體設(shè)計(jì)。散布在整個(gè)網(wǎng)站上的 3D 圖像最有價(jià)值。

如果 3D 符合您的品牌和風(fēng)格，那么此類圖像可以讓您的訪問(wèn)者感到賓至如歸，并留下持久的印象。

7.漸變

當(dāng)網(wǎng)站設(shè)計(jì)開(kāi)始感覺(jué)扁平或沉悶或顏色不能完全互補(bǔ)時(shí)，請(qǐng)考慮在您的設(shè)計(jì)中使用漸變。

漸變是一種顏色的陰影，可以平滑地相互過(guò)渡。

漸變是永恒的現(xiàn)代設(shè)計(jì)經(jīng)典。它們多年來(lái)一直用于網(wǎng)站設(shè)計(jì)。漸變可以通過(guò)為您的網(wǎng)站設(shè)計(jì)添加額外的尺寸、紋理和樂(lè)趣來(lái)提升任何設(shè)計(jì)。

您可以將漸變用于徽標(biāo)、圖標(biāo)、背景、排版等。

但是，雖然漸變用途廣泛，但您必須找到合適的平衡點(diǎn)。例如，對(duì)小菜單圖標(biāo)或徽標(biāo)使用漸變，以幫助小而重要的元素脫穎而出。

如果您對(duì)較大的元素使用漸變，請(qǐng)確保您不會(huì)使網(wǎng)站上的其他設(shè)計(jì)元素變得不那么明顯。例如，在上面的設(shè)計(jì)中，您可以在 HERO 圖像中看到漸變（在頁(yè)面頂部），但頁(yè)面的其余部分大部分是白色背景。這有助于分離頁(yè)面的各個(gè)部分，并有助于使內(nèi)容更具可讀性。

8.大膽多彩的視覺(jué)效果

您可以通過(guò)使用大膽而多彩的視覺(jué)效果來(lái)幫助激發(fā)興奮并創(chuàng)造更有趣的瀏覽體驗(yàn)。

橙色、紅色、亮藍(lán)色、黃色等大膽的顏色非常適合平面插圖、HERO 圖像（位于頁(yè)面頂部）和標(biāo)題，可為您的網(wǎng)站營(yíng)造溫馨有趣的氛圍。許多電子商務(wù)電子商務(wù)網(wǎng)站使用大膽多彩的圖像來(lái)營(yíng)造歡樂(lè)的氛圍。

9.包容性設(shè)計(jì)和內(nèi)容

您的網(wǎng)站看起來(lái)很棒，但任何人都可以使用或訪問(wèn)它嗎？人們可以與您的產(chǎn)品和服務(wù)相關(guān)嗎？

包容性設(shè)計(jì)可以讓人們更信任您的服務(wù)或產(chǎn)品，讓他們感到聯(lián)系或被看到。

例如，看一下 crowdspring 網(wǎng)站上的標(biāo)題插圖。您是否看到我們?cè)噲D通過(guò)插圖創(chuàng)造更具包容性的感覺(jué)的方式？

您可以通過(guò)確保您的網(wǎng)站功能性和可訪問(wèn)性來(lái)將包容性設(shè)計(jì)納入您的網(wǎng)站。這意味著您網(wǎng)站的用戶界面 (UI) 簡(jiǎn)單且易于導(dǎo)航，字體易于閱讀且適合您的品牌，顏色不會(huì)沖突，并且您使用大量空白空間。

不要忽視您網(wǎng)站上的內(nèi)容——它可能與視覺(jué)設(shè)計(jì)一樣重要。注意人們?cè)谡務(wù)撌裁?，并相?yīng)地推銷您的服務(wù)或產(chǎn)品。

例如，在 2020 年和 2021 年的大流行期間，許多餐廳通過(guò)展示其烹飪?nèi)藛T和服務(wù)員戴著口罩的照片來(lái)適應(yīng)安全問(wèn)題。但有些餐館從未適應(yīng)過(guò)，因此難以留住顧客。

你的目標(biāo)應(yīng)該是包容的，但不要執(zhí)著于迎合所有人。使您的網(wǎng)站設(shè)計(jì)和內(nèi)容具有相關(guān)性，以便更多人可以從中受益。

10.黑白設(shè)計(jì)

另一個(gè)永不過(guò)時(shí)的現(xiàn)代經(jīng)典是黑白（或深色）設(shè)計(jì)。

這種風(fēng)格很簡(jiǎn)單，適合許多設(shè)計(jì)元素——從背景、圖標(biāo)、徽標(biāo)、照片、圖像、插圖等等。

黑白設(shè)計(jì)有助于展示您的產(chǎn)品或服務(wù)，同時(shí)營(yíng)造出優(yōu)雅和前衛(wèi)的感覺(jué)。當(dāng)您想保持潮流但不使用鮮艷的顏色時(shí)，這種風(fēng)格非常棒。

黑白設(shè)計(jì)不適用于所有品牌。但這種風(fēng)格適用于前衛(wèi)、優(yōu)雅、正式或休閑的品牌。

例如，如果您想讓您的產(chǎn)品看起來(lái)優(yōu)雅，您可以選擇使用黑白顏色創(chuàng)建漸變背景。如果您要打造前衛(wèi)和現(xiàn)代的外觀，請(qǐng)?jiān)谀脑O(shè)計(jì)中創(chuàng)建黑色和白色之間的鮮明對(duì)比。

黑白在插圖、照片、形狀等方面也很有趣。這些顏色用途廣泛。

如果您在過(guò)去三到四年內(nèi)沒(méi)有重新設(shè)計(jì)您的網(wǎng)站，那么這可能是重塑品牌的最佳時(shí)機(jī)。如果您正在設(shè)計(jì)一個(gè)新的網(wǎng)站，請(qǐng)記住其中的一些趨勢(shì)，但不要忘記最終目標(biāo)：為訪問(wèn)您網(wǎng)站的人創(chuàng)造有趣、輕松和出色的用戶體驗(yàn)。

素馬設(shè)計(jì)，專注于好的設(shè)計(jì)。

好的設(shè)計(jì)就是好的生意。