版權聲明：轉載時(shí)請以超鏈接形式標明文章原始出處和作者信息及本聲明
http://niangaotuantuan.blogbus.com/logs/214553230.html
如果要分析現在國內電子商務(wù)網(wǎng)站的首頁(yè)設計，網(wǎng)站logo、導航、輪轉圖、促銷(xiāo)信息、熱賣(mài)單品展示、甚至還有站內搜索，應該是幾大必不可少的元素。
在大的元素一致甚至大的布局一致下，這些國內電商的首屏布局和導航設計是否有細微的差別？
先來(lái)看看幾大電商的首屏截圖（為了LOGO和首屏的完整，圖大，請自行點(diǎn)開(kāi)看吧）p.s.由于淘寶的特殊性，這里不列入分析范圍。
可以看到，這五大電商基本都采取了左側分類(lèi)導航的設計，并且除了亞馬遜外，都又有頂部的導航。
頂部的導航又分成了兩種，一種是對網(wǎng)站不同產(chǎn)品線(xiàn)的導航（如當當的特色服務(wù)、京東和蘇寧易購）；還有一種是對自己網(wǎng)站的熱門(mén)產(chǎn)品分類(lèi)的快速導航（如當當的第一排導航和凡客的兩排導航）。
另外這里需要注意的是，凡客的導航略顯啰嗦：第一排是熱門(mén)標簽（tag），是不可展開(kāi)的；第二排是熱門(mén)分類(lèi)（category），是可以展開(kāi)的。
下面再來(lái)看看這幾大電商的左側分類(lèi)導航展開(kāi)后的狀態(tài)：
應該說(shuō)，除了亞馬遜只采用了大分類(lèi)下的二級導航外，其他幾大電商都采用了多級導航。
并且在多級導航的最右側還都加入了知名品牌或者促銷(xiāo)活動(dòng)的推廣區域。
但是，注意第一張圖，也就是當當的導航。當當是唯一一家在導航分類(lèi)名稱(chēng)左側還有ICON的國內電商。那這個(gè)ICON有什么用呢？繼續向下看。
上面兩張圖分別是當當點(diǎn)擊了不同的導航分類(lèi)后的頁(yè)面。注意看兩張圖的右側，尤其是第二張圖的四個(gè)紫色ICON。
再對比左側的導航ICON。
其實(shí)如果大家自己點(diǎn)擊當當的網(wǎng)站然后自己嘗試一下就明白了。
左側的導航是會(huì )隨著(zhù)拉動(dòng)滾動(dòng)條向下而消失不見(jiàn)的，對此當當的解決辦法是什么呢？
就是加入右側的這個(gè)導航。這個(gè)導航是會(huì )隨著(zhù)滾動(dòng)條向下而一直浮動(dòng)在右側的，也就是一直在網(wǎng)站訪(fǎng)客的視野里。并且就像我們經(jīng)?？吹降恼衅妇W(wǎng)頁(yè)一樣，點(diǎn)擊某個(gè)職位的名稱(chēng)，可以快速定位到網(wǎng)頁(yè)對這個(gè)職位的描述的位置上，而不用用戶(hù)自行下拉尋找。這個(gè)導航也是類(lèi)似的作用，點(diǎn)擊不同的ICON或者“女性”等分類(lèi)，可以快速定位到頁(yè)面的對應分區。
但是很遺憾，就像上面兩張圖一樣，當當在不同的大分類(lèi)下都采用了不同的設計。初衷是好的，但本身就是一個(gè)新穎的改變用戶(hù)習慣的設計，這樣的復雜程度很可能一時(shí)會(huì )讓用戶(hù)不知所措，難以接受。
最后再來(lái)簡(jiǎn)單看看單個(gè)分類(lèi)頁(yè)面的布局設計，兩個(gè)有特色的電商是：
上面的凡客的化妝品分類(lèi)頁(yè)面。因為不可能沒(méi)有輪轉圖，于是為了減弱導航在下拉過(guò)程中“消失”的影響，凡客和現在很多的淘寶店家首頁(yè)設計一樣，采用了輪轉圖下再次出現分類(lèi)導航的布局設計（如圖中“熱門(mén)分類(lèi)”）。這樣的設計比較清晰也容易融入布局中，是很簡(jiǎn)便又效果不錯的做法。
上圖是京東的化妝品分類(lèi)頁(yè)面的布局。這個(gè)頁(yè)面的特別之處在于，每個(gè)再低一級的分類(lèi)都有一張代表圖片（如圖中的面部護理、彩妝等），這個(gè)設計同樣也出現在現在手機端的導購類(lèi)產(chǎn)品設計中（如蘑菇街、美麗說(shuō)的熱門(mén)分類(lèi)或者熱門(mén)標簽）。更值得注意的是，在網(wǎng)頁(yè)設計中，京東的商品背景色幾乎都是白色，且沒(méi)有邊框。這樣很好的模糊了導航的代表圖片和商品單品展示圖片之間的區別，使得整個(gè)頁(yè)面渾然一體。
總結來(lái)說(shuō)，幾大國內電商的首屏布局和導航設計基本相似，從而也就建立了固定的用戶(hù)體驗規則。
而很多國內的B2C電商在設計時(shí)常常沒(méi)有注意到這些用戶(hù)體驗規則，也就影響了自身網(wǎng)站的用戶(hù)體驗。
聯(lián)系客服
