面包屑是一種常見的導(dǎo)航工具，通常出現(xiàn)在網(wǎng)頁內(nèi)容的上方。面包屑小巧，簡(jiǎn)單，有時(shí)候甚至很難引起人們的注意，但就是這么一個(gè)簡(jiǎn)單的小東西，卻有十分重要的作用。今天我們就教大家來認(rèn)識(shí)面包屑。

面包屑的概念來自于童話故事“漢賽爾和格萊特”，當(dāng)漢賽爾和格萊特穿過森林時(shí)，不小心迷路了，但他們發(fā)現(xiàn)在沿途走過的地方都撒下了面包屑，讓這些面包屑來幫助他們找到回家的路。所以網(wǎng)站面包屑作為一種輔助導(dǎo)航工具，作用是告訴訪問者他們目前在網(wǎng)站中的位置以及如何返回。

面包屑的作用

● 作為一種輔助導(dǎo)航工具，面包屑為用戶呈現(xiàn)出網(wǎng)頁的結(jié)構(gòu)層次，讓用戶知道自己目前所處的位置以及自己還能到哪里去。

● 面包屑鼓勵(lì)用戶瀏覽更多的內(nèi)容，提升了整個(gè)網(wǎng)站的可訪問性，降低網(wǎng)站的跳出率。

● 利于搜索引擎蜘蛛對(duì)網(wǎng)站的抓取，實(shí)現(xiàn)網(wǎng)頁SEO優(yōu)化。

面包屑的類型

● 基于位置的面包屑：基于位置的面包屑能很好的反映網(wǎng)站的結(jié)構(gòu)特征，能將網(wǎng)站的層級(jí)結(jié)構(gòu)展現(xiàn)在訪客面前，對(duì)于通過外部鏈接或搜索引擎進(jìn)入頁面的游客具有清晰的指引性作用。

● 基于路徑的面包屑：基于路徑的面包屑即歷史足跡，它所反映的不是網(wǎng)站的結(jié)構(gòu)特征，而是游客的完整訪問路徑。此類面包屑動(dòng)態(tài)生成，幫助游客記錄瀏覽的歷史足跡。

● 基于屬性的面包屑：基于屬性的面包屑常見于電子商務(wù)類網(wǎng)站。產(chǎn)品根據(jù)類別和屬性的不同而歸于不同的目錄之中，基于屬性的面包屑使用戶更容易理解產(chǎn)品和產(chǎn)品之間的關(guān)系。

什么時(shí)候使用面包屑

是否使用面包屑主要取決于網(wǎng)站結(jié)構(gòu)，當(dāng)網(wǎng)站擁有清晰，明確的多層結(jié)構(gòu)時(shí)，應(yīng)當(dāng)使用面包屑；當(dāng)網(wǎng)站不具備邏輯清晰的層次結(jié)構(gòu)時(shí)，就不建議使用面包屑。

如何使用面包屑

● 不要使用面包屑來替換網(wǎng)站主要導(dǎo)航系統(tǒng)

● 不要將當(dāng)前頁面鏈接添加到面包屑中

● 使用分隔符區(qū)分不同層級(jí)

● 選擇合適的尺寸和間距

● 不要讓他成為視覺焦點(diǎn)

● 不要在移動(dòng)端頁面使用面包屑

面包屑可以讓用戶快速了解自己所處網(wǎng)站的位置，方便用戶進(jìn)一步了解網(wǎng)站其他頁面的內(nèi)容，體現(xiàn)了網(wǎng)站的架構(gòu)層級(jí)，能夠幫助用戶快速學(xué)習(xí)和了解網(wǎng)站內(nèi)容和組織方式，小小的面包屑看似并不起眼，但卻承擔(dān)了如此重要的作用。

課外學(xué)堂：如何優(yōu)化著陸頁?