設計師通過導航結構幫助用戶瀏覽網站，但僅有合理的導航結構和功能還不夠。導航不但要告訴用戶接下來去哪兒，還要告訴他們當前在哪兒。網站里的每一個頁面都有可能是用戶看到的第一個頁面，因此每一個頁面都應該有足夠的場景信息，引導用戶迅速找到去往目的地的路徑。

通過頁面搜索來瀏覽網站就像是在陌生的城市里隨便下了一站車。有效的標志是非常重要的。圖片源自RK Photography

商場走廊的墻上常常會貼上地圖告訴人們他們現在在哪兒，為他們辨明了方向。圖片源自Britain W.

用戶不總是會走正門

在搜索引擎的幫助下用戶可以在網站里隨意瀏覽，因此提供當前所在位置的提示十分重要，這樣用戶才不會迷路。即便他們是通過首頁進入到網站，在瀏覽其他頁面的時候也需要方向的引導。

位置標識讓用戶瀏覽目標頁面時更放心。與火車站類似，網站的位置標識包含色碼、亮度、符號、箭頭、路徑，以及位置名稱。在用戶感到迷惑、擔心，或是迷路的時候，這些標識可以幫助他們確信接下來該去哪兒。

讓用戶一眼看出網站主題及當前頁面主題。網站里的位置標識常常通過導航、圖標或者菜單的外觀變化來實現。面包屑導航和頁面標題的作用尤為明顯。購物結算流程和應用安裝向導也傾向于以步驟名稱和數字為用戶導向。

典型的“你在這兒”機制

LOGO和品牌：LOGO可以告知內容的歸屬，且和首頁關聯。另外，注冊商標、調色板、簽名字體等品牌元素也能激發用戶對一個組織機構信用度的認知。通常LOGO和品牌位于網站頁面的左上角；這個位置很容易被用戶一眼看到，不管用戶用的是哪種設備。

導航的變化：當用戶選擇了某個主題的時候，與導航相關的鏈接或圖形元素（分頁選項卡、按鈕、符號等）在視覺上會有更顯著的變化，通常以顏色高亮、或者移動的方式呈現（有的時候為了突出效果兩種方式會同時使用）。

主題：左對齊的標題符合從左向右閱讀的規律，能讓用戶快速獲取關鍵信息。一組不同級別的主題也可以讓用戶馬上了解到其他內容和路徑信息。

窗口（頁面）標題：在搜索引擎結果、RSS訂閱、新的RSS閱讀器、書簽、歷史記錄列表中，HTML標題位于每個窗口或分頁的頂端。獨有的描述性標題表明了其歸屬、信息組織方式以及頁面的特定內容。

URL：適當、可讀的網站地址對鏈接地址的分享，網站的信用度、辨識度，以及撤銷操作功能有舉足輕重的作用。它揭示了網站的信息構架，幫助用戶在場景中更好地了解網站內容。

面包屑：面包屑的鏈接路徑清晰展示了信息層級（當前所在位置及如何返回）。和URL一樣，面包屑也能告訴用戶剛剛瀏覽過的路徑，并且更具探索性。

場景線索：無論從時間角度還是網站的信息構架方面來看，日期、標簽、圖標以及其他符號標志也常用于幫助我們在恰當的場景中更好地展示信息。

視覺設計的變化：彩色編碼、品牌變化、及其他一些明顯差異都可以作為位置變化的標志。網站中的彩色編碼（主色調隨網站區域而變）常常伴隨著風格迥異的內容。例如，雜志、新聞網站、還有許多組織機構會通過顏色和品牌的變化來區別不同的特性、部門、產品系列等。

步驟：通常，購物結算步驟以及其他的順序任務流被賦予了每一步的名稱和序號，以告知用戶目前是第幾步、要執行什么任務。這些步驟標識一般位于頁面的水平上方或者垂直展現在左側。他們幫助用戶了解整個任務流有哪些步驟、目前處于哪一步驟，激發用戶的正確預期（讓用戶明白下一步是什么）。

網站BBC新聞通過（1）logo和品牌，（2）導航條的變化，（3）主題，（4）場景線索讓用戶明確當前所在位置。這個頁面的標題和URL包含了文章的標題和網站的名稱。

麻省理工大學開放課程的網站有非常明顯的位置標識：（1）品牌，（2）導航條的變化，（3）面包屑導航，（4）主題、頁面標題及URL。但是這個頁面遺漏了一個重要的可見性信息，時間場景。

頁面標題和URL對展示信息場景和位置也很有幫助：

麻省理工大學開放課程網站的頁面標題為：Readings | Introduction to Technical Communication: Explorations in Scientific and Technical Writing | Comparative Media Studies/Writing | MITOpenCourseWare（路徑很長，但是展示清晰、關鍵詞明了）

其URL為：http://ocw.mit.edu/courses/comparative-media-studies-writing/21w-732-5-introduction-to-technical-communication-explorations-in-scientific-and-technical-writing-fall-2006/readings/

該網站中，教科書的出版日期（1995-2003）暗示著文章已經過時，但URL中卻有意提供了課程的時間（2006）。這里最好能在頁面里具體展示出課程的時間，好讓學生們知道這是一篇老舊卻依舊經典的文章。頁面底部（整個網站皆如此）的版權信息雖然給出了2001-2015的提示，但這個時間范疇對于科技內容來說太久了。

紐約公共圖書館網站的黑色導航條選中任意一個主題后，被選中的主題顏色由黑變紅。這一變化展示了導航條的層級結構和內容信息。網站的LOGO、品牌以及可以來回切換主題的導航條都對用戶當前位置的展示起到了積極作用。

在復雜的網站信息結構中展示最深級導航條的變化是有難度的。但面包屑導航做到了。歐洲太空總署網站的復雜構架和面包屑導航向用戶展示了清晰的位置標識。（盡管還是有點令人困惑，理由是2014年拍攝的照片被歸屬到2015年——有可能2015年是照片的發布年限。）

為有效的位置標識進行測試

很多網站的位置標識由于太不起眼而導致無法有效地傳達位置信息。設計師對自己設計的網站結構了如指掌，不需要刻意的位置標識，因此設計師眼里的網站設計與其他人是有差異的。相反，對于網站的訪客——新用戶或偶爾訪問的用戶——來說，一切都是新鮮有趣的。因此，一個對設計師來說很明顯的位置標識不一定能被訪客注意到。人們很容易忽略細節。

什么時候測試

現有網站隨時可以。

對于新網站的設計，最好在視覺進展到高保真階段前就執行好測試。列出所有網站在正式運轉情況下能干擾用戶的真實內容，尤其是廣告、動效、照片，因為這些設計元素最能影響用戶注意力。

怎么執行測試

向測試者展示網站不同層級的頁面，每次展示一個、不提供導向幫助。

對測試者提問：“假設這是你第一次訪問這個頁面。你知道自己處于網站什么位置嗎？”

若測試者給出反饋（正確或錯誤的答案），接著問：“你是怎么知道的？”

若測試者不確定，再問：“你會希望這里有什么樣的標識幫助你找到當前位置？”

若測試者還是不清楚自己在哪兒，繼續提問：“為了弄明白自己在哪兒，你通常會怎么做？”

避免把導航路徑設計成死胡同。有時URL也會因打不開而毫無作用。這種情況下，給出幾個位置鏈接、讓用戶嘗試去訪問感興趣的頁面，而不是只留下一個空白頁面，這樣用戶可以重新計劃新的瀏覽之旅。該網站頁面向用戶表達了歉意，并建議用戶重新檢查網頁地址；此外，還提供了索引鏈接、網站的全局導航、檢查網站狀態的路徑、以及聯系網站工作人員的鏈接。無結果的搜索結果頁的處理方式也與此類似。

總之

只有讓用戶參與測試才能確保網站的導航路徑設計是否正確無誤。如果測試結果顯示用戶只是漫無目、這兒看看那兒看看、或是原路返回，說明你的網站構架還是存有問題，要么是位置標識不夠突出、放錯地方，要么是導航層級、頁面標題等不夠完善或有誤導性。

有關歷史記載

有趣的是，對用戶在“多維空間（復雜的網站構架）中迷路”的擔心在萬維網之前就催生了許多富有創造性但卻很復雜的解決方案。樂觀的是我們現今的網站已經運用了一些實際可行的微創新，并且用戶可以通過返回按鈕回到自己熟悉的領域。

譯者簡介

小媛，神經認知語言學碩士  現從事互聯網產品設計  熱衷于用戶體驗和交互設計