建站常識
交互設(shè)計(6)–突出重點,一目了然
2010-01-19 11:11:00
導(dǎo)航標(biāo)簽彼此互斥、完全窮盡。
導(dǎo)航標(biāo)簽其實就是一種文字表達(dá)形式,我們用標(biāo)簽來代表網(wǎng)站上的各種分類信息。比如“聯(lián)系我們”這個標(biāo)簽,代表的內(nèi)容通常會包括公司名稱、電話、地址、郵箱等信息。它可以是文字,也可以是圖片。在英文里被稱作“Label”,并不同于我們常說的“tag”標(biāo)簽云圖。
說簡單一點,我們就是要為網(wǎng)站的信息做分類,并為它們起一個通俗易懂的名字。這其實是任何人都可以做的一件事情,所以在導(dǎo)航設(shè)計流程中,它的重要性也常常被忽略。在設(shè)計產(chǎn)品時,常會聽到這樣的話:“這個欄目該叫什么名字?恩。。。先別管吧,把更重要的工作做了再說?!?/P>
然而,站在用戶的角度,導(dǎo)航標(biāo)簽代表的是整個網(wǎng)站的內(nèi)容、產(chǎn)品的結(jié)構(gòu),他們必須依靠標(biāo)簽的內(nèi)容和組織方式來尋找網(wǎng)站中的信息。
標(biāo)簽是訪客行為的觸發(fā)詞,好的標(biāo)簽?zāi)芪L客注意力,引導(dǎo)他們準(zhǔn)確地找到信息。導(dǎo)航標(biāo)簽是訪客預(yù)測目標(biāo)頁內(nèi)容的重要依據(jù),緊跟著它的就是導(dǎo)航中的關(guān)鍵點,網(wǎng)頁的過渡,所以尤為重要,有歧義的標(biāo)簽逼人猜測它的意圖,甚至讓用戶走錯路或迷失方向。
比如這個網(wǎng)站的標(biāo)簽:
這個網(wǎng)站的導(dǎo)航標(biāo)簽比較極端,首先標(biāo)簽之間的互斥性差,“淘寶潮流榜”、“愛物秀場”、“敗家俱樂部”等,含義和實際內(nèi)容都非常接近;其次是一致性差,標(biāo)簽的粒度不同、長度不同、語氣不同,甚至還有英文出現(xiàn),可謂五花八門; 最糟糕的是,在標(biāo)簽的選擇上,用了很多自作聰明的詞語,如“愛騷談資”,用戶很難預(yù)測到鏈接背后是什么內(nèi)容。
設(shè)計標(biāo)簽的過程,實際上就是對信息分類的過程,我們應(yīng)當(dāng)堅持MECE原則,也就是彼此獨立、完全窮盡(Mutally Exclusive,Collectively Exhaustive)。這是一種客觀的角度。你也可以站在主觀的角度進(jìn)行分類,但必須做到標(biāo)準(zhǔn)清晰、在目標(biāo)群體中能獲得充分共識。
怎樣的標(biāo)簽才能稱作好的標(biāo)簽?它應(yīng)該滿足這幾個方面:
1、好的標(biāo)簽,應(yīng)該使用客戶的語言,避免使用術(shù)語、行話、縮寫詞等用戶難以理解的詞語;
2、采用描述性的標(biāo)簽,避免使用“信息”、“細(xì)節(jié)”等過于寬泛的詞語,盡量以某種方式加以限定,如:“給買家的信息”、“交易細(xì)節(jié)”。
3、標(biāo)簽之間的互斥性要強(qiáng),盡可能地尋找差異化;
4、使用聚焦地標(biāo)簽,如,能把貓、狗、倉鼠等歸納為“寵物”,就不要用“動物”。
5、在粒度、語法、展現(xiàn)、用法等方面保持標(biāo)簽的一致性;
6、較長的標(biāo)簽往往比短標(biāo)簽更好,但并非越長越好,請盡量控制在12個字以內(nèi)(這不是一個硬性規(guī)定)。
那我們設(shè)計標(biāo)簽時的詞匯從何而來呢?是憑空想象出來的嗎?當(dāng)然不是啦,你可以從以下幾個方面獲得詞匯:
1、你自己的網(wǎng)站或產(chǎn)品
你的網(wǎng)站和產(chǎn)品,在前期建設(shè)中,已經(jīng)積累了很多標(biāo)簽。我們要做的,就是遍走整個網(wǎng)站,盡可能收集所有標(biāo)簽,然后用表格進(jìn)行整理。
比如,我們在淘江湖改版時,對現(xiàn)有標(biāo)簽系統(tǒng)進(jìn)行了一次整理,在表格的幫助下,比較容易看出現(xiàn)有標(biāo)簽系統(tǒng)存在的問題。
2、類似網(wǎng)站或競爭對手網(wǎng)站
如果你還沒有網(wǎng)站和產(chǎn)品,那就要去同類型網(wǎng)站或競爭對手網(wǎng)站去收集標(biāo)簽了。相信這一做法,在互聯(lián)網(wǎng)上,幾乎是無師自通的。你可以通過對同類型網(wǎng)站標(biāo)簽系統(tǒng)的觀察和比較,得到一些行業(yè)類比較通用的詞匯,降低用戶的理解成本。
你可以用同樣的方式,收集同類型或競爭對手網(wǎng)站的標(biāo)簽,以供參考:
3、受控詞表或敘詞表
這是由圖書館員和特定領(lǐng)域的專家所建立的資源,這些詞匯都是專家們付出很多努力的成果,表達(dá)方式精確且一致,而且這些資源通常是公開的。其實信息架構(gòu)的很多理論,都來源于圖書館管理。
在完全沒有依據(jù)的情況下,我們必須設(shè)計新的標(biāo)簽系統(tǒng)時,應(yīng)該怎么辦呢?
你可以對通過對內(nèi)容進(jìn)行分析、要求內(nèi)容的產(chǎn)生者提供、或者象專家或你的直接用戶求助??ㄆ诸惙ㄒ彩潜容^流行的一種做法。
卡片分類大概有4個步驟:
1、招募志愿者,大部分項目適當(dāng)?shù)目ㄆ诸愔驹刚呷藬?shù)是 15 人,大型項目可以達(dá)到 30 人。個人覺得如果只是想對自己想法進(jìn)行驗證的話,5-10 人即可。
2、 準(zhǔn)備卡片,寫上你預(yù)先設(shè)定好的標(biāo)簽(這些標(biāo)簽必須是你們內(nèi)部討論或請教過專家的結(jié)果)。
3、 讓用戶進(jìn)行分類,你可以觀察用戶的分類過程,以及對標(biāo)簽的理解。
4、 對卡片分類的結(jié)果進(jìn)行分析,如果數(shù)據(jù)龐大,你可以借用軟件進(jìn)行分析,推薦工具有 IBM EZSort、CardZort、WebSort 等。
對卡片分類感興趣的同學(xué)可以進(jìn)一步查閱資料,我們在這里就不詳細(xì)說明了。
近期更新
- [2023-06-25 23:22:29] 優(yōu)秀網(wǎng)站設(shè)計的五大特點
- [2023-04-27 14:05:55] Html 5 響應(yīng)式網(wǎng)站設(shè)計制作
- [2023-04-10 11:07:30] 網(wǎng)站建設(shè)制作流程知多少
- [2022-10-14 10:11:30] 做網(wǎng)站設(shè)計應(yīng)該更看重框架搭建還是視覺觀感?
- [2022-08-09 15:57:48] 以“產(chǎn)品”思維搭建網(wǎng)站!
- [2022-08-08 09:12:57] 一家公司的網(wǎng)站應(yīng)該有哪些板塊內(nèi)容?
- [2022-08-05 09:28:06] 企業(yè)網(wǎng)站建設(shè)為什么要設(shè)置新聞板塊?
- [2022-07-04 15:58:06] 網(wǎng)站首頁設(shè)計的好看,這個網(wǎng)站就成功了一大半!
- [2022-05-20 09:34:19] 網(wǎng)站后臺管理系統(tǒng)是什么?有什么作用?
- [2022-05-17 11:29:32] 作為消費者,應(yīng)該如何選擇一家水平高的網(wǎng)站建設(shè)公司
- [2022-05-17 11:27:01] 高端網(wǎng)站定制與模板化網(wǎng)站應(yīng)該怎么選擇?
- [2022-04-22 16:00:41] 現(xiàn)在高端的網(wǎng)站設(shè)計都有哪些新的趨勢?
延伸閱讀
- [2009-11-04 22:35:00] 交互設(shè)計表格
- [2016-07-28 14:12:42] 網(wǎng)站設(shè)計:如何讓交互設(shè)計更加簡化?
- [2010-12-15 08:53:00] 關(guān)于網(wǎng)站地圖
- [2009-12-19 09:51:00] 交互設(shè)計師的專業(yè)度表現(xiàn)
- [2008-01-27 09:58:00] 交互設(shè)計中的視覺引導(dǎo)
- [2010-03-05 08:39:00] 交互設(shè)計應(yīng)該看人下菜碟
- [2010-05-05 21:55:00] 頁面表達(dá)常用方式
- [2010-06-29 15:19:00] 妖文化凝粹——QQ西游官網(wǎng)改版紀(jì)實
- [2010-09-19 08:11:00] 聊聊線框圖:UED和PD對于線框圖不同的定位
- [2009-12-12 08:54:00] 交互設(shè)計有效性之操作入口明確
- [2016-09-05 12:34:00] 網(wǎng)頁設(shè)計模板賞析
- [2010-03-23 08:35:00] 淺談白社會交互設(shè)計的創(chuàng)新(三)
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計解決方案 機(jī)械行業(yè)網(wǎng)站設(shè)計解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計解決方案 科技企業(yè)網(wǎng)站設(shè)計解決方案 電子家電網(wǎng)站設(shè)計解決方案 食品行業(yè)網(wǎng)站設(shè)計解決方案 集團(tuán)公司網(wǎng)站設(shè)計解決方案 企事業(yè)單位網(wǎng)站設(shè)計解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計解決方案 健身運動網(wǎng)站設(shè)計解決方案 美容與化妝品網(wǎng)站設(shè)計解決方案 建筑設(shè)計行業(yè)網(wǎng)站設(shè)計解決方案 物流行業(yè)網(wǎng)站設(shè)計解決方案
TAGS關(guān)鍵字
青島網(wǎng)站設(shè)計哪家好 中小型企業(yè)網(wǎng)站建設(shè) 青島網(wǎng)站案例 膠南網(wǎng)站建設(shè)公司 青島SEO 營銷策略 css 微官網(wǎng)帶來的好處 空白和簡潔的設(shè)計 集團(tuán)公司網(wǎng)站建設(shè) 響應(yīng)式設(shè)計 互聯(lián)網(wǎng) SEO H5 輪胎網(wǎng)站設(shè)計 企業(yè)網(wǎng)站 插畫 官網(wǎng)建設(shè) 版面布局 網(wǎng)站改版 微信小程序 青島網(wǎng)站營銷 網(wǎng)站動畫 SEO優(yōu)化 集團(tuán)官網(wǎng) 微網(wǎng)站 網(wǎng)站優(yōu)化 頁面設(shè)計 html和css 力圖