超實用！網(wǎng)站導(dǎo)航欄設(shè)計形式總結(jié)
一、頂部導(dǎo)航
頂部導(dǎo)航被廣泛應(yīng)用在各個領(lǐng)域的網(wǎng)站當(dāng)中，這類導(dǎo)航可以一目了然的讓用戶迅速尋找到所需。頂部導(dǎo)航這樣的設(shè)計形式保守但目的性強，可以確保組織結(jié)構(gòu)的可靠和降低用戶尋找的時間成本。但這類導(dǎo)航有個缺點，首頁內(nèi)容過多需要滾屏的時候，用戶需要滾動到頂部再去切換導(dǎo)航內(nèi)容。所以現(xiàn)在很多頂部設(shè)計的導(dǎo)航會做一個效果，將導(dǎo)航固定在頂部導(dǎo)航，這樣減少了用戶的使用成本。
二、側(cè)邊導(dǎo)航
側(cè)邊欄導(dǎo)航的設(shè)計形式比較多樣，也可以有多表現(xiàn)形式，可動可靜，可大可小，比較個性化。固定的側(cè)邊欄導(dǎo)航設(shè)計不是很建議，特別是對于寬度大的側(cè)邊欄導(dǎo)航，這樣的設(shè)計會影響整個網(wǎng)頁界面的寬度。設(shè)計師可以考慮做成側(cè)邊欄以滑動方式展現(xiàn)，在節(jié)約網(wǎng)站空間的同時也顯得更加簡約。側(cè)邊欄導(dǎo)航的設(shè)計需要注意的是導(dǎo)航欄目的寬度問題，若導(dǎo)航欄中字體過長，在展示上會存在一定的問題，哪怕做成滑動展示的形式也不能很好的得以解決問題。結(jié)構(gòu)復(fù)制的網(wǎng)站不適用這類導(dǎo)航，且側(cè)邊欄的二級導(dǎo)航欄目不也宜多，所以這類導(dǎo)航大部分適用于一些設(shè)計師或個人官網(wǎng)。當(dāng)然，也有一些結(jié)構(gòu)簡單的網(wǎng)站會采用這類導(dǎo)航。
三、底部導(dǎo)航
底部導(dǎo)航應(yīng)用性不是很廣，比較長出現(xiàn)在一些活動或個性化的網(wǎng)站當(dāng)中。其實底部導(dǎo)航被廣泛使用的并不是在pc端中，而是在移動端。在pc端中采用底部導(dǎo)航的形式，一般都是采用固定的方式，這類導(dǎo)航可以減少用戶的使用成本，但對于結(jié)構(gòu)復(fù)雜的網(wǎng)站，有二級或三級導(dǎo)航的網(wǎng)站就不是很合適。其次，將導(dǎo)航放置底部，對于用戶的使用習(xí)慣來說不是特別的好，用戶的眼睛都是從上到下從做往右瀏覽的，這樣的設(shè)計比較挑戰(zhàn)用戶的使用習(xí)慣。
四、漢堡包式導(dǎo)航
漢堡式導(dǎo)航其實跟底部導(dǎo)航一樣，比較常出現(xiàn)于移動端。但現(xiàn)在不少的pc端也越來越喜歡用漢堡包式的導(dǎo)航設(shè)計。這樣的設(shè)計比較節(jié)約空間，相當(dāng)于將導(dǎo)航做成一個隱藏式的設(shè)計或是彈出式的設(shè)計，具有設(shè)計感。雖然漢堡包式導(dǎo)航的設(shè)計方式可以很多樣，也可以很個性。但對于一部分用戶而言，漢堡包式導(dǎo)航其實并不是那么直觀，特別是用戶對導(dǎo)航結(jié)構(gòu)不清晰的情況下。設(shè)計師在設(shè)計這類導(dǎo)航的時候還是要斟酌下。
五、滾動式導(dǎo)航
滾動式導(dǎo)航分水平滾動和垂直式滾動。
1.水平式滾動
水平式滾動就是內(nèi)容呈左右水平方向滾動的，當(dāng)用戶第一次遇到這樣類型網(wǎng)站的時候，體驗感會比較差，因為它物理和視覺運動方向與常規(guī)的縱向滾動不同，而且當(dāng)你使用鼠標(biāo)滾輪滾動的時候，它的左右水平滾動會讓用戶產(chǎn)生交互上的錯位感，這樣的感受其實并不是特別友好。所以這樣的網(wǎng)站其實比較少見，但也有及其少部分做得好的。
2.垂直式滾動
垂直式的滾動在html5網(wǎng)頁中運用廣泛，很多設(shè)計師很喜歡用這樣的設(shè)計，將一些動畫特效和垂直式滾動導(dǎo)航相結(jié)合，可以達(dá)到一種新的視覺效果。
以上介紹的這么多種導(dǎo)航方式，各有利弊，但無論哪一種，導(dǎo)航既然是導(dǎo)航，就應(yīng)該起到為用戶快速便捷找到所需的作用，提高網(wǎng)站的易用性和易操作性，并不是花哨的導(dǎo)航就是好的，用戶往往喜歡簡單醒目的。這才是導(dǎo)航的設(shè)計原則！