02 . 16 2019

2019國外網頁設計趨勢

View

新的一年,網絡上又出現了新的網頁設計趨勢。雖然之前的設計趨勢還沒過時或者流行,但新趨勢已經悄然到來。
 
在這篇文章中,我們會總結一些在2019年可能流行的設計趨勢。其中一些是剛剛出現,而有的在國外已經流行了很多年。
 
如果你想保持前沿設計風格,以下內容會給你一個很好的參考和指引。
 

網絡微交互


現在,網頁動畫已經很普遍,但是出現了一種以用戶為中心的動畫,我們稱之為“微交互”。微交互最初源于移動應用程序,但現在網頁上開始使用這種動畫,并將成為大勢所趨。
 
微交互通常采用反彈效果、頁面三維/深度變化以及大量獨特的顏色漸變等形式來隱藏和展示頁面元素。

 
上面的示例就是一個很好的懸停之后的微交互UI動畫
 
這類動畫通常適用于卡片式布局設計。鼠標懸停時,它會顯示項目更多信息。您可以在產品、圖庫或幾乎任何采用網格布局的地方使用它。
 
但微互動不一定采用程序代碼實現。例如,下面這張圖片就采用CSS浮動動畫效果來實現輸入Email的交互。

 
如今有很多網站提供開源腳本動畫,你在網上很容易就能找到自己想要的效果。其中,CSS3和JavaScript是控制微交互的主要方式。我們經常采用的腳本是anime.js,推薦它的原因是它幾乎可以用于任何類型的微交互開發。

 

“特色”認證


以前,認證信息通常會出現在一些大品牌公司的網站上。但隨著互聯網信任機制的發展,很多小微公司也開始在其網站上展示自身所獲得的認證信息,以便更好地告訴訪客:這家公司是很好的、這是個偉大的產品,因為權威機構都有認證過。

 
當然,這里的認證信息也可以是一些知名媒體或雜志對貴公司的評論和報道,而現在獲取這類信息一般不難。

 

對角線及傾斜設計


現在使用CSS3可以設計出一些非常瘋狂的東西,網頁布局也比以往任何時候都更容易構建,很多網頁設計師開始采用傾斜或彎曲布局來避免網頁形式過于古板。

 
比如上面的圖片就采用了傾斜布局以及自然的漸變色來讓網頁效果更突出。
 
當然在此設計理念上,你也可以采用對角線或多邊形布局,如下圖:


 

排版中的動態效果


上面我們提到了“微交互”和它在網絡上的快速增長。這其中,微交互的另一個核心就是排版。排版的動態效果將會很快流行。

 
以上圖片就是網頁載入后排版動態效果,因為這個效果,網頁顯得更加生動。我們公司網頁就是采用了大量排版方面的動態效果來讓內容展示獲得更好地效果。瀏覽商智網絡首頁
 

支持寬屏顯示


在我們之前的文章中已經很多次提到響應式設計。即便移動設備再普及,臺式電腦依然是工作的首選。而隨著顯示屏越來越大,網頁在適配多種設備的前提下也要適應更大分辨率的顯示設備。
 
 
例如,國外知名圖庫網站Dribbble的瀑布流布局就是一個很酷的樣式。
 
它基本上可以用縮略圖填充所有可以延展的行和列。上面的屏幕截圖是在我的1920px顯示器上截屏的,我覺得Dribble支持的屏幕比這還要大!
 
這種寬屏布局樣式在博客或內容網站上效果不佳,因為很難閱讀冗長的段落。
 
但對于商業網站、社交網絡或非常詳細的網絡應用程序,反而是越寬越好。
 

3D按鈕效果


廣受歡迎的扁平按鈕和幽靈按鈕已經存在了幾年,并且都很好地融入了各類設計中。
 
但我們最近看到的另一種按鈕樣式是3D按鈕。

 
這是底部邊框比主按鈕顏色深的地方,因此看起來按鈕像是從頁面上浮起來的。當你點擊整個按鈕顯示下沉。
 
3D按鈕效果通常會鼓勵用戶進行更多的互動,但是你需要有合適的布局才能讓這個正常工作。
 

無障礙性內容直達


雖然現在很多網頁設計的很精美,布局很合理,但是網站的很多內容都是動態的,人們需要可以方便的訪問才能讓這些內容有價值。
 
你可以采用一下動態元素來讓它們更容易讓人們訪問:
 
下拉式導航菜單
照片幻燈片
模態窗口
Ajax支持的表單
 
當然,這種趨勢在大多數網站上只占少數。但我我們認為,隨著時間的推移,人們越來越難忽視無障礙性。
 

FlexBox和CSS網頁布局


就好像CSS3規范發布的時候,從那時起,我們看到了一系列新的屬性添加到規范中,在布局開發方面有了巨大的進步。
 
使用flexbox,你的工作將變得更加靈活,flexbox允許內部容器自動適應其父容器,所有這些你都可以在CSS中定義規則進行控制。

 
flexbox完全消除了對某些布局中的浮動的需要,并為開發人員提供了更多的能力。
 
同樣,使用CSS動態特性也使得編寫網頁布局變得更加容易。

 

保持關注只為更好


現在很難預測哪些設計趨勢將在2019年流行,但我們總是喜歡觀察網頁設計每年的變化,以獲得未來幾年的創造性設計晴雨表。
 
這些只是我們的預測,但我們相信還會有更多的優秀形式。如果你有其他建議,歡迎分享你的想法。
 
無論未來12個月的趨勢是什么,網頁設計行業肯定會發生變化。
吉林十一选五开奖号码