• 
• 
• 
• 
• 
• 
• 

返回貼子列表		發(fā)表新貼
主題： 網(wǎng)站tab導(dǎo)航的設(shè)計	共有1576人瀏覽過本貼	主貼管理 置　頂 加　精 結(jié)　貼 轉(zhuǎn)　貼

昵稱：奈薇建站網(wǎng) 論壇積分：108000 發(fā)貼等級：21 發(fā)貼數(shù)：1156 回貼數(shù)：1282 被砸雞蛋：1 獲贈鮮花：182

發(fā)表時間：2019/8/13 20:44:00 樓　主 網(wǎng)站tab導(dǎo)航的設(shè)計 　　之前有寫過一篇瀏覽器的tab設(shè)計，這回說說網(wǎng)站的tab設(shè)計。一說到tab很自然地就想到了導(dǎo)航、信息架構(gòu)。隨著網(wǎng)站信息結(jié)構(gòu)的復(fù)雜化，選擇tab似乎是性價比最高、結(jié)構(gòu)傳遞最明確的導(dǎo)航方式。這也是其中面包屑導(dǎo)航方式衰弱的重要原因。 　　如果你想用tab的方式構(gòu)架你的網(wǎng)站，搞明白下面幾個問題，或許對你怎么設(shè)計會有幫助。 　　用tab解決什么問題？在設(shè)計tab之前，先要搞清楚為什么用tab，每個tab下的信息到底是什么，信息之間的關(guān)系是：信息結(jié)構(gòu)一共有多少層？tab跟大標(biāo)題之間的關(guān)系（大標(biāo)題的作用大多是給用戶定位）并列關(guān)系過濾關(guān)系是否互為同類項？包含與被包含？……如上圖，tab1和tab2下面的信息互相之間的關(guān)系？每個tab下信息和大標(biāo)題之間的關(guān)系？只有搞清楚關(guān)系和需求，才有辦法進行下一步設(shè)計。 　　tab結(jié)構(gòu) 　　看下面幾張圖，相信應(yīng)該能夠感受到結(jié)構(gòu)的區(qū)別了。 　　上圖都是選中tab4的效果，但結(jié)構(gòu)方式卻不一樣。雖然這個例子很簡單，但我們在實際操作的時候，往往會比這復(fù)雜很多，比如：tab下面需要嵌套tab，如digg的設(shè)計。或者tab和面包屑的結(jié)合方式，（如原來junchen介紹過的）等等，很多問題往往因為多層的信息結(jié)構(gòu)，在tab的運用上面，需要靈活變通。（在研究結(jié)構(gòu)的時候，需要完全拋開交互和視覺樣式來分析） 　　tab的交互方式選中的tab是否可以再操作？如果是，如何告訴用戶？點擊tab的時候，刷新不刷新頁面？ 　　tab的視覺樣式tab長得什么樣子，會很直接地影響用戶對導(dǎo)航的認(rèn)知，舉三個比較常見的例子： 　　當(dāng)然，視覺樣式肯定很難窮舉出來，有需求的參考一下這里。 　　幾點提示1tab的個數(shù)，最好遵循7±2原則。尤其是非主導(dǎo)航區(qū)域。2在沒有把需求和結(jié)構(gòu)搞明白之前，切勿拘泥于tab的樣式設(shè)計。3在多級tab的情況下，如何精簡結(jié)構(gòu)是一門學(xué)問，需要多從產(chǎn)品形態(tài)和用戶需求方面考慮，不一定需要一味的追求結(jié)構(gòu)的清晰和統(tǒng)一，造成不必要的冗余。 　　本文最主要的是提供設(shè)計思路，拋磚引玉，有興趣大家一起關(guān)注和分享這個話題。 奈薇建站網(wǎng)致力于，讓每個中國人、每個中國企業(yè)都擁有自己的“官方網(wǎng)站”！ 回復(fù)此貼 單貼管理 修　改 刪　除 清理簽名 TOP

共0個回貼   分0頁

上一頁 / 下一頁   當(dāng)前第頁

奈薇建站網(wǎng)青島網(wǎng)站建設(shè)公司/青島網(wǎng)站制作公司，專業(yè)提供"氣質(zhì)"型網(wǎng)站建設(shè)及精美網(wǎng)站制作服務(wù)，同時歡迎各地網(wǎng)站建設(shè)公司、網(wǎng)站制作公司代理我們的奈薇建站系統(tǒng)共同發(fā)展

熱點地區(qū)：青島網(wǎng)站建設(shè)價格 青島即墨網(wǎng)站制作公司 開發(fā)區(qū)信息港 山東在線門戶