你網站的導航可以成就或破壞你網站訪問者的瀏覽體驗。如果你在架設和建立網站時沒有花費精力和時間來規劃你的網站佈局，並在沒有邏輯的網站結構下在網際網路中發佈和運行你的網站，你的網站訪客在進入你的網站時將像進入一個宛如迷宮的地方，他們將在沒有任何地圖和導航指引的情況下吃力地在你的網站中摸索。這顯然不是一種令人感動預約的瀏覽體驗。許多架站新手往往會犯下的一個致命錯誤是——過於注重開發網站功能和設計而忽視網站結構的重要性。這就是為什麼我們今天準備了這篇關於建立有效網站導航的建議的文章，我們希望用戶在閱讀此篇文章後了解網站導航對網站瀏覽體驗的真正價值和意義。
文章綱要：
1. 網站導航的重要性
2. 網站導航的類型
3. 網站導航最佳實踐
4.透過 Strikingly 建立網站導航
5. 文章總結
1. 網站導航的重要性
如果你的網站缺少導航，訪問者將很難在短時間內找到他們真正感興趣的內容。比如他們也許只想查閱你特定的網站版塊或頁面，比如產品頁面，部落格版塊，聯繫資訊或幫助文檔。網站導航是用戶體驗和網站設計中最被低估的方面之一，請記住，你希望人們留在你的網站上持續瀏覽你的內容。
2. 網站導航的類型
網站導航分為三種類型。它們使你的訪問者可以輕鬆瀏覽你的網站，並在正確使用時找到前往所需位置的方式。
- 全局網站導航
使用全局網站導航時，網站所有頁面上的選單和連結都是相同的。現如今大部分網站都在使用這種類型的網站導航類型。
- 分層網站導航
在分層網站導航中，選單會根據每個頁面的上下文而變化。例如，當你打開一份電子報內容時，標題選單通常會包含指向最新電子報類別的連結。
- 本地網站導航
與分層和全局導航相反，本地網站導航是指嵌入在內容中的內部連結。用戶通常會看到與層次結構相同或更低級別的選項，以及指向其他相關頁面的連結。例如，雜誌網站經常使用連結來幫助讀者更深入地了解特定文章的上下文。如果你對垂直導航還不瞭解的話，點擊這裏瞭解更多。
圖片取自Strikingly用戶網站
3. 網站導航最佳實踐
- 使超文本更易於被分辨與查找
如果你的網站訪問者無法從正文中分辨出超連結，那麼就意味著你的內容結構設計不夠有效。記住！你應該始終使超連結文本從頁面的其餘部分中脫穎而出，比如你可以將其設為粗體、或添加下劃線或更改字體顏色。如果需要，你甚至可以將標題導航連結變成按鈕。除了超文本，你還可以添加錨定連結，這也是一種有效的導航手段，點擊這裏了解。
- 讓你的導航欄更人性化
在建立網站導航時，你不僅要考慮你希望訪問者在你的網站上做什麼，還要考慮他們可能想要什麼。例如，你可能希望讓你的網站訪問者更多地進行轉化，但他們也可能想了解更多關於你的公司或理念的資訊。如果你的網站導航選單顯得雜亂無章，請考慮重新組織你的網站。
- 分離側邊欄
側邊欄不應與頁面內容的其餘部分顏色相同。許多網站會透過使用鮮艷的顏色來實現這一點。除此，網頁設計師還可以選擇為側邊欄使用與正文不同的背景顏色甚至進行留白。
- 為你的網站導航建立一個標準位置
你不能忽視網站設計方面的創意，但也絕不能以犧牲用戶體驗為代價。你應該始終謹記將你的網站導航功能放在顯而易見的地方。
- 不要忘記包含頁腳
圖片取自Strikingly用戶網站
充分利用你的所有網站空間，包括網站頁腳。在某些情況下，你可以直接在網站頁腳中重複嵌入你的網站標導航欄內容。這樣，人們將不再需要向上滾動來找到網站導航。
- 仔細檢查網站導航是否適合行動設備
圖片取自Strikingly用戶網站
如果你的網站導航無法在行動設備上運行，那麼你就有大麻煩了。利用每個主要內容管理系統中可用的響應式設計和主題並確保連結足夠大，可以很容易地被人點擊。
- 建立號召性用語的按鈕
圖片取自Strikingly用戶網站
雖然大多數網站都有網站導航按鈕，但有時用戶並不一定願意花費精力去閱覽你的網站導航。這種情況下，你可以考慮建立號召性用語按鈕，好引導你的網站用戶轉到你希望他們看到的內容中。
4.透過 Strikingly 建立網站導航
組織良好的網站導航系統使你的網站訪客更容易瀏覽你的網站。你的客戶還能夠更專注於你網站上重要的資訊和內容，而不至於被選項淹沒。透過 Strikingly，你將能夠透過多種方式建立你的網站導航選單，包括佈局、間距、顏色和字體大小。
圖片取自Strikingly產品
如果你的網站包含過多的圖像，例如你在其中發佈你的線上作品集，你可能需要考慮使用垂直導航。這對於具有較長標題的選單選項特別有用。
圖片取自Strikingly產品
5. 文章總結
大多數被認為對用戶不友善的網站都會犯的一個常見錯誤是——在網站導航欄中添加過多的連結。如果想真正建立一個有效的網站導航，你就不應該簡單地複製和照搬其他網站的佈局和設計，而是應該花費時間去確定哪些導航元素真正對你的公司和目標受眾最重要。如果對內容有疑問，可以透過 support@strikingly.com 與我們聯絡。
