你一直想給自己買一個(gè)新的筆記本電腦包。最后，你有時(shí)間坐下來，在網(wǎng)上瀏覽不同的設(shè)計(jì)，挑選你最喜歡的。經(jīng)過多次考慮，您已經(jīng)找到了完美的包，并想要購買。但是，可怕的是，你找不到“購買”按鈕，購物車圖標(biāo)不見了，退貨政策也不見了。這一切似乎都太復(fù)雜了，最終，你放棄了，選擇了另一個(gè)品牌。
這是一個(gè)經(jīng)典的例子，說明了網(wǎng)站導(dǎo)航如何決定用戶的體驗(yàn)，最終影響流量、轉(zhuǎn)化率和回購率。好的網(wǎng)站導(dǎo)航可以幫助用戶找到他們想要的內(nèi)容，并為他們提供積極的體驗(yàn)，鼓勵(lì)他們返回。本文我們來介紹如何為網(wǎng)站設(shè)計(jì)導(dǎo)航。

如下圖是方維網(wǎng)絡(luò)官網(wǎng)m.oulysa.com的導(dǎo)航
 

網(wǎng)站導(dǎo)航的種類

頂部橫向?qū)Ш?。這是一個(gè)經(jīng)典的導(dǎo)航腫了，出現(xiàn)在網(wǎng)站的每個(gè)頁面的頂部，通常橫向運(yùn)行在屏幕上。
網(wǎng)站左側(cè)或右側(cè)的邊欄導(dǎo)航。這是位于頁面一側(cè)的列表。它可以是最小的，也可以成為中心舞臺(tái)，成為設(shè)計(jì)的一個(gè)組成部分。
漢堡包導(dǎo)航。雖然這在移動(dòng)網(wǎng)頁設(shè)計(jì)中經(jīng)常出現(xiàn)，但這個(gè)簡單的三行圖標(biāo)現(xiàn)在也出現(xiàn)在許多桌面版本的網(wǎng)站上。漢堡導(dǎo)航提供了一個(gè)最小的圖標(biāo)，不影響網(wǎng)站的設(shè)計(jì)。
頁腳導(dǎo)航。網(wǎng)站的頁腳是添加社交媒體鏈接的好地方，網(wǎng)站訪問者可能會(huì)發(fā)現(xiàn)任何其他有用的重要鏈接。它還可以重復(fù)頁面頂部的導(dǎo)航菜單。

導(dǎo)航設(shè)計(jì)指南

導(dǎo)航規(guī)劃。根據(jù)你的需要來規(guī)劃你的導(dǎo)航，創(chuàng)建一個(gè)“站點(diǎn)地圖”。站點(diǎn)地圖是站點(diǎn)的所有主頁及其所有子類別的列表。它應(yīng)該清楚地指出哪些頁面更重要，哪些不那么重要。站點(diǎn)地圖將構(gòu)成導(dǎo)航菜單的基礎(chǔ)。可以使用任何您覺得最舒服的方法——您可以手工編寫它，以流程圖或圖表的形式呈現(xiàn)它，或者在電子表格中鍵入它。

主導(dǎo)航。當(dāng)決定你的層次結(jié)構(gòu)時(shí)，考慮你想把訪問者帶到哪里，以及你如何通過你的漏斗最好地引導(dǎo)他們，最終將他們轉(zhuǎn)化為客戶或粉絲。此外，考慮一下你的訪問者最感興趣的信息是什么。這就是所謂的“主導(dǎo)航”，它應(yīng)該盡可能容易訪問。構(gòu)成您的主要導(dǎo)航的所有頁面都應(yīng)該出現(xiàn)在站點(diǎn)的主菜單中。

守規(guī)矩或者打破常規(guī)。在導(dǎo)航方面，您希望用戶能夠盡可能輕松地?zé)o縫地瀏覽您的網(wǎng)站。即使內(nèi)容、產(chǎn)品或設(shè)計(jì)對(duì)他們來說是全新的，他們?nèi)匀幌Ｍ藛挝挥跇?biāo)準(zhǔn)位置之一——在網(wǎng)站的頂部角落或標(biāo)題中。當(dāng)然，有時(shí)候你可以打破常規(guī)。試著只在符合你的目的或信息的情況下將導(dǎo)航安排在側(cè)欄或者底部。

固定導(dǎo)航。 粘性菜單(也被稱為“固定”或“浮動(dòng)”菜單)是一種即使訪問者向下滾動(dòng)你的網(wǎng)站也能保持不變的菜單。這對(duì)于長時(shí)間滾動(dòng)的頁面尤其重要，因?yàn)槟幌ＭL問者為了到達(dá)另一個(gè)頁面而必須一直向上滾動(dòng)。 不過，可以選擇添加一個(gè)“Back to Top”按鈕，幫助用戶節(jié)省時(shí)間。無論您選擇哪種解決方案，都取決于您的網(wǎng)站的設(shè)計(jì)和布局，因此在考慮最方便的網(wǎng)站導(dǎo)航形式時(shí)，要考慮不同的選項(xiàng)。

限制數(shù)量。沒有人喜歡被信息狂轟濫炸。當(dāng)你瀏覽網(wǎng)頁的時(shí)候，你很難集中注意力，因?yàn)闀?huì)有各種各樣的干擾出現(xiàn)。保持你的菜單最少，最多6或7個(gè)類別。這樣，用戶將能夠更好地處理信息，并更快地到達(dá)他們想要的頁面。
如果你的網(wǎng)站包含很多信息，你可以用下拉菜單把它分成幾個(gè)部分。

添加搜索欄。對(duì)于內(nèi)容較多的網(wǎng)站，另一個(gè)選項(xiàng)是添加搜索欄。它可以幫助用戶更快地找到他們想要的東西。請(qǐng)記住，您的web設(shè)計(jì)需要服務(wù)于一個(gè)注意力持續(xù)時(shí)間不斷縮短的受眾，該受眾希望所有內(nèi)容都能無縫地工作，而不必等待太久。搜索欄對(duì)于沒有多少上網(wǎng)經(jīng)驗(yàn)的訪問者也很有用，因?yàn)檫@是一個(gè)他們可以立即理解的熟悉概念。