一個網站的平均壽命是三年,而網站設計元素,比如網站的顏色和排版,更新得更頻繁。這就是為什么跟上網站設計的趨勢是如此重要。
這樣做可以讓您在今天對您的網站設計做一些小的調整,這樣它就不會在明天就過時了。本指南將幫助您創建一個2021年的網站設計計劃!
1、亮/暗模式切換
在暗模式和亮模式之間切換的能力是一個您可能不知道您需要的需求特性。用戶喜歡能夠控制網站或應用程序的核心視覺基礎,而大多數手機都允許這樣做。在您的網站設計上添加一個切換按鈕只會增強用戶體驗。
記住,在明暗模式下,僅僅從黑到白的切換是不夠的。您的網站設計方案應該包含這兩種模式的調色板。
試試吧:健身統計移動應用套件
2、現代分屏
分屏設計是一種不斷發展的網站設計趨勢,現代分屏的創意之處在于,它提供了更多的交互性,并鼓勵用戶參與。上面的例子是一個很好的看看如何使用這種設計美學與大量的互動元素有視頻和三維元素。
讓這一趨勢發揮作用的訣竅就是讓它成為您自己的,分屏可以為用戶提供這樣或那樣的交互選擇,或者只是在文本和圖像元素之間提供一點視覺上的平衡。
試試看:拆分IOS UI套件
3、屏幕元素
有時候讓設計有趣的是您看不到的東西。
屏幕外元素趨勢通過移動圖形、文本或其他似乎直接移出屏幕的元素來實現這一想法。移動可以發生在其上或作為一個結果的懸?;驖L動交互。
這個趨勢的創意之處在于,它鼓勵網站訪問者真正地去看這個設計,并思考他們所看到的和它意味著什么。相反,如果有太多的事情發生,信息就會丟失。所以這種趨勢最適合簡單易懂的元素。
試試吧:Lewis-Creative Portfolio & Agency HTML模板
4、實驗字體
新的,不同的,時髦的,獨特的字體可以推動一個設計到下一個水平。隨著越來越多的項目使用專注于排版的視覺模式,實驗性字體是一個必須擁有的設計工具。
實驗性字體的主要特點是它們是不同的,有些甚至可能是排版設計者提前發布的未完成的設計,或者是定制的。
您可能會看到您意想不到的形狀和線條,三維字體,動畫或顏色,一種完全不同的感覺。實驗性字體最適合大的主頁,英雄標題。它們通常不適合正文或較小的復制塊。
試試:Exa Metline字體
5、重疊的設計元素
每個設計元素不必有自己的容器。它們可以重疊。
重疊的設計元素創造了深度和維度,也提供了從一個元素到下一個設計項目的眼球追蹤路徑。
這種網站設計趨勢的關鍵在于:創建和分層元素時,必須確保所有元素都能保持可讀性,“折疊”時也要保證移動設備上的可讀性。否則,這一趨勢可能很快就會停滯。
試試:導游卡插件
6、極簡美學
一個干凈的主頁可以幫助用戶探索設計的其余部分。極簡美學,尤其是主頁,是一個主要的趨勢風格。
選項范圍從帶有文本的平面背景,如上面的例子,到幾乎沒有導航而只有標題的照片或視頻主頁。
這些超級最小的美學幾乎剝奪了所有的設計。時髦的外觀是流線型的和干凈的,但您是在冒險與如此少的互動選擇。
嘗試一下:Vinero非常干凈和最小的組合WordPress主題
7、排版以填充和輪廓為特色
填充和輪廓排版的組合(通常是相同的字體)是完全有效的。
這一趨勢的特點是排版組合具有或不具有交互特性。例如,上面的網站使用填充文本作為懸停狀態,提示用戶該元素是可點擊的。輪廓狀態適用于非懸停元素。
結果非常有趣,創造了一個有趣的排版效果,您可以用很多不同的方式使用。此外,它使字體配對輕而易舉,因為您使用一種字體的兩種不同的方式。
試試:Visia Duo(自然和輪廓)字體
8、有趣的滾動模式
滾動圖案越有趣,就會有越多的用戶繼續瀏覽設計和內容。
現在的趨勢不是效果,而是使用網格和整體設計來推動用戶瀏覽內容。上面的示例完美地展示了這一點,顯示了在屏幕上水平和垂直移動的圖像網格。您一次只能完全看到一張圖片,把重點放在每一張作品上。
嘗試一下:平滑滾動的WordPress插件
9、如此多的襯線
曾經在網絡上被認為是“不可讀”的襯線字體正在到處涌現。從短,簡單的serifs到精心設計的更長的筆畫和尾巴,這種類型的設計是為了閱讀。
促成這一趨勢的最大因素可能是高分辨率屏幕(以及它們在市場上的主導地位)。沒有模糊或扭曲與這些字體。
幾乎任何風格的Serifs可以工作漂亮,包括現代和過渡風格的板。序列化適用于顯示文本和正文復制。
試試這個:亞倫襯線字體族
10、夸張的空白
簡約風格在網站設計中使用夸張的留白變得更加簡約。
留白如此受歡迎的一個原因是它可以幫助把注意力集中到設計的某個部分——有東西占據的空間,而不是什么都沒有。
空白也有一個美麗的,經典的感覺,很容易調整為任何數量的項目。
11、微型動畫
多虧了Instagram故事上那些酷炫的小動圖,網站設計才有了更多用戶風格的動圖形式的微動畫。
即使是您意想不到的網站,比如上面的電子商務設計,也在使用這種風格來吸引用戶的注意。它可以是任何東西,從屏幕上彈出的小圖像到移動的文本元素。
嘗試它:簡單的文本旋轉器WordPress插件
12、視頻的一切
如果您還沒有在網站設計項目中使用視頻,今年很可能會出現。視頻內容非常龐大。而且它正變得越來越容易獲得。
從移動背景(上圖),視頻故事(驅動設計的內容)來看,這種講故事的方式是未來的潮流。用戶喜歡它。這是不可否認的。正因為如此,它只會越來越受歡迎。
嘗試它:照片/視頻幻燈片模板
13、氣泡和斑點形狀
泡泡、斑點和其他“有機”形狀正在取代過去幾年主導設計的幾何風格。這種變形部分是很酷的動畫,部分是感覺。(項目有一些松散的元素。)
無論有沒有動畫,這些形狀在各種大小、配置和幾乎每種可能的配色方案中都同樣有效。
上面的Mawla可能是2019年初使用這種趨勢的例子,在斑點形狀中,所有的特征是用不同大小的元素分層漸變著色。
試試這個:波浪背景
14、AI的提示
人工智能輔助和聊天機器人越來越普遍,您可能會忽略它們。但它們正變得越來越聰明,今年將比以往任何時候都更普遍。
其中一些機器人很明顯,比如上面的這個。還有一些是“真人”的形象,還有一些是卡通風格的。通常的主題是有人(或東西)在任何時候都在幫助用戶。
使用這種人工智能技術的網站越多,就會有越多的用戶期望在瀏覽時能立即得到問題的答案。
試試這個:WP AI助手
15、流線型的標志
簡單、流線型的標志設計正在取代過去作為全屏品牌元素的一些更復雜的選項。也許是因為其他屏幕元素變得越來越復雜,也許只是一時的流行。
不管怎樣,簡單的標識隨處可見。
這些標志的優點是簡單的類型和圖標元素很容易看一眼。需要注意的是,它們看起來都有相似的外觀和感覺。
試試:商標模板
16、大按鈕
為了方便手機用戶,所有版本的網站都默認使用大按鈕,以方便用戶使用。這包括從呼吁到行動到導航的一切。
所有這些都必須易于用拇指或手指敲擊,而不會與錯誤的元素交互。
這些按鈕通常有不同的顏色或卡片樣式,這樣就可以很容易地看到應該發生什么動作,以及什么元素會通過觸摸做一些事情。
注意在上面的例子中,每個盒子或卡片都是一個巨大的按鈕。而在移動版本中,每張卡都是一個垂直的堆棧。
試試它:谷歌AMP移動模板
結論
為了保持新鮮感,您多久會對網站設計做一次小改動?雖然這可能是一個令人生畏的想法,但一直做一些小的改變實際上會成為您日常生活的一部分,有助于保持設計的新鮮感。(它還能讓您很快不覺得無聊。)
使用設計工具(如本文介紹的工具)加速這個過程,這樣您就可以毫不擔心地緊跟潮流!