400-611-9921
2015-12-15
3147
編者按:今天這篇文章讀完后,同學(xué)們可以來(lái)做一個(gè)小練習(xí),根據(jù)文章,把優(yōu)設(shè)看做一個(gè)電商網(wǎng)站,文章看做商品,來(lái)分析一下哪篇文章是熱門(mén),有哪些突出的方法,文章里藏有哪些引導(dǎo)用戶(hù)的細(xì)節(jié)等等,即學(xué)即用,不容易忘,分析得好,我給你點(diǎn)贊,手動(dòng)的那種。
@AnyForWeb_UDC :電子商務(wù)中的商品列表頁(yè)也被稱(chēng)為商品聚合頁(yè),是為了能為消費(fèi)者提供更完善的商品種類(lèi)選擇。這一類(lèi)頁(yè)面的最大特點(diǎn)就是信息量大、圖片多,所以布局是否清晰合理,以及如何盡可能的壓縮內(nèi)容是商品列表頁(yè)設(shè)計(jì)的重點(diǎn)部分。
目前,國(guó)內(nèi)電商網(wǎng)站的商品列表頁(yè)常見(jiàn)表現(xiàn)形式有三種,分別是行列排列、瀑布流和特別款突出。這三種形式各有特點(diǎn),設(shè)計(jì)師應(yīng)該根據(jù)商品特色選擇最適合的表現(xiàn)手法。
如果商品的種類(lèi)數(shù)量多且繁雜,規(guī)規(guī)整整的行列排列方式更利于用戶(hù)找到瀏覽規(guī)律;瀑布流的形式更多的在流行時(shí)尚領(lǐng)域的電商中使用;特別款突出的方式可以為一些節(jié)日活動(dòng)的宣傳促銷(xiāo)而準(zhǔn)備。在下面的案例中也會(huì)一一提及。
廣州網(wǎng)站建設(shè),廣州響應(yīng)式網(wǎng)站,廣州網(wǎng)站設(shè)計(jì)供應(yīng)商
正因?yàn)樯唐妨斜眄?yè)相較于其他頁(yè)面會(huì)顯得有些擁擠,因此設(shè)計(jì)師更應(yīng)該抱著在限制的區(qū)域范圍內(nèi)展現(xiàn)最有用的信息的心態(tài)來(lái)設(shè)計(jì)網(wǎng)頁(yè)。正在瀏覽商品列表頁(yè)的 用戶(hù)也許對(duì)商品的細(xì)節(jié)描述并不是很在意,此時(shí)的瀏覽模式更偏于走馬觀花,因此,簡(jiǎn)單扼要的圖片、商品名稱(chēng),以及價(jià)格說(shuō)明就已經(jīng)能夠滿足用戶(hù)在該頁(yè)中的需求 了。
順豐優(yōu)選的整個(gè)商品列表頁(yè)面看起來(lái)很簡(jiǎn)明,但展示的商品信息卻并沒(méi)有弱于其他電商網(wǎng)站,用戶(hù)真正希望得到的資訊都得到了完整的體現(xiàn)。
很多網(wǎng)站都會(huì)忽略鼠標(biāo)懸停時(shí)應(yīng)該產(chǎn)生的交互效果,其中也不乏一些知名電商。雖然只是一個(gè)很小的效果,但它存在的意義卻遠(yuǎn)不僅如此,甚至承載了一份網(wǎng)站與用戶(hù)之間的互動(dòng)和反饋。
天貓的商品列表頁(yè)在給予用戶(hù)即時(shí)反饋這方面做得很到位。當(dāng)鼠標(biāo)懸停在商品范圍時(shí),顯眼的紅色線框就馬上將該商品與其他商品區(qū)分開(kāi)來(lái),而線框的紅色與網(wǎng)站主色調(diào)相同,這樣也讓整體表現(xiàn)得不突兀。
剛才提到了商品列表頁(yè)應(yīng)該盡量做到簡(jiǎn)單簡(jiǎn)潔,但在此基礎(chǔ)上適量的增加一些對(duì)用戶(hù)挑選商品有幫助的附加信息可以起到錦上添花的作用。
聚美優(yōu)品的在列表頁(yè)采用了特別款突出的表現(xiàn)形式,并且向用戶(hù)展示了商品的多視角圖片,讓用戶(hù)無(wú)需進(jìn)入到詳情頁(yè)就看到商品全貌,間接降低了商品詳情頁(yè)的跳出率。
美麗說(shuō)是一個(gè)偏向時(shí)尚年輕化的網(wǎng)站,因此設(shè)計(jì)師使用了這類(lèi)人群都能接受的瀑布流展現(xiàn)方法。美麗說(shuō)的商品列表頁(yè)的特點(diǎn)在于增加了其他用戶(hù)的評(píng)論模塊,這也是人們?cè)诰W(wǎng)上購(gòu)物時(shí)很注重的部分。
可能很多電商網(wǎng)站都認(rèn)為,當(dāng)用戶(hù)在商品列表頁(yè)面停留就意味著即將找到自己需要的商品;而現(xiàn)實(shí)卻告訴我們,用戶(hù)很可能在不斷翻頁(yè)的過(guò)程中會(huì)不知不覺(jué)的改變了之前的目標(biāo)商品,因此,網(wǎng)站應(yīng)該始終為用戶(hù)提供指引,帶給他們明確的方向感。
YOHO的商品列表頁(yè)有利有弊。側(cè)邊導(dǎo)航始終存在于頁(yè)面上,為用戶(hù)的頁(yè)面跳轉(zhuǎn)提供了很大程度的便利;但不足之處是側(cè)邊導(dǎo)航呈靜態(tài),如果能實(shí)現(xiàn)動(dòng)態(tài),可以隨著用戶(hù)鼠標(biāo)的滾動(dòng)而始終保持在屏幕之中就更好了。
用一種商品推動(dòng)另一種商品的銷(xiāo)售,這是電子商務(wù)網(wǎng)站中的慣用營(yíng)銷(xiāo)手法,但這樣的方式如果運(yùn)用的太過(guò)生硬用戶(hù)一定不領(lǐng)情,網(wǎng)站應(yīng)該試著用柔和的方式傳達(dá)相同的意思,設(shè)計(jì)師也許也能為此出一份力。
本文來(lái)源于廣州網(wǎng)站建設(shè)公司與廣州網(wǎng)站設(shè)計(jì)制作公司,品牌網(wǎng)站建設(shè)公司-縱天科技!
關(guān)注我們:在查找公眾號(hào)中搜索:zomsky1688,或者掃描下方二維碼快速關(guān)注。
關(guān)鍵詞:縱天,廣州網(wǎng)站建設(shè),廣州網(wǎng)頁(yè)設(shè)計(jì),廣州網(wǎng)站設(shè)計(jì),廣州網(wǎng)站建設(shè)公司,廣州網(wǎng)頁(yè)設(shè)計(jì)公司,廣州網(wǎng)站設(shè)計(jì)公司,移動(dòng)網(wǎng)站建設(shè),高端網(wǎng)站建設(shè)
400-611-9921
020-29860991
地址1:廣州市天河區(qū)珠江新城邦華環(huán)球廣場(chǎng)16F
業(yè)務(wù) QQ: 3561401262
E-mail: sales@zomsky.com
立即與縱天項(xiàng)目顧問(wèn)通話
400-611-9921
您也可以咨詢(xún)我們的在線客服或預(yù)約資深顧問(wèn)