導(dǎo)航是web產(chǎn)品中應(yīng)用最廣泛的基礎(chǔ)組成之一,其主要功能是引導(dǎo)訪客了解到站點的內(nèi)容結(jié)構(gòu)進而找到目標信息。作為基礎(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ǎo)航都可以使用面包屑導(dǎo)航來簡化的。面包屑導(dǎo)航使用應(yīng)該符合用戶線性思維導(dǎo)向下的操作邏輯。例如,如果我們的用戶想要看NBA直播視頻,那么我們的用戶就可能不關(guān)心娛樂八卦新聞,也可能不關(guān)注足球或者乒乓球有什么新聞賽事,那么面包屑的線性導(dǎo)航就可以很好的滿足用戶的需求。或者是由于頁面空間或者訪問設(shè)備的限制原因,我們無法提供訪客更為詳細的導(dǎo)航,而采用線性簡化導(dǎo)航的處理方法。
本文由胎教儀http://www.taijiaoyi.net/ 原創(chuàng),A5首發(fā),轉(zhuǎn)載請保留地址。