不管你喜歡不喜歡,漢堡圖標反正已經是大勢所趨了。今年無數(shù)的網站將這個小元素納入到界面中來,成為頁面導航的重要組成部分。不過漢堡圖標并不是今年唯一的導航設計趨勢。全屏導航、底部導航等許多設計手法都是網頁設計師們的心頭好。今天這篇文章將會對今年所流行的10個導航設計趨勢進行總結,并附上精彩案例若干,記得收藏喲。
1、全屏導航

當導航是整個網頁設計的核心的時候,頁面會是怎么樣的?只要合理地策劃整合,全屏導航其實是一種非常有效的技術,用戶可以更加便捷地切換到不同的頁面,內容成為更加觸手可及的東西。
全屏導航式頁面可以做的非常明顯,也可以以更加微妙的方式呈現(xiàn)出來。用戶是否真的非得清楚地意識到它是導航呢?并不一定,如果你設計的夠合理,用戶會在無意識間充分運用起它的導航功能。
2、底部導航

絕大部分的導航會置于網頁的頂部,這也是最常見的方式。頂部的導航符合用戶的閱讀習慣,也符合通常的網頁設計的邏輯。
但是置于底部的導航欄更有意思,它的設計不再拘泥于頂部導航設計的規(guī)程,它可以設計得更大,在許多單頁式頁面中這種導航的樣式還可以更加自由多樣。
不過這種導航設計最好是常駐于底部,避免用戶迷失,方便定位也易于回到首頁。
3、垂直導航菜單

打破常規(guī)設計的手法有很多,其中之一就是將導航菜當設計成縱向的。垂直的導航設計并不是簡單的將橫向變?yōu)榭v向的就成,你需要結合內容重新思考整個網站的布局和空間的使用。
最流行的兩種這類排版,一種是使用漢堡菜單的隱藏式的導航菜單,另外一種使用的是固定的側邊欄來承載菜單。
第二種菜單的有趣之處在于,它為網站設計提供了一種新的視覺設計可能性。同時,這種導航在小屏幕上可以做成懸停隱藏式的,需要的時候點擊顯示。
4、無導航模式

有些規(guī)模較小的網站會選擇使用無導航的輕量級框架來設計網站,這里需要的注意的是,這類網站通常是單頁網站。這種設計其實是可行的,尤其是用作預告、預覽或者介紹功用的時候。
如果你的網站包含諸多頁面,其實并不推薦這種設計,盡管有的網站還真就是這么做的,并且做的不錯。Quincy Requin & Associes 的Q&A頁面就是這么設計的,每個問題鏈接到一個獨立的頁面。這種功能的獨特性使得這種設計顯得并不突兀。
5、滑出菜單

滑出式導航菜單已經流行了一陣子了,這種設計讓移動端的頁面設計體驗更加優(yōu)秀,當用戶打開頁面的時候第一眼看到的會是主要的內容而非菜單,給用戶更好的第一印象。耳熟能詳?shù)臐h堡圖標在這種場合下出鏡率也非常之高。
當然,這種滑出菜單的設計也可以非常靈活的運用在大屏幕上,響應式全屏滑出導航也可以給人愉悅的體驗,畢竟很少有桌面網頁會享有如此“移動端”的設計福利。
6、巨型菜單

這種大型的導航菜單設計在幾年前有短暫的流行,并且大多運用在擁有大量細分內容的企業(yè)站點。由于這種導航菜單的設計并不適宜于移動端的顯示,因此并未大規(guī)模流行。不過現(xiàn)在設計師開始重新考慮這種巨型菜單在今天使用的可能性。
作為大型零售企業(yè)的Target ,目前就采用的這樣的設計。這個巨型菜單的完成度極高,兩級式的菜單設計,第一級常駐于頁面,第二級菜單占據(jù)的空間是固定的,這樣一來看起來頗為整齊。這樣的設計會讓頁面看起來整齊而干凈。
7、動畫導航元素

動效是近年來的設計重頭戲,而它在導航中得到更多的運用也是自然的事情。當動效融入導航設計中的時候,并不需要過于復雜的展現(xiàn)。
漂亮的懸停動效,或者利落的跳躍效果,都可以用來引導用戶。案例中的導航設計也非常貼心,導航借助動效延展成為彩色的線條,增加用戶點擊的面積。動效不僅讓用戶知道他們在哪里,而且以更加清晰的方式引導他們去點擊。
小巧微妙的動效不僅帶來不錯的視覺加成,而且為用戶帶來驚喜,鼓勵用戶操作,提示用戶界面的邊界。
情非得已
40款優(yōu)秀的色彩搭配網頁設計案例欣賞2013-11-16
70個暗黃色風格的復古網頁設計欣賞2013-09-17
精選國外紅色大氣的網頁設計欣賞2013-08-15
精選設計師朱騰鵬網頁設計作品欣賞2013-07-31
35個國外超贊的蘋果APP網站設計欣賞2013-06-17
2010年網頁設計的流行與趨勢2010-06-27
50個漂亮的藍色網站設計欣賞2010-06-25
讓你一眼就能記住的博客設計欣賞2010-06-23
50個黃色為主的網頁設計欣賞2010-03-15
26個創(chuàng)意布局的網站界面設計2010-02-03
極簡主義的設計師個人網頁設計欣賞
相關文章6142017-12-11
網頁設計師必收的實用網站作品欣賞
相關文章2552016-10-24
那些有趣的作品展示網站設計欣賞
相關文章5742016-08-22
創(chuàng)意爆棚的設計作品展示網站設計欣賞
相關文章7772016-06-16
精選國外絢麗的作品展示頁設計欣賞
相關文章5572016-05-22
8個有趣有特色的國外插畫師官網設計
相關文章5182016-03-20
電商網站商品頁設計超全面指南分享
相關文章4962015-01-28
2014年國外優(yōu)秀的網頁評選作品欣賞
相關文章4012015-01-09
