爲網站設計導航就如同爲房子打基礎。如果地基不牢靠，再壯觀的設計也無法掩蓋建築結構的潛在風險，其實網站也是如此，如果想讓網站擁有優秀的用戶體驗，良好(hǎo)的轉化率，可觀的銷售額，你需要花費相當的時間去了解你的用戶需求，精心設計網站的内容，尋求可靠而直觀有效的内容組織體系，而這(zhè)些東西的外化體現，就是網站的導航設計。

什麼(me)是導航？

許多人對(duì)于網站導航設計的認知并不統一。有人認爲，構成(chéng)網站導航的是網頁中的焦點元素，它們讓用戶清晰直觀地找到他們想要的東西。同樣(yàng)的，還(hái)有人認爲導航設計是一種(zhǒng)方法，引導用戶去尋找網站上最重要的信息，以達到銷售或者查詢等目的。這(zhè)些說法都(dōu)沒(méi)問題，它們都(dōu)是導航設計的一部分。

和設計領域的許多東西一樣(yàng)，導航設計并沒(méi)有一個統一一緻的“官方”的設計方法，或者說法，每個網站由于其目标、需求、設計手法、運營等諸多因素導緻它們在導航設計上千差萬别，但是在最基本的設計思路和組織結構上，導航設計還(hái)是有基本的規律和原則，确保組織架構可靠，降低失敗的機率。

70percentpure 使用了最簡單常見的垂直和水平導航來引導用戶。

1、首先确定信息架構

規劃一個大型網站，規劃好(hǎo)内容是進(jìn)行導航設計之前的第一要務。而我們此處所說的信息架構（IA，Information Architecture），是合理的組織信息的展現形式，支撐起(qǐ)網站内容的骨架。信息架構的主要任務是爲信息與用戶認知之間構建一座暢通的橋梁。

從更高的位置來看待網站内容有助于信息架構的搭建。更重要的是，你得學(xué)會從用戶的角度來看待網站内容。這(zhè)也就意味著(zhe)，有的時候你得站在正反兩(liǎng)個位置來看待同一個東西，不同視角下你會發(fā)現有的内容的呈現方式非常反人類。你可以通過(guò)下面(miàn)的問題來完善整個架構：

·哪些頁面(miàn)是這(zhè)個網站必不可少的？

·從宏觀架構上來看是否每個頁面(miàn)都(dōu)有其獨立的目的，它們的存在是否影響整體的連續性和可靠性？

·有哪些内容是需要在將(jiāng)來持續提供并更新的？

·網站所需要涉及到的用戶群有哪些？（登錄用戶、訂閱用戶、廣告商等等）

·針對(duì)每種(zhǒng)用戶，網站所要達成(chéng)的目标是什麼(me)？

思考這(zhè)些問題能(néng)夠幫助你更好(hǎo)的完善網站的信息架構，爲導航設計做好(hǎo)準備。

2、保持簡單

絕大多數的網站浏覽者可能(néng)會一緻的認同這(zhè)一點：網站的導航區域要盡可能(néng)設計的簡單。的确，複雜而擁擠的導航欄設計會嚴重阻礙網站的整體可用性。

内蒙古網站制作，内蒙古網站設計，内蒙古網站建設，呼和浩特網站建設，呼和浩特網站制作、呼和浩特網站設計首選内蒙古呼和浩特先誠網絡科技公司。先誠官網：/

彭博的網站就是這(zhè)樣(yàng)做的，用簡單的導航欄設計來掩蓋網站的複雜性。

然而，簡單的設計還(hái)是具有欺騙性的。用戶在随後(hòu)的操作中會發(fā)現複雜的信息被(bèi)以一種(zhǒng)看起(qǐ)來簡單的方式包裝了起(qǐ)來。這(zhè)就是信息架構的作用。

以微軟的首頁爲例，網站的導航欄被(bèi)劃分成(chéng)四個項目，考慮到微軟龐大的産品線，這(zhè)幾乎已經(jīng)被(bèi)簡化到了極緻。也正是因此，每個項目的下拉菜單都(dōu)被(bèi)巧妙地分割成(chéng)爲幾段，這(zhè)樣(yàng)一來，導航的層級就清晰了，用戶可以更快地找到他們想要的東西，而微軟也可以將(jiāng)複雜多樣(yàng)的産品和服務，整合到一個看似簡單的導航欄裡(lǐ)面(miàn)。

類似迷你站的子頁面(miàn)中，導航欄也沿用了相同的設計。菜單的設置乍一看和首頁很相似，實際上設計者加入了更多細節，更有針對(duì)性的功能(néng)和服務。

總的來說，這(zhè)樣(yàng)的導航欄設計更加易用了，在保持一緻的前提下，也具備更好(hǎo)的預測性。考慮到微軟的産品體量，産品所需的頁面(miàn)數，微軟官網的設計很明顯是耗費了大量時間叠代開(kāi)發(fā)的産物，殊爲不易。官網在這(zhè)樣(yàng)的組織架構之下，不僅讓用戶的體驗更好(hǎo)了，而且對(duì)于微軟而言也更加便于管理内容。這(zhè)不僅保持簡單，也簡化了複雜。

3、謹慎選擇方向(xiàng)

傳統意義上的電腦屏幕方向(xiàng)是橫向(xiàng)的，這(zhè)也使得縱向(xiàng)下拉菜單，在很長(cháng)的一段時間裡(lǐ)面(miàn)成(chéng)爲了導航欄設計的主流方向(xiàng)。這(zhè)樣(yàng)的設計，平衡且少幹擾，從設計的角度上來看是不錯的選擇。

作爲虛拟現實設備制造商的Oculus，將(jiāng)導航設計成(chéng)爲橫向(xiàng)的非常符合他們的設備的自然邏輯。

但是橫向(xiàng)的導航并不一定符合所有的網站的需求，這(zhè)也是爲什麼(me)你會看到那麼(me)多縱向(xiàng)導航的網站，尤其是在電商領域。彩色的标簽被(bèi)用來标識不同的品類，縱向(xiàng)的導航設計，與現實世界中的導購圖冊暗合。這(zhè)樣(yàng)的導航符合多品類，多内容的信息架構，橫向(xiàng)導航用在此處會因爲品類和文字内容而産生混亂。

一個良好(hǎo)的垂直方向(xiàng)的導航，要設計好(hǎo)并非易事(shì)，尤其是當你的網站内容非常多的時候。Jack Jones 的網站是一個很好(hǎo)的學(xué)習對(duì)象。

網站導航中的小圖标擁有不錯的可讀性，簡單的形狀包含了可觀的信息，整齊而有力。每點擊一個類别，菜單展開(kāi)，顯示子類，邏輯清晰。

當然，你還(hái)可以在Squarepusher 的網站看到相對(duì)不同尋常一些的縱向(xiàng)菜單設計。導航被(bèi)設計成(chéng)标簽頁，訪客可以通過(guò)滾動切換，這(zhè)是一種(zhǒng)更爲線性的導航欄設計。

結語：規則正在改變

新工藝新技術的不斷湧現，使得新的設計趨勢和新的挑戰源源不斷呈現在我們面(miàn)前。響應式網頁設計使得桌面(miàn)上傳統的橫向(xiàng)導航在移動端呈現的時候，更多是以縱向(xiàng)導航的形式表現出來。導航的設計不再被(bèi)固定的方案所束縛，多種(zhǒng)多樣(yàng)的表現手法都(dōu)可以産生不俗的效果。但是，設計和測試的叠代方法，最好(hǎo)還(hái)是圍繞著(zhe)網站轉化率和統計數據來進(jìn)行。

作爲驅動網站發(fā)展的引擎，導航設計的好(hǎo)壞是可預計的，精心布置又簡單一緻的。

注：本文均來自百度搜索，如涉及版權問題，請聯系我們，我們會第一時間解決。