開始之前先做個(gè)小的知識(shí)普及，老鳥請(qǐng)忽視：
信息架構(gòu)(information architecture)，簡稱IA，wiki給出了以下定義：信息架構(gòu)是在信息環(huán)境中，影響系統(tǒng)組織、導(dǎo)覽、及分類標(biāo)簽的組合結(jié)構(gòu) 。
通俗一點(diǎn)的講，信息架構(gòu)就是合理的組織信息的展現(xiàn)形式。例如一個(gè)電子相冊(cè)，注冊(cè)的時(shí)候需要體現(xiàn)怎樣的說明，單張相片，一個(gè)相冊(cè)集，整個(gè)相冊(cè)的內(nèi)容以及它們之間是怎樣的關(guān)系。而所謂信息，門戶站中的每一篇文章、B2C站中每一件商品、圖片分享站中每一張照片….這些都是基本的信息構(gòu)成元素，即信息元。
.
下面切入正題。
網(wǎng)站導(dǎo)航算是互聯(lián)網(wǎng)產(chǎn)品中應(yīng)用最廣泛的應(yīng)用之一，他們的作用看起來無非就是帶你從一個(gè)頁面前往其他頁面。不過相信大家和我一樣會(huì)遇到這樣的情形，點(diǎn)擊一個(gè)連接后結(jié)果讓你大吃一驚，這并不是你想要的頁面，甚至?xí)屇隳涿睢瓕?dǎo)航看起來簡單，卻是產(chǎn)品設(shè)計(jì)中最復(fù)雜最繁瑣的一部分。在我們探討導(dǎo)航設(shè)計(jì)之前，先明確導(dǎo)航設(shè)計(jì)的目的：幫助用戶尋找信息。
用戶查找信息的四種方法：
訪問者使用網(wǎng)站就是為了尋找信息，當(dāng)他們看到導(dǎo)航系統(tǒng)時(shí)，無非是想更快找到消費(fèi)的內(nèi)容或者完成即時(shí)的任務(wù)。而一個(gè)優(yōu)秀的導(dǎo)航系統(tǒng)將是幫助用戶快速完成任務(wù)的重要途徑。交互設(shè)計(jì)專家Donna Spencer曾經(jīng)撰文《Four Modes of Seeking Information and How to Design for Them》指出了用戶查找信息的四種方法：
1、 已知項(xiàng)搜索：
當(dāng)用戶明確知道他們要查找的信息時(shí)，他們會(huì)使用搜索工具，但是并非所有網(wǎng)站都會(huì)提供站內(nèi)搜索功能，而這時(shí)就必須依靠導(dǎo)航幫助他們到達(dá)他們想去的地方。（Ps：艾瑞報(bào)告曾經(jīng)指出相較于別的網(wǎng)站，購物網(wǎng)站的站內(nèi)搜索功能使用率最高，這點(diǎn)值得電子商務(wù)網(wǎng)站的PM注意）
2、探測搜尋
用戶可能有一個(gè)需求，但是并不能確定什么能滿足這個(gè)需求，這時(shí)候他們會(huì)進(jìn)行探測性搜尋。例如：我想買一款3000-5000的初級(jí)單反相機(jī)，我知道佳能EOS 500D差不多這個(gè)價(jià)位，但是同事又告訴我尼康 D5000 和尼康 D3000 也不錯(cuò)，這個(gè)時(shí)候我可能會(huì)對(duì)三款相機(jī)進(jìn)行篩選，以確定真正的需求。
3、不清楚需要什么
這個(gè)情況還可以細(xì)分出以下兩種狀態(tài)：A、對(duì)于很多娛樂性網(wǎng)站的使用者，他們來的這個(gè)網(wǎng)站可能僅僅是為了消耗工作時(shí)間中的無聊時(shí)段或者打發(fā)午休時(shí)間，他們漫無目標(biāo)的來的這些網(wǎng)站，只是隨便點(diǎn)擊某些頁面。B、我想買一款單反相機(jī)，但是在逛蜂鳥網(wǎng)時(shí)候發(fā)現(xiàn)一些單反相機(jī)使用技巧的內(nèi)容真正引起了我的興趣，于是我將信息查找重點(diǎn)放在了解更多的相機(jī)基礎(chǔ)使用技巧。
4、再查找
人們可能會(huì)返回尋找某些他們已經(jīng)瀏覽過的東西，雖然有瀏覽器書簽、歷史記錄等可以幫忙，不過作為網(wǎng)站設(shè)計(jì)中，我們有必要為用戶提供更多的選擇途徑以滿足其需求。
.
明確了用戶查找信息的基本方法后，我們可以開始探討一些基本的導(dǎo)航工具了。
常見導(dǎo)航分類
1、結(jié)構(gòu)導(dǎo)航，又分為全局導(dǎo)航和局部導(dǎo)航。結(jié)構(gòu)導(dǎo)航主要幫助用戶在web網(wǎng)站的組織結(jié)構(gòu)中導(dǎo)航。

圖1：Flickr的全局導(dǎo)航

圖2：Flickr的局部導(dǎo)航

圖1、2分布展示了Flickr的全局導(dǎo)航和局部導(dǎo)航，一般的網(wǎng)站設(shè)計(jì)者會(huì)將網(wǎng)站的最重要的內(nèi)容放在全局導(dǎo)航，這往往是網(wǎng)站的頂層類別。局部導(dǎo)航會(huì)將你帶到網(wǎng)站層次結(jié)構(gòu)中臨近你所在位置的層次。結(jié)構(gòu)導(dǎo)航對(duì)于已知項(xiàng)搜索和探測性搜尋尤為重要，對(duì)于“不清楚需要什么”的那類用戶也會(huì)幫助很大。
2、關(guān)聯(lián)導(dǎo)航，幫助用戶更快的尋找到相關(guān)信息。
關(guān)聯(lián)導(dǎo)航將一個(gè)頁面與包含該類信息的其他頁面進(jìn)行關(guān)聯(lián)。這樣可以幫助用戶深入瀏覽相關(guān)信息，降低用戶的探尋成本。關(guān)聯(lián)導(dǎo)航特別適合探測搜尋，并且會(huì)幫助用戶驚喜的發(fā)現(xiàn)某些他們“并不知道”卻又興趣十足的內(nèi)容。關(guān)聯(lián)導(dǎo)航主要按照以下形式進(jìn)行信息組織：按時(shí)間、按類型、按主題、按興趣、按所在組…

圖3：百度的相關(guān)搜索

搜索引擎一般會(huì)列出除“搜索詞”以外的類似內(nèi)容，方便用戶進(jìn)行查找。

圖4：某數(shù)碼垂直門戶的側(cè)欄推薦

圖四顯示了電子商務(wù)網(wǎng)站常見的關(guān)聯(lián)產(chǎn)品推薦形式“喜歡該商品的用戶還喜歡xx”和類似產(chǎn)品排行。這種靠關(guān)鍵詞進(jìn)行匹配和“約束條件”進(jìn)行推薦的內(nèi)容往往可以在很大程度上加強(qiáng)用戶的“瀏覽深度”，從而增加網(wǎng)站PV。

圖5：Flickr的tags

Tag（標(biāo)簽），作為國外網(wǎng)站上最常見的一個(gè)運(yùn)用對(duì)于相關(guān)內(nèi)容的瀏覽具有很強(qiáng)的引導(dǎo)性。國內(nèi)用戶對(duì)于標(biāo)簽的使用比率并不高，當(dāng)然國內(nèi)產(chǎn)品設(shè)計(jì)師們對(duì)于tag使用的探索卻一直未停止如被很多交互設(shè)計(jì)師所喜愛的標(biāo)簽云形式，如下所示：

3、可用性導(dǎo)航，補(bǔ)充不適宜組織在結(jié)構(gòu)導(dǎo)航和關(guān)聯(lián)導(dǎo)航中但又不可或缺的信息。可用性導(dǎo)航實(shí)現(xiàn)了頁面與幫助訪問者使用網(wǎng)站本身的特性之間的關(guān)聯(lián)，這包括登錄、用戶信息等特性。主要內(nèi)容組織以外的所有內(nèi)容都可歸入可用性導(dǎo)航。James kalbach 給出了可用性導(dǎo)航的準(zhǔn)確定義：可用性導(dǎo)航將根據(jù)和特性相連接，這些特性可以幫助訪問者使用網(wǎng)站。

圖6：flickr的可用性導(dǎo)航

Flickr的可用性導(dǎo)航將用戶信息、購物車、站內(nèi)信、幫助、退出放置在此，以方便用戶更快的使用和熟悉網(wǎng)站。
可用性導(dǎo)航有一個(gè)慣例，它們總是占據(jù)頁面右上方。通常，可用性導(dǎo)航在那里是因?yàn)閷?dǎo)航系統(tǒng)的其余部分占據(jù)了頁面上方和左側(cè)的位置。頁面右上方雖然不起眼但依舊可以輕松訪問。

圖7：導(dǎo)航布局示意

不知不覺已經(jīng)寫了這么多內(nèi)容，今天只是對(duì)導(dǎo)航設(shè)計(jì)進(jìn)行了一個(gè)簡單的分類，接下去會(huì)針對(duì)每種分類進(jìn)行一些簡單的探索，以拋磚引玉。

原文：http://www.minijuly.com/?p=732