創(chuàng)新互聯(lián):電子商務(wù)商品列表中也稱(chēng)為商品聚合頁(yè),可以為消費(fèi)者提供更加好的產(chǎn)品選型。這種類(lèi)型的頁(yè)面的大特點(diǎn)是大量的信息,圖片,所以布局清晰、合理,如何盡可能地壓縮內(nèi)容是商品列表頁(yè)面設(shè)計(jì)的關(guān)鍵部分。

網(wǎng)站設(shè)計(jì)排版分析" />

目前,國(guó)內(nèi)電子商務(wù)網(wǎng)站的商品列表頁(yè)面常見(jiàn)的有三種形式,分別瀑布流水線(xiàn)安排突出和特殊模式。這三種形式有不同的特點(diǎn),設(shè)計(jì)師應(yīng)根據(jù)商品特點(diǎn)選擇最適當(dāng)?shù)谋磉_(dá)方式。

如果貨物的品種五花八門(mén),規(guī)則規(guī)定整個(gè)行列的排列方式更有利于用戶(hù)發(fā)現(xiàn)瀏覽模式;瀑布流,以電商的形式在時(shí)尚領(lǐng)域中普遍的使用,一個(gè)特別突出的方式在節(jié)日來(lái)臨時(shí)來(lái)促銷(xiāo)活動(dòng)，這些將在下面的案例中也會(huì)一一提及。

1.展示基本信息

可以看得出商品列表頁(yè)面比較緊湊，與其它的頁(yè)面相比較而言,所以設(shè)計(jì)師應(yīng)該用特定的范圍來(lái)設(shè)計(jì)展現(xiàn)最有用的信息這種想法去設(shè)計(jì)電商網(wǎng)頁(yè)。列表瀏覽頁(yè)面的用戶(hù)可能不太在乎貨物的詳細(xì)描述，這個(gè)時(shí)候?yàn)g覽模式更多的是浮光掠影,因此,簡(jiǎn)潔的圖片,商品的名稱(chēng),價(jià)格的說(shuō)明,已經(jīng)能夠滿(mǎn)足用戶(hù)需求的頁(yè)面。

順豐優(yōu)選的商品列表頁(yè)表面看起來(lái)非常簡(jiǎn)單,但是向用戶(hù)展示的商品信息卻絲毫不減，相對(duì)于其他的電商網(wǎng)站而言，用戶(hù)真正想要的信息得到了充分體現(xiàn)。

2.鼠標(biāo)懸停時(shí)產(chǎn)生交互效果

很多網(wǎng)站將被忽略鼠標(biāo)懸停時(shí)應(yīng)該產(chǎn)生相互影響,有一些是比較著名的知名電商。盡管只有很小的影響,但是它的存在的意義遠(yuǎn)不僅如此,甚至它可以很好的反饋一個(gè)網(wǎng)站和用戶(hù)之間的交互能力。

就比如淘寶商品的列表頁(yè)而言，反饋給用戶(hù)的信息是高效的。當(dāng)鼠標(biāo)停在某個(gè)商品的圖片或文字上時(shí)，就會(huì)出現(xiàn)紅色的線(xiàn)框把這個(gè)商品與其他的分開(kāi)。且顏色的選擇也與主題顏色相同，與整體顏色相統(tǒng)一。

3.出現(xiàn)適量的附加信息

商品列表頁(yè)面再設(shè)計(jì)的過(guò)程中應(yīng)當(dāng)做到簡(jiǎn)單卻不單調(diào)，簡(jiǎn)潔不繁瑣。但是適當(dāng)?shù)脑黾有╊~外的對(duì)于產(chǎn)品有用的信息也可以達(dá)到如虎添翼的效果

我們來(lái)看看聚美優(yōu)品設(shè)置的列表頁(yè)，它的設(shè)計(jì)風(fēng)格是采用了特別的突出的表現(xiàn)方式，全方位的向用戶(hù)展現(xiàn)不同的商品圖片及信息。這種效果使讓用戶(hù)不進(jìn)入詳情頁(yè)就能看到商品的整體形式，從而會(huì)間接的阻止了頁(yè)面的跳出率

我們?cè)賮?lái)看看美麗說(shuō)的設(shè)計(jì)特點(diǎn)，創(chuàng)新互聯(lián)指出：它是一個(gè)偏向時(shí)尚潮流的網(wǎng)站,所以設(shè)計(jì)師用這種人可以接受瀑布流的方法。美麗說(shuō)商品列表頁(yè)面功能添加一個(gè)模塊用于其他用戶(hù)的評(píng)論,這是許多的電商網(wǎng)站沒(méi)有的。這就是為什么人們?cè)诰W(wǎng)上購(gòu)物時(shí)非常關(guān)注的部分。

4.始終帶給用戶(hù)指引

可能許多電子商務(wù)網(wǎng)站都認(rèn)為,用戶(hù)在某個(gè)商品列停留的時(shí)間越長(zhǎng)，尋找到的產(chǎn)品時(shí)間就越短，成就的可能性就越大。但是事實(shí)上卻不是這樣，用戶(hù)可能會(huì)不斷翻轉(zhuǎn)商品頁(yè)的過(guò)程中將不知不覺(jué)地改變了目標(biāo),因此,網(wǎng)站應(yīng)該為用戶(hù)提供指導(dǎo),給他們一個(gè)明確的方向感。

YOHO商品列表頁(yè)面好處是側(cè)邊導(dǎo)航欄總是存在于頁(yè)面,該頁(yè)面為用戶(hù)跳提供了很多方便,但是缺點(diǎn)是側(cè)邊導(dǎo)航欄是靜態(tài)的,如果可以實(shí)現(xiàn)動(dòng)態(tài)的,可以當(dāng)用戶(hù)鼠標(biāo)滾動(dòng),總是呆在屏幕上就更好了。

5.設(shè)置相關(guān)推薦，促成更多消費(fèi)

與產(chǎn)品推廣另一個(gè)商品的銷(xiāo)售,這是正常的營(yíng)銷(xiāo)噱頭,電子商務(wù)網(wǎng)站,但是如果使用這種方式太硬用戶(hù)不一定能夠理解,網(wǎng)站應(yīng)該盡量使用軟方式來(lái)表達(dá)相同的意思,設(shè)計(jì)師也為此需要花費(fèi)一定的時(shí)間。

這種設(shè)計(jì)的方式我們來(lái)看看的淘寶的設(shè)計(jì)風(fēng)格，利于找相似或者是找同款的字樣方便用戶(hù)搜索自己想要的產(chǎn)品信息，同樣也不會(huì)覺(jué)得營(yíng)銷(xiāo)目的太過(guò)于濃重

6.掃清頁(yè)面死角

頁(yè)面的每一個(gè)地方都有它存在的意義和可用之地，只要設(shè)計(jì)布局的合理，也能起到重要的作用

在頁(yè)面的底部及網(wǎng)站頁(yè)面的左右側(cè)邊，不是很明顯的地方，但是京東的做法就比較好，設(shè)置銷(xiāo)量排行和商品精選等也可以向用戶(hù)推廣展現(xiàn)商品的信息

7.用特色商品激發(fā)購(gòu)物欲

如果你認(rèn)為特色商品的性質(zhì)只是放在首頁(yè)的話(huà)，那么這種想法你就錯(cuò)了。雖然首頁(yè)的位置較好，但是效果不一定是最好的，根據(jù)商品的信息及合理的布局，才能達(dá)到理想中的效果

就如易迅網(wǎng)案例，手機(jī)產(chǎn)品的相關(guān)建議放在商品列表頁(yè)面,讓用戶(hù)可以體驗(yàn)一個(gè)真正的購(gòu)買(mǎi)欲望。

8.吸引人的商品活動(dòng)盡量置后

相對(duì)吸引力或商品有目的的活動(dòng)在偏后一點(diǎn)的位置,有利于整個(gè)網(wǎng)站的營(yíng)銷(xiāo)。我們來(lái)看看一號(hào)店的電商網(wǎng)站設(shè)計(jì)的風(fēng)格，將目標(biāo)“熱門(mén)推薦”和“你瀏覽記錄相關(guān)的商品”在最后一頁(yè),這種是有利于結(jié)束瀏覽用戶(hù)發(fā)現(xiàn)新的感興趣的內(nèi)容。

9.減少操作步驟

在商品列表頁(yè)面,其目的是減少貨物加入購(gòu)物車(chē)才開(kāi)始去做。但在此之前的主要前提是商品信息顯示要盡量全面和完整,表達(dá)的所有內(nèi)容在小面積也確實(shí)是一個(gè)困難的事情。

直接在商品列表頁(yè)面顯示“加入到購(gòu)物車(chē)”按鈕并不少見(jiàn),但是也顯示了購(gòu)買(mǎi)數(shù)量不多,以上的官網(wǎng)實(shí)現(xiàn)此操作,允許用戶(hù)直接選擇數(shù)量和品種。

10.從眾效應(yīng)

從眾心理是一種常見(jiàn)的網(wǎng)上購(gòu)物的人的狀態(tài),因此,顧客購(gòu)買(mǎi)商品的評(píng)價(jià)對(duì)用戶(hù)是引人注目的,企業(yè)可以利用這個(gè)來(lái)做一些小的改動(dòng)在網(wǎng)站設(shè)計(jì)知識(shí)頁(yè)面的設(shè)計(jì)。

本文題目：電商網(wǎng)站設(shè)計(jì)排版欣賞
網(wǎng)站地址：http://aaarwkj.com/news/162404.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專(zhuān)注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營(yíng)銷(xiāo)seo公司；服務(wù)項(xiàng)目有網(wǎng)站設(shè)計(jì)等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)