電子商務(wù)產(chǎn)品頁(yè)面設(shè)計(jì)：網(wǎng)頁(yè)設(shè)計(jì)師的最佳實(shí)踐和技巧

設(shè)計(jì)一個(gè)可用的電子商務(wù)網(wǎng)站需要特別注意細(xì)節(jié)。從結(jié)賬流程到用戶頁(yè)面和產(chǎn)品頁(yè)面有很多活動(dòng)部分。您可以瀏覽各種ecomm設(shè)計(jì)以獲得靈感，但即使這些設(shè)計(jì)可能會(huì)讓您尋找更多。在這里小編分享創(chuàng)建可用產(chǎn)品頁(yè)面的提示和趨勢(shì)，鼓勵(lì)訪問者瀏覽并在您的網(wǎng)站上留下足夠長(zhǎng)的時(shí)間來(lái)購(gòu)買。

添加強(qiáng)大的CTA

這可能是任何 網(wǎng)站設(shè)計(jì)的產(chǎn)品頁(yè)面中最重要的部分。一個(gè)頁(yè)面的CTA，簡(jiǎn)稱呼吁采取行動(dòng)，是元素吸引興趣和哄著動(dòng)作從用戶。在產(chǎn)品頁(yè)面上，這應(yīng)該是您的“添加到購(gòu)物車”按鈕。這是讓人們通過(guò)你的漏斗實(shí)際轉(zhuǎn)換的一件事。畢竟，這是電子商務(wù)網(wǎng)站的主要目標(biāo)。

您希望理想地找到吸引注意力并且未在頁(yè)面上的任何其他位置使用過(guò)的顏色。然而，與此同時(shí)，您希望這種顏色融入您的布局并感覺自然。這不是一件容易的事。您網(wǎng)站的配色方案，頁(yè)面布局以及如何處理頁(yè)面上的空間將影響您的CTA設(shè)計(jì)。主要目標(biāo)是每頁(yè)有一個(gè)CTA，并確保它圍繞“添加到購(gòu)物車”功能構(gòu)建。

你想要一個(gè)容易讓游客找到的顏色和按鈕樣式。這是他們想購(gòu)買東西的單一動(dòng)作，所以不要難以找到！一旦他們看到“添加到購(gòu)物車”按鈕，他們就知道如何進(jìn)行購(gòu)買。這通常是瀏覽電子商務(wù)網(wǎng)站時(shí)訪問者的平均目標(biāo)。這也是為什么我建議測(cè)試很多顏色，直到你發(fā)現(xiàn)頁(yè)面上出現(xiàn)的東西，但與你現(xiàn)有的設(shè)計(jì)沒有對(duì)比。如果您不確定從哪里開始，我建議我們?yōu)樵O(shè)計(jì)師提供色彩理論指南。

清除面包屑蹤跡

這是許多電子商務(wù)產(chǎn)品頁(yè)面的另一個(gè)流行功能。您可以輕松地將面包屑添加到任何頁(yè)面中，并且它們不需要很多空間。事實(shí)上，他們經(jīng)常占用你從未使用過(guò)的空白空間。面包屑的好處是增加了用戶對(duì)每個(gè)產(chǎn)品的頂級(jí)父類別的相關(guān)鏈接的參與度。

在每個(gè)產(chǎn)品頁(yè)面的正中央，您會(huì)找到一個(gè)面包屑，詳細(xì)說(shuō)明用于組織所有這些內(nèi)容的所有類別和子類別。這使訪問者有機(jī)會(huì)只需點(diǎn)擊一下即可快速訪問主頁(yè)，主要商店頁(yè)面或任何產(chǎn)品類別頁(yè)面。絕對(duì)是任何電子商務(wù)網(wǎng)站的寶貴資產(chǎn)。大多數(shù)客戶進(jìn)入的最大障礙是產(chǎn)品的價(jià)格。有人可能會(huì)喜歡你賣的東西，真的想買一個(gè)。但如果它太昂貴，那么它就不是一個(gè)選擇。

一些網(wǎng)站設(shè)計(jì)人員認(rèn)為隱藏價(jià)格是有意義的，因此用戶不會(huì)注意到。令人敬畏的面包屑導(dǎo)航欄，清晰的產(chǎn)品照片，強(qiáng)烈的紫色CTA和明亮的紅色文本中的大價(jià)格標(biāo)簽?？匆幌逻@個(gè)頁(yè)面，你會(huì)立即感覺很舒服。這就是你應(yīng)該追求的目標(biāo)：舒適和熟悉。您的產(chǎn)品定價(jià)不需要大紅色文本，但應(yīng)該一目了然。您網(wǎng)站的最佳顏色和位置取決于您的布局結(jié)構(gòu)。

耐嚼的產(chǎn)品頁(yè)面布局

在這個(gè)頁(yè)面上，它以更大膽的文字顯示更大的價(jià)格，顯示折扣率。刪除文字的原始費(fèi)率要小得多。這可能看起來(lái)只是頁(yè)面的一個(gè)非常小的補(bǔ)充，但它可以從根本上增加正確產(chǎn)品的轉(zhuǎn)換。更不用說(shuō)小的圖形“新的更低的價(jià)格”意味著脫穎而出并立即引起注意。

授予你，因?yàn)樵O(shè)計(jì)師不能影響物品的價(jià)格或用戶對(duì)它的反應(yīng)。但是你可以設(shè)計(jì)排版，這使得在屏幕上的第二頁(yè)加載內(nèi)檢查價(jià)格變得非常容易。

保持信息簡(jiǎn)短和易于使用

有些人覺得學(xué)位論文和閱讀信息只是令人不愉快。作為網(wǎng)頁(yè)設(shè)計(jì)師，您應(yīng)該知道人們會(huì)瀏覽內(nèi)容并快速查找所需內(nèi)容。設(shè)計(jì)產(chǎn)品頁(yè)面，將關(guān)鍵信息組織到頁(yè)面部分。使用清晰的語(yǔ)言和非常少的阻礙性頁(yè)面元素，使其易于查看和易于閱讀。這些工作就像迷你標(biāo)題，內(nèi)容是黑暗，粗體，超級(jí)易讀。一個(gè)偉大的設(shè)計(jì)選擇，關(guān)注消費(fèi)者的需求。事實(shí)上，您的目標(biāo)應(yīng)始終是首先關(guān)注消費(fèi)者。

如果你這樣做，你會(huì)因?yàn)椴挥淇斓馁?gòu)買而導(dǎo)致混亂的用戶體驗(yàn)或退回的商品的麻煩要少得多。每個(gè)產(chǎn)品的內(nèi)容都會(huì)發(fā)生變化，并根據(jù)客戶偏好提供清晰的概述。對(duì)于通常解決簡(jiǎn)單問題的不太復(fù)雜的產(chǎn)品，它可能是最好的風(fēng)格。但是，你必須決定如何你要根據(jù)你賣什么組織信息。使用這些示例作為指南，并將它們與您自己的想法結(jié)合起來(lái)。

用戶評(píng)論和評(píng)分

沒有什么比社交證明更快地銷售產(chǎn)品了。產(chǎn)品評(píng)論非常有價(jià)值，大多數(shù)電子商務(wù)平臺(tái)都支持此功能。您應(yīng)該高度鼓勵(lì)用戶評(píng)論，并盡可能將這些評(píng)論推到產(chǎn)品頁(yè)面的前面。大多數(shù)電子商務(wù)網(wǎng)站都依賴于基于星級(jí)的評(píng)級(jí)系統(tǒng)，該系統(tǒng)運(yùn)行良好。這給出了大多數(shù)買家對(duì)產(chǎn)品的看法的視覺指示。

如果好奇的消費(fèi)者想要了解更多，他們總是可以點(diǎn)擊閱讀詳細(xì)的評(píng)論。這樣可以更容易地一目了然地查找它們，并快速了解其他用戶對(duì)產(chǎn)品的評(píng)價(jià)。您可以將其視為可訪問性的改進(jìn)設(shè)計(jì)選擇，使用戶評(píng)級(jí)非常容易訪問。您甚至可以將星級(jí)評(píng)分?jǐn)?shù)字懸停，并查看投票給誰(shuí)評(píng)級(jí)的明細(xì)。談?wù)摓橛脩糍x予價(jià)值。

最后

如果您從未設(shè)計(jì)過(guò)產(chǎn)品頁(yè)面，那么它就會(huì)感覺像是一項(xiàng)艱巨的任務(wù)。但我建議先在紙上規(guī)劃您的想法，然后繪制快速線框圖，以了解您想要的內(nèi)容。從那里可以更容易地找出哪些功能很好地融入您的布局以及您根本不需要哪些功能。另請(qǐng)注意，產(chǎn)品頁(yè)面應(yīng)設(shè)計(jì)為鼓勵(lì)用戶采取行動(dòng)。