導(dǎo)航在Web中扮演一個回答用戶"我是誰?""我從哪里來?""我到哪里去"的角色。好的導(dǎo)航是一個網(wǎng)站的主要基石。而在開始設(shè)計一個網(wǎng)站或者改版一個網(wǎng)頁時,它往往是設(shè)計師第一個面臨的挑戰(zhàn)。
01導(dǎo)航設(shè)計之信息架構(gòu)
信息架構(gòu)決定了導(dǎo)航的定性,在設(shè)計之前整理清楚內(nèi)容的信息架構(gòu),才能程度發(fā)揮導(dǎo)航的梳理網(wǎng)站結(jié)構(gòu)、有效傳遞信息功能。網(wǎng)頁結(jié)構(gòu)一共有多少層級關(guān)系?是否存在上下層關(guān)系?各類別標簽之間的關(guān)系是并列關(guān)系還是相關(guān)聯(lián)的?各子級項中是否存在可合并項?等等。要避免單純地按照簡單的邏輯關(guān)系,甚至按照業(yè)務(wù)關(guān)系把頁面導(dǎo)航細分到3級甚至4級或者產(chǎn)生出一些和用戶認知不相符的信息類別。每增加一級導(dǎo)航就增加一個認知維度,每增加一級使得整個導(dǎo)航系統(tǒng)復(fù)雜度增加數(shù)倍,不僅用戶的操作將成倍的增加,給網(wǎng)頁后期維護的帶來極大的成本。以下兩種圖示,就能清楚地看到相同數(shù)量頁面的不同放置方式給用戶帶來不同的體驗。
在web交互設(shè)計中存在"3次點擊"的原則,用戶在3次點擊后無法找到想要的信息或完成某個功能時,便會選擇放棄。所以對于導(dǎo)航來說,最基本的應(yīng)該是讓用戶知道當前的頁面有哪些內(nèi)容,并且知道自己的目標內(nèi)容在哪里。導(dǎo)航設(shè)計的廣度和深度的區(qū)別展示,一般來說,廣度比深度的效果要好。在深結(jié)構(gòu)的各級別間選擇更容易迷失方向,甚至可能迷路。但也不要在廣度上鋪的過廣,任何時候把太多內(nèi)容show出來都會嚇退用戶,讓他們被迫患上了"選擇綜合癥"。
為了更明確用戶的認知或者甚至說在設(shè)計師面對改版等需求時,有助導(dǎo)航的創(chuàng)建和完善,常用的一個方法是卡片分類法??ㄆ诸惙ǖ倪M行方式很簡單,首先準備一些大小相同的空白卡片,將信息寫在不同的卡片上,讓參與人員自行分類,也可有適當?shù)慕忉屝砸龑?dǎo)。每次測試的人數(shù)最好在2到4個之間,人數(shù)過少的話使用者之間不易產(chǎn)生討論,人數(shù)過多則會讓討論變得混亂,場面不易控制。這是一種在在網(wǎng)站或其他規(guī)劃初期常用的一個測試方法,能從中了解真正符合用戶習慣的信息分類,找到之間的認知差異,作為調(diào)整架構(gòu)的依據(jù)。
02導(dǎo)航設(shè)計之交互樣式
Web導(dǎo)航的最重要的作用就是將網(wǎng)站的內(nèi)容信息友好地展示給用戶。在確定好網(wǎng)站的信息架構(gòu)后,應(yīng)當按需所取適當?shù)膶?dǎo)航樣式。而不是不管三七二十一,都來個tab式導(dǎo)航,覺得沒有個橫梁式的導(dǎo)航都不好意思說自己在做網(wǎng)頁。首先我們了解一些常用的導(dǎo)航形式:
1. 分步導(dǎo)航(Step navigation)通常由文字標簽和箭頭組成,也要伴隨著向后退的鏈接。適用于環(huán)環(huán)相扣的頁面流程,如向?qū)?,支付,在線閱讀等,為一個接一個的頁面提供訪問。
(圖示出自:Google.com 注冊頁面)
2.分頁導(dǎo)航(Paging navigation)經(jīng)常出現(xiàn)在搜索頁中,一次可展現(xiàn)的結(jié)果數(shù)目通常有限制,超出限制的結(jié)果將在新頁面展現(xiàn)。最簡單的分頁導(dǎo)航就是帶頁碼的分布導(dǎo)航。
(圖示出自:阿里巴巴 我的阿里)
3.面包屑(Breadcrumb trail)展示了用戶訪問網(wǎng)站的路線,由一大串的元素和節(jié)點組成。每個節(jié)點都與指向先前訪問過的頁面或父級主題相連,節(jié)點間以符號分隔,通常是大于號(>),冒號(:)或者豎線(|)
當前文章:Web導(dǎo)航設(shè)計二三事
文章來源:http://sd-ha.com/article2/cjscic.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供建站公司、微信小程序、網(wǎng)站改版、ChatGPT、品牌網(wǎng)站設(shè)計、定制開發(fā)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)