淺談網(wǎng)頁(yè)設(shè)計(jì)中常用的網(wǎng)站導(dǎo)航設(shè)計(jì)
網(wǎng)站導(dǎo)航的功能是為了讓用戶(hù)更容易地找到用戶(hù)所需要的信息,可以對(duì)網(wǎng)站的信息架構(gòu)和站內(nèi)搜索進(jìn)行分析和優(yōu)化,也能對(duì)用戶(hù)起到很好的引導(dǎo)作用。一個(gè)有吸引力的導(dǎo)航能夠吸引用戶(hù)去瀏覽更多的網(wǎng)站內(nèi)容,增加用戶(hù)在網(wǎng)站的停留時(shí)間。導(dǎo)航在網(wǎng)站設(shè)計(jì)中的地位舉足輕重,它引導(dǎo)著用戶(hù)進(jìn)行瀏覽和查找,一個(gè)優(yōu)秀的導(dǎo)航系統(tǒng)能讓用戶(hù)在離開(kāi)網(wǎng)站時(shí)感覺(jué)享受了一次愉快的旅程。
下面中國(guó)設(shè)計(jì)網(wǎng)的小編為大家搜集了一些常用的網(wǎng)站導(dǎo)航設(shè)計(jì),以便于大家更為直觀(guān)的感受到不同的導(dǎo)航設(shè)計(jì)所呈現(xiàn)出來(lái)的不同的效果和用戶(hù)體驗(yàn)。
1、頂部水平欄導(dǎo)航
頂部水平欄導(dǎo)航是當(dāng)前兩種最流行的網(wǎng)站導(dǎo)航菜單設(shè)計(jì)模式之一。它最常用于網(wǎng)站的主導(dǎo)航菜單,且通常地放在網(wǎng)站所有頁(yè)面的網(wǎng)站頭的直接上方或直接下方。頂部水平欄導(dǎo)航對(duì)于只需要在主要導(dǎo)航中顯示5-12個(gè)導(dǎo)航項(xiàng)的網(wǎng)站來(lái)說(shuō)是非常好的。這也是單列布局的網(wǎng)站的主導(dǎo)航的唯一選擇(除了通常用于二級(jí)導(dǎo)航系統(tǒng)的底部導(dǎo)航)。當(dāng)它與下拉子導(dǎo)航結(jié)合時(shí),這種設(shè)計(jì)模式可以支持更多的鏈接。所有重要的信息都會(huì)固定在頂部,對(duì)于用戶(hù)來(lái)說(shuō)這樣使用起來(lái)會(huì)更簡(jiǎn)便舒適。
2、抽屜式導(dǎo)航
默認(rèn)情況下,導(dǎo)航菜單根本就不顯示,只有當(dāng)觸摸到右上角指定的小圖標(biāo)時(shí),第一個(gè)內(nèi)容層才會(huì)打開(kāi)。當(dāng)觸摸到其中一個(gè)欄目時(shí),第二個(gè)內(nèi)容層才會(huì)逐漸展開(kāi),給用戶(hù)一個(gè)非常清晰明了的內(nèi)容導(dǎo)航。使用抽屜式導(dǎo)航來(lái)組織復(fù)雜內(nèi)容是一個(gè)非常方便和流行的方式。通常,復(fù)雜的網(wǎng)站會(huì)使用抽屜式的導(dǎo)航來(lái)設(shè)計(jì)。
3、固定式側(cè)邊欄導(dǎo)航
側(cè)邊欄導(dǎo)航菜單可以兼容不同的屏幕尺寸。適合一個(gè)非常明亮干凈的排版布局的網(wǎng)站,可以很好地做到了和用戶(hù)之間的交互,讓人一眼就把精力集中在導(dǎo)航欄上。側(cè)邊導(dǎo)航欄的優(yōu)美之處主要表現(xiàn)在空間夠大,大量的空白讓用戶(hù)感覺(jué)整個(gè)網(wǎng)站有呼吸之處,顯得非常微妙而自由。通過(guò)擁有獨(dú)特的設(shè)計(jì),引起用戶(hù)的注意。
4、隱藏式側(cè)邊欄導(dǎo)航
側(cè)邊導(dǎo)航給人的感覺(jué)就像是你在窺視頁(yè)面背后或者是掀開(kāi)了一個(gè)玩具盒的蓋子看看里面到底有些什么。在需要的時(shí)候?qū)Ш綑趹?yīng)該一直在那里,而當(dāng)用戶(hù)想要專(zhuān)注于某個(gè)特定的任務(wù)時(shí),導(dǎo)航欄則應(yīng)該優(yōu)雅的隱藏起來(lái)。隱藏式側(cè)邊導(dǎo)航非常方便使用,鼠標(biāo)懸停在瀏覽器左側(cè)即可出現(xiàn),主體部分即時(shí)出現(xiàn)的旋轉(zhuǎn)效果也很帶感,可以很好的引導(dǎo)用戶(hù)的注意力。將導(dǎo)航隱藏起來(lái)同時(shí)也實(shí)現(xiàn)了界面的簡(jiǎn)潔,使網(wǎng)站的瀏覽體驗(yàn)非常的愉悅,因?yàn)榫W(wǎng)站并沒(méi)有留下太多無(wú)用的信息去分散用戶(hù)的注意力。
5、圖標(biāo)式導(dǎo)航
圖標(biāo)式導(dǎo)航的好處是節(jié)省空間,讓界面更簡(jiǎn)潔。圖標(biāo)也可用于細(xì)致的分類(lèi),提供更明顯的視覺(jué)線(xiàn)索,而且圖標(biāo)具有直觀(guān)的語(yǔ)義顯示,每一個(gè)圖標(biāo)代表每一個(gè)不同的事件,吸引用戶(hù)的注意,從而更好的引導(dǎo)用戶(hù)操作。如果再加上優(yōu)秀的動(dòng)效轉(zhuǎn)換能夠吸引用戶(hù)注意,讓用戶(hù)迅速找到導(dǎo)航菜單。
6、選項(xiàng)卡導(dǎo)航
選項(xiàng)卡導(dǎo)航可以隨意設(shè)計(jì)成任何你想要的樣式,從逼真的、有手感的標(biāo)簽到圓滑的標(biāo)簽,以及簡(jiǎn)單地方邊的標(biāo)簽等。它存在于各種各樣的網(wǎng)站里,并且可以納入任何視覺(jué)效果。選項(xiàng)卡比起其它類(lèi)別的導(dǎo)航有一個(gè)明顯的優(yōu)勢(shì):它們對(duì)用戶(hù)有積極的心理效應(yīng)。
總之,網(wǎng)站導(dǎo)航各種各樣的設(shè)計(jì)模式都可以用來(lái)作為為網(wǎng)站創(chuàng)建有效地信息架構(gòu)的基礎(chǔ)。導(dǎo)航欄的設(shè)計(jì)可以是靜態(tài)的、動(dòng)態(tài)的、可擴(kuò)展的等多種方式,甚至只是隱藏在一個(gè)微妙的符號(hào)里面。任何導(dǎo)航在網(wǎng)站里面都扮演者不可或缺的角色,所以,探索網(wǎng)站采用何種導(dǎo)航方式是很有必要的。
-
2021/12/28
-
2021/12/23
-
2021/12/17
- 愛(ài)華仕斬獲“2021年度中國(guó)廚衛(wèi)行業(yè)年度智能
- 回首2021,迎戰(zhàn)2022 彩虹線(xiàn)開(kāi)啟新征程!
- 福臨板材|福滿(mǎn)2021,圓夢(mèng)2022
- 美特照明:2022年照明新趨勢(shì),經(jīng)銷(xiāo)商如何做大
- 會(huì)自己“洗澡”的集成灶,帥康自動(dòng)清洗集成灶
- 帶你設(shè)計(jì)一款功能多變,簡(jiǎn)單實(shí)用的休閑露臺(tái)陽(yáng)
- 世紀(jì)豪門(mén)吊頂:破防了!原來(lái)顏值+實(shí)力=H20
- 裝修木門(mén)選的好,噪音統(tǒng)統(tǒng)沒(méi)煩惱
- 寒潮來(lái)了,有淋浴房洗澡更保暖舒服
- 元旦特輯:歐意電器述說(shuō)生活的點(diǎn)滴與美好
- “中國(guó)十大品牌”獲獎(jiǎng)名單出爐,賽戈水漆榮耀
- 2021值得消費(fèi)大賞 凱迪仕智能鎖榮摘兩項(xiàng)桂冠
- 益恩家居:新年新氣象,愛(ài)自己從好好睡覺(jué)開(kāi)始
- 元旦伊始:健康新生活,從精格管道直飲水開(kāi)始
- 喜迎元旦|新年新燈飾 箔晶智能照明讓酒店暖
- 吉美幫的2021 “專(zhuān)精特新” 深耕屋面防水體
- Aqara攜手京東成立燈光設(shè)計(jì)聯(lián)盟 打造燈飾照
- 年底廚房煥新顏,如何選擇廚電?好太太智能來(lái)
- 全鋁家具全屋莫蘭迪色系,這款美式輕奢范贏鄰
- 順趨勢(shì)·筑鳳巢·贏未來(lái) 鳳梧居門(mén)窗2021年會(huì)隆