淺談網(wǎng)站前端導(dǎo)航功能的設(shè)計(jì)要點(diǎn)

用戶對導(dǎo)航的三種行為
1.適應(yīng)
人們對導(dǎo)航會(huì)逐漸適應(yīng)
2.預(yù)測
導(dǎo)航提供的信息氣味的線索,使人們可以預(yù)測下一步是什么
3.重定向
到達(dá)一個(gè)新網(wǎng)頁,人們會(huì)讓自己重新熟悉它
網(wǎng)站的導(dǎo)航設(shè)計(jì)大致類型
超大信息類站點(diǎn)的導(dǎo)航條就像中藥鋪的抽屜,一字排開氣勢恢宏,分別拉開,別有洞天。
國人喜好:多!大!全!最好全部鋪開才有氣勢。從不爭氣的‘S浪’網(wǎng)多年沒怎么變的首頁導(dǎo)航模式可見一般。至此,對比瀏覽了同類大型新聞信息類站點(diǎn),發(fā)現(xiàn)中/洋;東/西,界面感受果然不同。
今天只說導(dǎo)航,只對比了新聞?lì)愓军c(diǎn):
(娛樂類,設(shè)計(jì)類,個(gè)人站點(diǎn)導(dǎo)航形式多樣,邏輯復(fù)雜,暫來不及鋪開)
Yahoo News / BBC News / CNN / abc News / China Daily / CCTV News / The Japan Times / The Korea Times / 騰訊新聞 / 新浪
首先關(guān)注首頁橫向主導(dǎo)航:
(常規(guī)縱向?qū)Ш酵ǔE浜蠙M向主導(dǎo)航試用,且在商務(wù)型,大型信息類站點(diǎn)主頁中單獨(dú)使用頻率不高,通常在次級頁面出現(xiàn),且一定是信息內(nèi)容量大,分類繁瑣的站點(diǎn)。)
可見基本導(dǎo)航條模式如下:
1. 對于信息統(tǒng)一,歸納性強(qiáng)的站點(diǎn),通常會(huì)使用簡單模式:
2. 對于有豐富次級信息的,通常會(huì)使用以下兩種模式:
a. 鼠標(biāo)hover下拉
b. tab展開
a 型導(dǎo)航方便快捷預(yù)覽, b 型導(dǎo)航直接展開次級信息,也有站點(diǎn)把a(bǔ)/b模式合并。
3. 特別案例,蓋澆飯類型的,把所有信息都鋪出來,比如s浪:
(與其說導(dǎo)航,不如說是歸納過的標(biāo)簽)
導(dǎo)航設(shè)計(jì)的一些注意點(diǎn)
導(dǎo)航上的迷失有多方面的原因:
1.當(dāng)人們不理解資料的時(shí)候可能會(huì)感到迷惑
2.人們在查尋過程中迷失,不知道下一步做什么
3.人們可能會(huì)在網(wǎng)站中偏離方向感,無法回到以前的頁面,甚至是首頁
4.人們在信息系統(tǒng)中偏離方向、分散了注意力。
導(dǎo)航操作性:
一個(gè)完美的導(dǎo)航,最基本最重要的是隨時(shí)隨地,快速引導(dǎo)用戶去相關(guān)頁面,而且能及時(shí)返回,方便跳轉(zhuǎn)到其他頁面。
有意思的是,去容易,反而找到來時(shí)路就千差萬別了。
比如:用戶很可能是從首頁任何一個(gè)興趣點(diǎn),誤入了詳情頁面,去的容易,1步到~!但從詳情頁面返回到其他模塊或想去其他分支類別頁面,就要仰賴導(dǎo)航了。
為了提供必要引導(dǎo),當(dāng)用戶進(jìn)入到足夠深的詳細(xì)頁面,各種索引,面包屑都配合導(dǎo)航條應(yīng)運(yùn)而生。
做一個(gè)反向測試,看哪種導(dǎo)航配套設(shè)置更便捷。
導(dǎo)航路徑的確定:
1.以最終目標(biāo)為起點(diǎn)
2.確定導(dǎo)航的需求
3.選擇適當(dāng)?shù)臋C(jī)制
相關(guān)文章
網(wǎng)站導(dǎo)航如何優(yōu)化?網(wǎng)站導(dǎo)航優(yōu)化全解析
網(wǎng)站導(dǎo)航是對用戶的一種優(yōu)化,同時(shí)也是對搜索引擎的一種優(yōu)化,搜索引擎是靠機(jī)器人抓取信息,要讓機(jī)器人能很清楚的了解網(wǎng)站的層次和路徑,否則機(jī)器人可不會(huì)走你的迷宮,會(huì)被2016-07-16網(wǎng)站導(dǎo)航的布局需要注意什么?如何做好網(wǎng)站導(dǎo)航的布局優(yōu)化?
好的導(dǎo)航能讓你的網(wǎng)站快速超越同行,對排名的獲取有著巨大的推動(dòng)作用,那么如何做好網(wǎng)站導(dǎo)航的布局優(yōu)化?網(wǎng)站導(dǎo)航的布局需要注意什么?本文將提供網(wǎng)站導(dǎo)航布局相關(guān)內(nèi)容供大2016-04-20網(wǎng)站如何正確使用面包屑導(dǎo)航?面包屑導(dǎo)航使用方法介紹
面包屑導(dǎo)航的作用是告訴訪問者他們目前在網(wǎng)站中的位置以及如何返回。那么網(wǎng)站如何正確使用面包屑導(dǎo)航?下面小編就為大家介紹面包屑導(dǎo)航使用方法,來看看吧2016-03-17從網(wǎng)站結(jié)構(gòu)分析SEO的價(jià)值贏在哪里?網(wǎng)站導(dǎo)航結(jié)構(gòu)怎么優(yōu)化?
在每個(gè)網(wǎng)站的運(yùn)營過程中,SEO排名優(yōu)化是一道必不可少的步驟,而我們苦逼的站長們每天在辛辛苦苦的做SEO排名優(yōu)化,你可否想過這樣做的目的到底是為了什么?下面我們從網(wǎng)站結(jié)2016-02-22SEO優(yōu)化之面包屑導(dǎo)航的作用及注意事項(xiàng)
今天小編為大家?guī)砹薙EO優(yōu)化之面包屑導(dǎo)航的作用及注意事項(xiàng),感興趣的朋友們可以跟著小編去下文了解一下哦2015-12-14移動(dòng)互聯(lián)網(wǎng)時(shí)代用戶更多選擇導(dǎo)航跳轉(zhuǎn)或是添加至收藏夾,未來你還需要域
移動(dòng)互聯(lián)網(wǎng)的發(fā)展,讓域名在PC端向衍生的過程中發(fā)生著微妙的變化。瀏覽器不再是唯一入口,和App的較量一直難分伯仲,另外受限于移動(dòng)設(shè)備輸入功能的缺陷,在移動(dòng)瀏覽器中輸2014-09-28- 做導(dǎo)航站成功的早期創(chuàng)業(yè)者,曾經(jīng)被很多站長羨慕,現(xiàn)在還有機(jī)會(huì)嗎?看看下文的分析2014-05-26
淺析:大型網(wǎng)站的導(dǎo)航應(yīng)該怎么設(shè)計(jì)
網(wǎng)站導(dǎo)航的設(shè)計(jì)對于一般的網(wǎng)站來說比較簡單,小網(wǎng)站的層次結(jié)構(gòu)分明,網(wǎng)頁數(shù)量少,就像企業(yè)網(wǎng)站的導(dǎo)航一樣,只需要幾個(gè)按鈕就可以代替。而大型網(wǎng)站的導(dǎo)航設(shè)計(jì)就非常有挑戰(zhàn)性2013-07-02解析四大導(dǎo)航在優(yōu)化網(wǎng)站中有什么作用
提到seo優(yōu)化網(wǎng)站,我們首先想到的是"一個(gè)中心,兩個(gè)基本點(diǎn)",而訪問一個(gè)網(wǎng)站,我們首先會(huì)去關(guān)注的是這個(gè)網(wǎng)站的導(dǎo)航,一個(gè)網(wǎng)站的導(dǎo)航就好比是一本書的目錄,具有檢索功能、報(bào)2012-10-23網(wǎng)站導(dǎo)航分析之不要讓我迷路 防止訪客在瀏覽過程中意外退出網(wǎng)站
這篇文章針對“防止訪客在瀏覽過程中意外退出網(wǎng)站”這類問題,為大家介紹一下我們應(yīng)該做怎樣的分析、優(yōu)化2012-09-30