Chapter6 街頭指示牌和麪包屑
在商場，我們如何購買東西呢？我們會看商場的標誌，然後尋找合適的道路，直到我們找到想要的產品。當然，我們也可以直接找
到服務員進行詢問。
在很多方面，進入站點之後，我們往往遵從同樣的過程:
1.你通常是爲了尋找某個目標
2.你會決定先詢問還是先瀏覽(某些搜索狂人總是一到某個網站就開始尋找搜索框)
3.如果選擇瀏覽，你將通過標誌的引導在層次結構中穿行
4.最後，如果你找不到想要的東西，你會離開
當然，在web上瀏覽，和實際購物還是不完全一樣的。我們感覺不到網站大小，感覺不到方向，也感覺不到位置。如果想要再次訪
問一個頁面，不是依靠"它在哪裏"的物理感覺，而是記住它在層次上的位置，然後順着找過去。
因此，Web導航有三個十分重要的作用：幫助我們找到想要的任何東西和告訴我們現在身在何處。同時，它給了我們一些固定的感覺，讓我們覺得
腳踏實地。除此之外，導航告訴我們網站上都有些什麼，告訴我們如何使用網站，還給了我們對網站建造者的信心。
談了web導航的作用之後，開始討論如何進行導航的設計。
Web設計師使用術語"持久導航"或"全局導航"來描述出現在網站每個頁面上的一組導航元素。它應該包含五個元素: 站點ID，回主
頁的方式，搜索的方式，實用工具，欄目。這裏所說的"每個頁面"，不包括主頁和表單呢。主頁設計會在第七章中講到。
網站ID：網站logo相當於建築物的名字，不同的是，我們需要在每個頁面的上方看到站點ID。要讓它出現在頁面可視層次的首要位
置，並且看起來要像個站點的標誌。
欄目：也稱主導航條，是到達站點主要欄目的鏈接，即站點層次結構的最頂層。
實用工具：網站中不屬於內容層次的重要元素的鏈接。如，幫助，購物車等。持久導航上一般只放4-5個實用工具，放太多會顯得
擁擠。
回主頁的方式：持久導航中最重要的元素之一是把我們送回主頁的按鈕和鏈接。一個新興的做法是，讓站點id同時也也作爲一個回
到主頁吧按鈕(在ID後加上home字樣)。
搜索：大多數站點都應該提供搜索框。搜索框的設計，記住一個簡單的公式:一個輸入框、一個按鈕、還有"search"字眼。注意，如果存在任何混淆
搜索範圍(是搜整個站點、部分站點、還是整個web?)的可能性，一定要寫出來。
如果需要爲搜索提供選項，在它有用的時候再提供，比如，到到達搜索結果頁面，發現搜索結果太多時，需要縮小搜索範圍。Amazon 是最初幾家在搜索框中拋棄Title /Author /Keyword選項的網上書店之一，搜索的靈活性很是方便。當然，如果打算提供選項，要保證他們確實有用。當我在IMDB上搜索時，輸入badges，使用默認的搜索範圍(All)，只找到一個匹配結果，當把範圍改成quotes時，則找到了多個結果。這樣合理嗎？
Web設計中，存在一個常見的問題：沒有對低層次的導航給予足夠的重視。
爲什麼？一個良好的多級導航本來就很難設計，而設計師的時間往往不夠，又不太重視低級導航，因此會在設計時，忽略掉。對用
戶來說，底層導航和頂層導航同樣重要。
除了持久導航之外，一個網頁上，還應當注意以下幾個元素：
（一）頁面名稱
頁面名稱就是web上的路牌。和路牌一樣，如果一切順利，可能根本不會注意到它，但一旦發現自己可能的方向不對，就需要毫不
費力的看到頁面名稱來確定方向。注意以下四點:
1.每個頁面都需要一個名稱
2.頁面名稱需要出現在合適的位置，在視覺層次上，應當出現在涵蓋該頁內容的位置
3.名稱要引人注目，體現出這是整個頁面的標題
4.名稱要和點擊的鏈接一致，我點擊了一個"熱土豆泥"的按鈕，網站應該把我帶到一個名爲"熱土豆泥"的頁面
（二）"你在這裏"
要抵消網絡固有的空間迷失感，其中一種導航方式是告訴我當前的位置。可以用突出我當前的位置來做到，不管是在頁面的導航條、列表還是菜單
上。如下方式可以標記當前位置:在旁邊放一個指示器、改變文字的顏色、使用粗體、按鈕反白、改變按鈕的顏色。
（三）麪包屑
麪包屑也告訴你當前的位置。"你在這裏"指示器告訴你所在站點層級結構的前後關係，而麪包屑只告訴你從主頁到當前位置的路徑。
在大多數網站中，我並不認爲麪包屑這一種導航機制就夠了，她它們不能很好的替代兩層層次的導航顯示，因爲它表現力不夠。它可以做兩件事:回
退一個層次，或者去主頁。它可以作爲固有導航機制的一個補充。
關於麪包屑的設計，注意以下幾點:
1) 把它們放在最頂端，讓它看起來像是補充機制
2) 使用">"對層級進行分隔
3) 使用小字體
4) 使用文字"你在這裏"，讓它自我解釋
5) 將最後一個元素加粗
6) 不要把它用作頁面的名稱，因爲位置上不合適
（四）標籤
標籤，把物體分成不同部分，而且通過突出的標籤就可以翻到該部分的對應位置。許多網站使用標籤來導航。
1) 它們不言而喻
2) 它們很難錯過
3) 它們很靈活，讓頁面看起來很有趣
4) 它們創造出一種錯覺，當前的標籤出現在最前面
（五）Amazon對標籤導航的設計
如果想要使用標籤，請參考Amazon經典的標籤設計，務必模仿其中三點:
正確繪製：激活的標籤頁位於其他標籤頁之前，要有彈出感和顏色的對比
顏色編碼:爲站點的每個欄目使用不同的標籤顏色，並把這些顏色用到頁面的導航元素上。
選中：當你進入一個網站時，有一個標籤已經選中
（六）後備廂測試
把你放在某個網站的某個頁面上，如果這個頁面設計良好，你應該能立即回答出這些問題:
1) 這是什麼網站？
2) 我在哪個網頁上？
3)這個網站的主要欄目有哪些？
4)在這個層次上我有哪些選擇？
5)我在導航系統的哪個位置？
6) 我怎麼搜索？
Chapter7 主頁不由你控制
想想，主頁需要完成什麼任務:站點的標誌和使命，站點層次，搜索，導讀，內容更新，友情鏈接，快捷方式，註冊，我在尋找的東西，告訴我從哪
裏開始，可信度和信任感………… 一大堆的事情，而且通常，還要面臨一些約束：每個人都想佔據一席之地，每個人都想參與它的設計，一個尺寸要
適合所有人。
在這一片混亂中，往往有一件事被忘掉:傳遞整體形象。第一次進入一個新網站，主頁應當回答我頭腦中的四個問題：這是什麼網站？我能在這裏做
什麼？網站上有些什麼？爲什麼我應該在這裏，而不是別的地方？
如何傳達整體形象呢？
口號: 在靠近站點ID的位置，對網站所做的描述
歡迎廣告:網站的簡要描述，在主頁的首要位置顯示。
除非是比較特殊的網站，沒有必要使用大量空間來表達基本主張，設計完成後，需要拿給公司外面的人看，是否達到了目標。
口號是非常有效的信息傳達方式，因爲它們是用戶最希望能夠找到關於網站描述的地方。好的口號，要清楚、言之有物，長度適中(6~8)，表達出網
站特點和顯而易見的好處，別太籠統，個性、生動、俏皮。
從哪裏開始？
當進入一個新的網站，快速掃描之後，應該清楚的知道，如果我想xxx，應該從這裏開始。要讓每個起點看起來像起點，還要加上文字描述，例
如，"搜索"，"分類瀏覽"，"登陸"。
主頁導航
主頁要儘可能多的顯示網站的內容，因此，你想爲每個欄目名稱增加一些描述，甚至列出下一級欄目。主頁導航的佈局也可能不同。但是，也要儘量
和持久導航保持一定的一致性。欄目的名稱要保持不變。
下拉框的問題
由於主頁空間實在有限，設計師常常用下拉框來創造一些空間，下拉菜單會有一些明顯的缺點: 必須點擊下拉框，才能看到下拉列表；菜單的可讀性
較差；列表的收縮和顯示很快，不好控制。下拉框，對於按照字母排序的項目最有效，例如，國家省份等。其他情況下，效率就比較低。
不要殺死金鵝
設計主頁時，最糟糕的行爲，是要試圖推銷所有的產品。在主頁上推薦的效果太好了，任何項目都想在主頁上進行推介。但是，過多的推介會讓主頁
變得混亂，這就是所謂，共有區域的悲劇(Tragedy of Commons)。任何共享資源都會因爲過度使用而遭到破壞。可以考慮輪流使用主頁上的推介空
間，或者到其他熱門版面進行推薦。