導(dǎo)航是web產(chǎn)品中應(yīng)用最廣泛的基礎(chǔ)組成之一，其主要功能是引導(dǎo)訪客了解到站點的內(nèi)容結(jié)構(gòu)進(jìn)而找到目標(biāo)信息。作為基礎(chǔ)組成之一，導(dǎo)航看起來簡單，但卻頁面設(shè)計中最復(fù)雜繁瑣的工序之一。因為作為站長我們想要網(wǎng)站結(jié)構(gòu)更簡潔明了、更快速的為我們的用戶提供信息。但是問題出現(xiàn)了，簡化了導(dǎo)航欄，訪客可能無法快速了解到站點結(jié)構(gòu)以及自己的位置，產(chǎn)生困惑;復(fù)雜了，導(dǎo)航臃腫不堪，層巒疊嶂，既不美觀也不好用。那么我們應(yīng)該如何處理呢?我們可以使用面包屑導(dǎo)航來讓導(dǎo)航更方便，同時簡化我們的導(dǎo)航結(jié)構(gòu)。
面包屑導(dǎo)航通常會安放在出現(xiàn)在頁面頂部主導(dǎo)航的下面，正文的上方。它們提供給訪客返回之前任何一個頁面的鏈接，在站點的層級架構(gòu)中通常是指這個頁面的父級頁面。簡而言之，面包屑導(dǎo)航提供給訪客回溯到站點首頁或入口頁面的一條快速的通道。
一般我們常見的門戶站點，如新浪，設(shè)計的整體結(jié)構(gòu)一般是主頁>頻道頁>專題頁>….>子專題>內(nèi)容頁。如果我們想在一個體育類型的門戶網(wǎng)站看NBA的視頻直播，我們首先看看下面的導(dǎo)航結(jié)構(gòu)。
上圖中我們看到如果把頁面的信息以層級形式全部展現(xiàn)在用戶面前，就會形成一種臃腫的情況，先不說訪客無法快捷找到想要的信息，如此大量的信息就占據(jù)頁面很大的空間，已經(jīng)“喧賓奪主”。但是如果我們把用所戶關(guān)心的導(dǎo)航內(nèi)容提取出來，如下圖所示：
再扁平一下，如下圖所示
這種清晰明了的結(jié)構(gòu)將會大大提升我們頁面的用戶友好體驗度。同時我們開看看幾個大型的門戶網(wǎng)站的面包屑導(dǎo)航結(jié)構(gòu)，這些結(jié)構(gòu)式站點的導(dǎo)航更加的輕盈。如下圖所示
當(dāng)然，并不是所有的導(dǎo)航都可以使用面包屑導(dǎo)航來簡化的。面包屑導(dǎo)航使用應(yīng)該符合用戶線性思維導(dǎo)向下的操作邏輯。例如，如果我們的用戶想要看NBA直播視頻，那么我們的用戶就可能不關(guān)心娛樂八卦新聞，也可能不關(guān)注足球或者乒乓球有什么新聞賽事，那么面包屑的線性導(dǎo)航就可以很好的滿足用戶的需求。或者是由于頁面空間或者訪問設(shè)備的限制原因，我們無法提供訪客更為詳細(xì)的導(dǎo)航，而采用線性簡化導(dǎo)航的處理方法。
本文由胎教儀http://www.taijiaoyi.net/ 原創(chuàng)，A5首發(fā)，轉(zhuǎn)載請保留地址。
網(wǎng)友點評
精彩導(dǎo)讀
科技快報
品牌展示