如何在網(wǎng)頁(yè)設(shè)計(jì)中最大程度地利用面包屑導(dǎo)航？

2015-10-25 分類：面包屑導(dǎo)航

如果你都熟悉Hansel和Gretel的故事，那么你知道他們使用面包屑來(lái)標(biāo)記他們的路，以此找到回家的路。當(dāng)然，在網(wǎng)站設(shè)計(jì)中沒(méi)有真正的面包屑（或鳥(niǎo)，為此事）涉及面包屑導(dǎo)航。本文談?wù)勅绾卧?a >網(wǎng)頁(yè)設(shè)計(jì)中大程度地利用面包屑導(dǎo)航？

面包屑是一種輔助導(dǎo)航的方法，其功能有點(diǎn)像進(jìn)度條。您通常會(huì)在主導(dǎo)航欄下方找到它。一些網(wǎng)頁(yè)設(shè)計(jì)師認(rèn)為也許不是每個(gè)網(wǎng)站中的導(dǎo)航都會(huì)改善用戶體驗(yàn)。然而，有些情況下它可能是非常有用的。

一、什么時(shí)候應(yīng)該使用面包屑？

您可能已經(jīng)在您訪問(wèn)的許多網(wǎng)站中看到了面包屑導(dǎo)航。你可以在創(chuàng)新互聯(lián)網(wǎng)站上看到它們，也可以在亞馬遜上看到。

您可以跟蹤您正在恢復(fù)的層次結(jié)構(gòu)的頁(yè)面，以便準(zhǔn)確了解您在站點(diǎn)架構(gòu)中的位置。它就像你在商場(chǎng)或建筑物中看到的那些站點(diǎn)地圖，在那里他們?cè)诘貓D上標(biāo)記你站在“你在這里”的地方。

你顯然不會(huì)需要類似的東西在一個(gè)一層樓的建筑，你可以看到一切。當(dāng)您有三個(gè)或更多級(jí)別到您的站點(diǎn)以層次方式排列時(shí)，您只需要導(dǎo)航導(dǎo)航。在其最簡(jiǎn)單的形式中，面包屑導(dǎo)航鏈接被水平地布置并且由“>”符號(hào)分隔，這表示頁(yè)面相對(duì)于其前面的鏈接的級(jí)別。其目的是防止您的用戶在您的網(wǎng)站丟失。

例如，如果用戶進(jìn)行搜索并降落在您不希望進(jìn)入的層次結(jié)構(gòu)中的頁(yè)面上，則導(dǎo)航痕跡導(dǎo)航將幫助他們找到返回首頁(yè)的路徑。他們只需要點(diǎn)擊他們想回到主頁(yè)的級(jí)別的鏈接。

二、面包屑的類型

您將在大多數(shù)大型電子商務(wù)類型中找到三種主要類型的導(dǎo)航導(dǎo)航。它們是基于位置，屬性和基于路徑的：

1、基于位置的導(dǎo)航

基于位置的面包屑導(dǎo)航顯示他們?cè)诰W(wǎng)站結(jié)構(gòu)中的用戶，通常是具有兩個(gè)以上級(jí)別的用戶。第一級(jí)始終是主頁(yè)，并在當(dāng)前頁(yè)面結(jié)束，這是不可點(diǎn)擊的。

它不僅有助于用戶幫助他們找到自己的方式，而且有助于為搜索引擎技術(shù)提供有關(guān)頁(yè)面內(nèi)容的信息，使索引更容易。

2、基于屬性的導(dǎo)航

此類型的導(dǎo)航顯示頁(yè)面上特定內(nèi)容的屬性，而不是其位置。它基于鏈接的元數(shù)據(jù)，其可以分支到不同的路徑，因此它向用戶呈現(xiàn)了接下來(lái)去哪里的選擇。它通常在電子商務(wù)網(wǎng)站中使用，因?yàn)槠涿枋鲂再|(zhì)使得購(gòu)物者更容易找到他們想要的。屬性由豎直管道分隔。

您可以結(jié)合使用基于位置的導(dǎo)航，具體取決于您提供的產(chǎn)品。基于位置的鏈接是可點(diǎn)擊的，而基于屬性的鏈接不是，但您可以點(diǎn)擊“X”刪除屬性。

例如，你可以尋找有長(zhǎng)袖的男士休閑襯衫，你最后在一個(gè)短袖襯衫的頁(yè)面。單擊屬性“短袖”的“X”，然后選擇“長(zhǎng)袖”。然而，因?yàn)橛谢趯傩缘膶?dǎo)航有這么多選項(xiàng)，它可以使搜索引擎索引，因?yàn)橹貜?fù)的內(nèi)容很難。

3、基于路徑的導(dǎo)航

這種類型比其他導(dǎo)航更像是一個(gè)歷史軌跡，所以它的服務(wù)更像后退按鈕。它跟蹤用戶到達(dá)特定頁(yè)面所采取的步驟。它不推薦用于導(dǎo)航的目的，因?yàn)樗皇钦嬲杏玫摹?它甚至可能會(huì)混淆的人登陸頁(yè)面深入網(wǎng)站內(nèi)。

三、使用面包屑的好處

面包屑對(duì)于一些具有正確實(shí)現(xiàn)的網(wǎng)站是有益的。它們使得用戶方便地去更高級(jí)別而不必經(jīng)過(guò)箍。它可以減少用戶訪問(wèn)特定網(wǎng)頁(yè)所需的點(diǎn)擊次數(shù)，從而幫助用戶避免彈跳。它甚至不需要大量的空間，所以沒(méi)有真正的理由不使用它，在適當(dāng)?shù)臅r(shí)候。

四、使用面包屑的提示

·深度，如前所述，您只應(yīng)對(duì)3層或更多層級(jí)的網(wǎng)站使用面包屑。

·首頁(yè)，您的首頁(yè)應(yīng)該始終是第一級(jí)，因?yàn)檫@是所有主要類別以及您的關(guān)于和聯(lián)系頁(yè)面。

·符號(hào)，建議使用“>”而不是“/”來(lái)分隔鏈接，因?yàn)椤?”表示方向，但不是必須的。

·位置，通過(guò)對(duì)用戶所在的文本進(jìn)行一些更改來(lái)指示，盡管通常位于鏈的末尾。使用不可點(diǎn)擊的文字標(biāo)簽，并加粗。

結(jié)論

面包屑導(dǎo)航對(duì)于具有復(fù)雜的結(jié)構(gòu)和許多產(chǎn)品的許多大型網(wǎng)站比較適用，它可以為你的網(wǎng)站用戶提供一個(gè)很大的幫助。事實(shí)上，它也可以幫助你的SEO也不錯(cuò)。

當(dāng)前文章：如何在網(wǎng)頁(yè)設(shè)計(jì)中最大程度地利用面包屑導(dǎo)航？
文章地址：http://m.kartarina.com/news/33062.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營(yíng)銷seo公司；服務(wù)項(xiàng)目有網(wǎng)站設(shè)計(jì)、面包屑導(dǎo)航等

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

猜你還喜歡下面的內(nèi)容