如果您是初次走進(jìn)商場，很可能您可能不知道要去哪里，因此需要查看目錄。

該目錄可幫助您瀏覽建筑物。如果沒有它，或者做得不好，您可能會(huì)迷路。

您網(wǎng)站的導(dǎo)航與目錄相同。用戶需要它才能從站點(diǎn)上的A點(diǎn)到達(dá)B點(diǎn)。

如果它的輪廓太混亂了，用戶不知道要去哪里，他們可能會(huì)很難找到您網(wǎng)站上一些最重要的頁面。

為了幫助您創(chuàng)建最有效的導(dǎo)航導(dǎo)航并更好地將用戶直接帶到哪里，您可以立即實(shí)施以下5個(gè)特征。

1.簡化內(nèi)容

導(dǎo)航欄的目的是為用戶提供清晰，簡潔的訪問位置選擇?？紤]到這一點(diǎn)，您為導(dǎo)航欄選擇的標(biāo)簽不應(yīng)不必要地冗長或壓倒性的。

將導(dǎo)航中的項(xiàng)目數(shù)量保持在4到7左右。再也不會(huì)顯得擁擠，并減少了用戶登陸您希望他們進(jìn)入的頁面的機(jī)會(huì)。

較高的數(shù)量也容易導(dǎo)致不同視口大小的布局問題，從而導(dǎo)致開發(fā)人員為奇數(shù)大小的屏幕創(chuàng)建不必要的解決方法。

內(nèi)容本身也應(yīng)該簡化為簡潔明了的內(nèi)容。您不想將用戶與他們可能無法理解的冗長而復(fù)雜的標(biāo)簽混淆。

MindBody的出色表現(xiàn)在以下導(dǎo)航中得以實(shí)現(xiàn)。

他們沒有說“游覽”或“查看我們的價(jià)格”，而是剪掉了不必要的形容詞，并使用易于理解的標(biāo)簽，以便用戶可以確切知道他們要去的地方以及在去那里之前會(huì)得到什么。這也使周圍的標(biāo)簽更容易，更快地被消化，因此他們無需三思而后行。

2.按層次結(jié)構(gòu)組織

盡管看起來像字母順序一樣好，但這不是您應(yīng)該使用它的時(shí)候。

您也不能僅因?yàn)橄Ｍ脩粼L問而立即放置“立即購買”按鈕。您需要適當(dāng)?shù)亟M織導(dǎo)航項(xiàng)，以便它們的順序與用戶行為最匹配。

傳統(tǒng)上，*將“家庭”物品放在首位。

如果您選擇刪除它，而使用徽標(biāo)作為鏈接回首頁的一種方式，則嘗試先放置一個(gè)“關(guān)于”項(xiàng)目，然后再放置一些與產(chǎn)品頁面相關(guān)的鏈接。

任何咨詢，登錄或注冊按鈕的順序都排在*，但是它們也應(yīng)該是最引人注目的，因?yàn)樗鼈儌鹘y(tǒng)上是最重要的頁面，并且您希望用戶最終到達(dá)該頁面。

Github出色地完成了工作，創(chuàng)建了組織良好的導(dǎo)航，其按鈕鏈接到用戶可以登錄或登錄的位置。

如果導(dǎo)航時(shí)間較長，也可以嘗試將可操作的項(xiàng)目放在主導(dǎo)航上方的小得多的導(dǎo)航欄中。這樣您就可以包括它們，而不必?fù)?dān)心主導(dǎo)航欄過于擁擠。

3.放在明顯的地方

用戶到達(dá)您的網(wǎng)站時(shí)，他們希望導(dǎo)航欄與窗口頂部水平對(duì)齊，或者與左側(cè)或右側(cè)垂直對(duì)齊。不應(yīng)有任何東西比導(dǎo)航優(yōu)先，因此需要將其移動(dòng)到其他地方。

在整個(gè)網(wǎng)站上保持其位置標(biāo)準(zhǔn)并保持一致。這樣，用戶可以確切地知道下一步該去哪里。這將自動(dòng)使跳出率保持較低狀態(tài)，并有助于適當(dāng)?shù)挠脩袅鬟^您的網(wǎng)站。

大多數(shù)網(wǎng)站都將其導(dǎo)航保持在頁面頂部，但也許您想對(duì)自己的網(wǎng)站大膽一些。如果是這樣，請(qǐng)看一下Sprint的網(wǎng)站，該網(wǎng)站選擇了帶有圖標(biāo)的左對(duì)齊導(dǎo)航，以引起人們的注意。

4.避免使用下拉菜單

我知道了。您的網(wǎng)站上有很多頁面，并且希望人們盡可能多地瀏覽它們，但是將它們放入巨大的下拉菜單中并不是解決問題的辦法。

下拉菜單創(chuàng)建了幾個(gè)問題。

首先，如果您的下拉菜單僅在懸停時(shí)激活，則除非您創(chuàng)建某種類型的后備，否則平板電腦和移動(dòng)設(shè)備上的人員將無法導(dǎo)航。還顯示出用戶認(rèn)為下拉菜單很煩人，因?yàn)樗麄冃枰嗟臅r(shí)間來思考他們想去的地方。

當(dāng)然，如果您是電子商務(wù)網(wǎng)站，則下拉菜單是您*的朋友。因此，如果您適合急需一個(gè)人的人，那么Sony就是布置下拉菜單的*方法的一個(gè)很好的例子。

索尼將他們的產(chǎn)品分為不同的類別，因此用戶可以立即按產(chǎn)品類型進(jìn)行搜索，而無需訪問在線商店，然后必須選擇他們想要的產(chǎn)品。他們甚至將產(chǎn)品圖像插入導(dǎo)航中，因此，甚至在查看其下方的單詞之前，您都可以先了解該菜單項(xiàng)的鏈接位置。

5.使其反應(yīng)靈敏

現(xiàn)在您已經(jīng)知道如何布局和設(shè)計(jì)導(dǎo)航，是時(shí)候開始考慮導(dǎo)航將如何響應(yīng)地工作了。

顯然，您的水平導(dǎo)航欄不適用于平板電腦或手機(jī)。相反，您需要壓縮它。幸運(yùn)的是，有幾種有效的方法可以根據(jù)桌面菜單的功能來布局移動(dòng)菜單。

大多數(shù)人都使用“漢堡”圖標(biāo)，該圖標(biāo)位于與桌面導(dǎo)航相同的區(qū)域。單擊時(shí)，菜單功能可能會(huì)根據(jù)最適合您的站點(diǎn)的方式而變化。如果您具有單級(jí)導(dǎo)航，則可以執(zhí)行一個(gè)類似于Microsoft的單項(xiàng)下拉菜單（減去它們具有的多級(jí)導(dǎo)航）。

如果您不喜歡該用戶界面，則也可以像Digital Telepathy一樣進(jìn)行全屏幻燈片/淡入導(dǎo)航。

如果您使用的是多級(jí)導(dǎo)航，請(qǐng)嘗試檢查我們的客戶之一Accelerence，他們有一個(gè)滑入式導(dǎo)航儀，所有訂購的東西都與臺(tái)式機(jī)導(dǎo)航儀相同。

如果您愿意，也可以將這種方法用于具有單級(jí)導(dǎo)航的網(wǎng)站，但是對(duì)于下拉式導(dǎo)航，此布局的可用性是這三種方法中*的。

如果您不確定哪種方法最適合您，請(qǐng)記住，A / B測試是您*的朋友，可以在此處利用它來確定哪種選項(xiàng)最適合您的用戶。

名稱欄目：創(chuàng)建簡約的導(dǎo)航欄如何幫助您增加網(wǎng)站轉(zhuǎn)化
文章URL：http://jinyejixie.com/news19/205719.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站營銷、微信小程序、外貿(mào)建站、App設(shè)計(jì)、域名注冊、品牌網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)