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

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

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

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

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

1.簡化內(nèi)容

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

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

較高的數(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)。

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

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

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

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

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

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

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

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

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

3.放在明顯的地方

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

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

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

4.避免使用下拉菜單

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

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

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

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

索尼將他們的產(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)航，是時候開始考慮導(dǎo)航將如何響應(yīng)地工作了。

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

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

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

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

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

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

當(dāng)前標(biāo)題：創(chuàng)建簡約的導(dǎo)航欄如何幫助您增加網(wǎng)站轉(zhuǎn)化
鏈接分享：http://www.rwnh.cn/news/205719.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供定制開發(fā)、靜態(tài)網(wǎng)站、Google、小程序開發(fā)、動態(tài)網(wǎng)站、微信小程序

廣告

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