從網(wǎng)站設(shè)計(jì)的角度看,導(dǎo)航對(duì)一個(gè)網(wǎng)站有三大作用。
其一,理順網(wǎng)站的構(gòu)架。導(dǎo)航設(shè)計(jì)清楚,基本就能夠大致勾畫(huà)出網(wǎng)站個(gè)輪廓,例如多少個(gè)著陸頁(yè)、什么風(fēng)格等等。
其二,成為網(wǎng)站點(diǎn)睛之筆。導(dǎo)航欄目可以吸引用戶的第一注意力,好的導(dǎo)航設(shè)計(jì),會(huì)讓用戶更容易進(jìn)入。
其三,奠定網(wǎng)站風(fēng)格。導(dǎo)航的顏色、動(dòng)效,基本上可以為網(wǎng)站其它頁(yè)面的設(shè)計(jì)提供一個(gè)參考。
所以,導(dǎo)航設(shè)計(jì),非常重要。
對(duì)企業(yè)網(wǎng)站來(lái)說(shuō),因?yàn)闄谀康臄?shù)量有限,導(dǎo)航設(shè)計(jì)相對(duì)來(lái)說(shuō),簡(jiǎn)單一些。但是企業(yè)商城的著陸頁(yè)遠(yuǎn)比企業(yè)網(wǎng)站要多得多,欄目也多,導(dǎo)航設(shè)計(jì)相對(duì)復(fù)雜;再者,企業(yè)商城不同欄目之間的主題交叉,進(jìn)一步增加了導(dǎo)航的設(shè)計(jì)難度。
為了幫助設(shè)計(jì)師更好設(shè)計(jì)出企業(yè)商城的導(dǎo)航,我們需要對(duì)主流電商的導(dǎo)航設(shè)計(jì)進(jìn)行了分析。
我們分析了淘寶、天貓、京東、唯品會(huì)、亞馬遜等主流電商的導(dǎo)航設(shè)計(jì),發(fā)現(xiàn)電商平臺(tái)在導(dǎo)航設(shè)計(jì)上是存在一些共性的。
熱力圖+導(dǎo)航欄。我們知道,從網(wǎng)站熱力圖上看,高熱地區(qū)往往是在左上方,因?yàn)檫@符合人體的瀏覽習(xí)慣。所以,電商商城的導(dǎo)航幾乎都是安排在左上位置。
搜索框+銷售模式。先說(shuō)搜索框,電商網(wǎng)站基本都將搜索框放在顯著的位置,并且予以放大處理。這是為了讓網(wǎng)購(gòu)用戶能夠快速通過(guò)搜索框找到相關(guān)的商品。再說(shuō)銷售模式,一些銷售模式會(huì)吸引到大量的用戶,例如閃購(gòu)、一元購(gòu)等等,多家電商平臺(tái)將搜索框與新銳銷售模式捆綁,或是在搜索框下方、或是在搜索框中“灰置”銷售模式文字。如下圖所示:
產(chǎn)品導(dǎo)航+分電商品牌導(dǎo)航。大型電商平臺(tái),往往孵化出了很多“細(xì)分電商品牌”。這些細(xì)分電商品牌有特定的商品、特定的銷售模式、特定的人群、特定的內(nèi)容,甚至與電商平臺(tái)存在很大不同。例如天貓、聚劃算、紅孩兒都屬于“分電商平臺(tái)”。
既有大量的商品導(dǎo)航需要安排,也有一種分電商品牌需要放置,電商平臺(tái)是怎么做的呢?
普遍做法是設(shè)立“雙導(dǎo)航”。左側(cè)設(shè)計(jì)“產(chǎn)品導(dǎo)航”,上方設(shè)計(jì)“分電商品牌導(dǎo)航”(例如淘寶和蘇寧)。或者是采取隱藏式導(dǎo)航設(shè)計(jì),需要導(dǎo)航的時(shí)候會(huì)出現(xiàn),不需要的時(shí)候隱藏。(例如唯品會(huì))
導(dǎo)航+banner。電商平臺(tái)均將導(dǎo)航與banner進(jìn)行捆綁,banner往往與導(dǎo)航距離很近。還有一個(gè)需要指出的是——如亞馬遜網(wǎng)站已經(jīng)可以根據(jù)用戶的瀏覽記錄,主動(dòng)推薦相應(yīng)的banner。但是國(guó)內(nèi)電商平臺(tái),貌似只有淘寶在進(jìn)行這樣的嘗試,其它電商平臺(tái)并未跟進(jìn)。
還有一點(diǎn)需要指出,雖然電商平臺(tái)的欄目多、內(nèi)容雜、落地頁(yè)更是不可計(jì)數(shù),但是導(dǎo)航也僅限于兩級(jí)導(dǎo)航。也就是說(shuō),用戶最多只需兩部就可抵達(dá)落地頁(yè)??梢?jiàn),過(guò)多層級(jí)的導(dǎo)航不僅會(huì)讓用戶失去耐心。
如上,我們對(duì)主要電商平臺(tái)導(dǎo)航設(shè)計(jì)共性的分析和考察,希望能夠?yàn)槠髽I(yè)商城導(dǎo)航設(shè)計(jì)提供參考。
如沒(méi)特殊注明,文章均為方維網(wǎng)絡(luò)原創(chuàng),轉(zhuǎn)載請(qǐng)注明來(lái)自http://m.oulysa.com/news/4778.html