97爱亚洲,电影在线播放无码

導航設(shè)計：讓導航更輕巧些

時間：2013-04-01 來源：合肥網(wǎng)hfw.cc 作者：hfw.cc 我要糾錯

　　導航是互聯(lián)網(wǎng)產(chǎn)品中利用最普遍的基本元素之一,，領(lǐng)導用戶懂得到網(wǎng)站的內(nèi)容結(jié)構(gòu)進而找到所求,。作為基本控件,，導航看起來簡略，但卻是產(chǎn)品設(shè)計中最龐雜繁瑣的一局部,。由于咱們想要讓網(wǎng)站構(gòu)造更清楚,、想要向用戶轉(zhuǎn)達所有的信息，所以就賦予了導航越來越多的內(nèi)容,，使他們宏大異樣,，非常糾結(jié)。簡化了,，用戶無奈懂得到頁面構(gòu)造以及本人的處境,，發(fā)生迷惑;龐雜了,，導航臃腫不堪，層巒疊嶂,，既不雅觀也不好用,。

　　那么，在清晰的信息架構(gòu)下能不能讓導航盡可能的更輕巧,、更靈動,，是筆者本文想要探討的話題,。筆者看來,，為導航塑身能夠從以下多少個角度來進行：1.簡化結(jié)構(gòu);2.優(yōu)化情勢;3.打磨UI。

2.優(yōu)化形式

　　有些時候,，我們無法斷定用戶在閱讀產(chǎn)品或網(wǎng)站時是否是線性思維,，也無奈對導航結(jié)構(gòu)進行再精簡，那么我們怎么讓導航再“瘦”那么一點呢,。

A.將一維導航變?yōu)槎S導航

　　將一維導航轉(zhuǎn)化為二維導航,，可能有效的減少層疊導航帶給人的反復(fù)感跟復(fù)雜感，可以讓操作富有變更,，進而晉升休會,。

　　相似的列子也有良多：

B.將復(fù)雜的層級獨自處理

　　當某一層級的導航內(nèi)容豐盛到必定水平，他就可以充任一個獨破控件來獨自設(shè)計了,，他們可以作為頁面的元素來單獨存在,，可能看起來都不太像是導航。

　　網(wǎng)站作為信息的聚集體,，要囊括海量的資源,，從首頁到二級頁再到專題頁進而底層頁等等等等，信息的層級多且復(fù)雜,，所以就輕易造成tab套tab再套tab的局勢,。那么作為導航塑身的第一步，我們要做的就是把這負責的結(jié)構(gòu)盡量簡化,，讓導航變得輕盈起來,，或者至少看起來不那么臃腫。

A.通過面包屑來簡化導航結(jié)構(gòu)

　　面包屑通常水平川呈現(xiàn)在頁面頂部,，個別會位于題目或頁頭的下方,。它們提供應(yīng)用戶返回之前任何一個頁面的鏈接(這些鏈接也是能達到當前頁面的門路)，在層級架構(gòu)中通常是這個頁面的父級頁面,。面包屑提供應(yīng)用戶回溯到網(wǎng)站首頁或進口頁面的一條疾速門路,。

　　一個門戶網(wǎng)站常見的結(jié)構(gòu)是首頁-頻道頁-專題頁-子專題-底層頁。如果我們想在門戶網(wǎng)站看NBA的視頻直播,，那么我們來看下他的導航：

　　假如把信息層級全體展當初用戶眼前,，就會構(gòu)成上面的這種tab套tab的情勢,，使得導航臃腫不堪，盤踞頁面很大的空間,�,？墒羌偃缭蹅儼延脩絷P(guān)懷的導航內(nèi)容提掏出來，就會得到下面的結(jié)構(gòu)：

　　再扁平化一下：

　　這就是清晰的面包屑導航,。綜上,，面包屑導航可以讓復(fù)雜的層級結(jié)構(gòu)扁平化，使得導航更加輕巧,。

　　面包屑導航還有一些變體,，是基于用戶線性操作邏輯衍生出來的。在無線端產(chǎn)品中運用更為普遍,，由于挪動裝備的顯示區(qū)域有限,，無力支持宏大的導航結(jié)構(gòu)。在用戶點擊當前導航內(nèi)容后,，當前導航消散進去下一級導航,，并供給返回按鈕。

　　當然,，應(yīng)用面包屑來簡化導航結(jié)構(gòu)也是有前提的,，不是所有的導航層級都可以用這種方法來簡化。面包屑導航更合乎用戶線性思維導向下的操作邏輯,，例如,，用戶想要看NBA直播，那么他必定不關(guān)懷娛樂圈產(chǎn)生了哪些八卦,，也不care足球或者網(wǎng)球有什么消息,，CBA，CUBA他可能也不十分在意,，那么面包屑的線性導航就可以滿意用戶的需要,。或者是因為空間或者裝備起因,，我們無法供給更為具體的導航,，而采取線性簡化導航的處理方法。

B.合并導航層級

　　導航的龐大往往是因為層級過多導致,，那么減少層級的一種有效方式就是合并導航層級,，例如把二級和三級導航合并，就減少了三級導航,，讓導航輕便一些,。

　　如上圖，圖片庫包含動態(tài)圖片和靜態(tài)圖片，每個分類下面又有小的分類,，這樣的導航層級在產(chǎn)品中非常常見,，略顯臃腫。那么通過合并層級就可以把導航精簡到兩級,，處理后的導航如下：

　　瘦身后的導航看起來結(jié)構(gòu)也比擬清楚,，而且不影響到信息的轉(zhuǎn)達產(chǎn)品經(jīng)理。

　　對照下美團和糯米的導航：

　　美團把注冊登錄跟個人信息等功效性導航和網(wǎng)站主導航做了合并處理,，為網(wǎng)站首屏節(jié)儉出了可貴的空間,。

C.暗藏局部導航

　　簡化導航結(jié)構(gòu)的第三種辦法是把部門層級或者導航內(nèi)容暗藏起來，使得導航看上去輕巧一些,。

　　當導航里的內(nèi)容特殊多的時候,，能夠抉擇把重要內(nèi)容留下，次要內(nèi)包庇藏的方式來處置,。例如：

　　當頁面空間有限,，無法包容更多層級的時候,，可以取舍把次層級隱蔽收起,，鼠標滑過或者點擊后觸發(fā)此層級的辦法處理，這樣的例子有許多：

3.打磨 UI

　　說到讓導航輕巧,，UI是最為常用的伎倆,，在此筆者不做太多的陳說，然而須要留神的是,，導航的輕盈與否與導航所處的頁面以及主要水平有很大關(guān)聯(lián),。比方在首頁，用戶須要對頁面有整體認知的情形下,，導航的UI就不能改太輕薄,，而是應(yīng)當先聲奪人，讓用戶直接注意,，并閱讀發(fā)明所求;同樣的,，當用戶進入到相干的頁面開端瀏覽時，導航的作用就是路燈和司南,，這時的導航就不如在首頁時那樣主要,，那么導航就需要微微的、偷偷的在用戶旁邊隨時等候著被留神并應(yīng)用,。

　　電商首頁的導航UI上吸引了不少眼球,，然而到了成果頁導航變成了簡直不裝潢的后果，因為在成果頁,，用戶重要是來瀏覽產(chǎn)品,，所以導航的作用就弱了。

　　綜上，是筆者對導航塑身的一點意識,，清晰的導航可能讓頁面簡略易用,，反之也會大大影響頁面的信息流利度，所以在導航設(shè)計時要精心處置,，一點淺見與大家分享,。交互設(shè)計

本文由http://www***ixueba***/ 整理并發(fā)布！