網站的導航欄相當于網站的招牌，起著重要的導向作用，也是用戶瀏覽網站時必須使用的功能。以往的網站設計師大多注重頁面布局和形象美化?，F在他們逐漸意識到，對于一個小小的導航欄來說有很多事情要做，因此越來越多的獨到網站設計師放棄了傳統(tǒng)的頂部導航，在導航欄的設計上玩各種創(chuàng)新的把戲。

一、六大熱門

側導航非常受網站設計者的歡迎。它通常分布在頁面的左側，使頁面的整體布局簡潔典雅，使欄目內容一目了然。在設計側邊導航時，可以將導航和橫幅結合起來，也可以使用與橫幅主色對比強烈的純色，兩者都能給游客一個獨到的視覺印象。與網站頂部相比，網站側面具有更廣闊的可擴展空間，因此當網站需要修改添加欄目內容時，側面導航會比頂部導航進行更好的調整。

底部導航是用戶瀏覽網站的一個挑戰(zhàn)，因為我們都知道頂部導航符合用戶的閱讀習慣。盡管用戶對底部導航或多或少感到不舒服，但不可否認的是，底部導航確實比頂部導航更有趣，在不考慮導航和橫幅比例的情況下，它在設計上可以更加自由。如果網站的定位是喜歡新鮮探索能力的年輕人，選擇底部導航可以給他們更大的驚喜。~

你有沒有想過，打開一個網站是一個巨大的導航，幾乎占據了整個屏幕？那種沖擊力真的不是開玩笑。我們共同網站的主頁是基于橫幅。全屏導航以導航為主頁主體，是一次非常大膽前衛(wèi)的嘗試。如果設計合理，更方便用戶快速切換到不同的頁面。

顧名思義，隱藏導航并不是沒有導航，而是隱藏導航。它與全屏導航相反。它不是一種存在的感覺，而是低調的等待著你。當然，這個搜索過程非常簡單，只要鼠標移動到某個標記或點擊使導航出現。我們常說，滑動菜單實際上是一種隱藏式的導航，它能***限度地顯示網站的內容，給用戶帶來愉悅的體驗。

滾動導航在單頁網站中很常見。因為它是一個單頁網站，沒有頁面跳轉。當您向下滾動頁面時，導航和內容將顯示在您面前。顯然，這類網站的顯示能力都集中在同一個頁面上。如果你想使一個簡短而精致的網站沒有太多復雜的功能，這個簡單的單頁網站滾動導航是***的。

我們都很容易被涼爽的動態(tài)效果所吸引。如果我們在導航中添加動畫效果，我們可以更清楚地引導用戶點擊并使用導航。例如，當鼠標懸停在導航上時，導航字體會更改，背景顏色塊的大小也會更改，等等。如此小而整齊的區(qū)別就足夠了。與下面屬于圖形導航的情況一樣，前景是文本，背景是圖片。當鼠標移動到相應的導航時，靜態(tài)圖片會有輕微的動態(tài)變化。動畫導航不需要太花哨，否則會干擾視覺。

二、實踐操作課程

以上總結的流行趨勢其實只是導航條設計創(chuàng)意的冰山一角，還有更多未知數有待探索。網站設計從來沒有一個標準答案，下一個趨勢很可能來自你。因此，我們不僅要從中吸取教訓，還要在學習上有意識地創(chuàng)新和突破，形成個人特色。現在凡客建站推出的新版導航欄可以支持子欄目的自由布局。其實，這也鼓勵站長嘗試DIY，跳出固有的模板，做出自己的風格。讓我們看看。~

將鼠標移到導航欄上，單擊快捷欄上的“切換到新版本”，然后選擇“設置樣式”，在“設置導航欄樣式”彈出窗口中，選擇所需樣式，然后在“子列”中選擇“自由布局”。

目前，凡客網站有三類素材模塊。個左邊帶圖表的子列標題，右邊帶純文本的垂直列標題；第二個是帶圖表的水平列標題；第三個是帶純文本的垂直列標題。選擇“保存”后，可以進入編輯狀態(tài)。

將鼠標移到需要添加子級列的級列。單擊下拉頁面中的“編輯模塊”，直接替換初始模板上編輯的圖片和標題文本。圖片和文本可以鏈接到相應的內容頁。

如果要設計自己的排版，還可以刪除初始模板中的元素。根據需要在左側“添加模塊”的彈出窗口中添加文本、圖片、按鈕等。這些部件可以隨意移動。平時做PPT也是這樣。

三、設計原則

導航欄的設計日新月異。然而，無論您選擇何種形式的導航欄，無論其設計有多大的不同，以下三個基本原則都不容忽視。

對于信息量大的網站來說，這一點尤為重要，因為它涉及多個優(yōu)等欄目和子級欄目，這就要求網站管理員對導航的層次結構進行梳理，簡化和合理化，使用戶能夠方便地搜索和獲取信息。

由于導航條是用來引導用戶的，所以它必須有一個明確的方向，而且不需要用戶花時間思考，它只能憑直覺才能正確快速地操作。因此，導航文本應盡量簡潔明了，不含糊，圖標的使用應直觀易識別。

三、一致性

錯誤的導航欄是一個故障。試想一下，如果你想在綜合網站上購買一件T恤衫，但當你點擊導航欄上的“服裝”按鈕，跳轉到零食產品頁面時，你還想在這里購物嗎？所以在一天結束的時候，確保你點擊導航欄上的每個按鈕來檢查它。不要戴帽子和帽子。

掌握以上導航欄設計要點，不要讓用戶迷失在你的網站中！