在設(shè)計(jì)一家線上店鋪時(shí)，很多人會(huì)把注意力放在主頁上，認(rèn)為這是訪問者瀏覽網(wǎng)頁時(shí)首先看到的內(nèi)容。但是任何電商網(wǎng)站的真正目標(biāo)都是銷售，沒有出色的產(chǎn)品頁面，你根本無法實(shí)現(xiàn)銷售目標(biāo)。

有效的產(chǎn)品頁面能夠立即傳達(dá)產(chǎn)品特征和價(jià)值，向消費(fèi)者展示產(chǎn)品的外形，并且讓他們相信所看到的絕對(duì)是需要的東西。

在創(chuàng)建產(chǎn)品頁面時(shí)，你可以選擇許多不同的展示功能和網(wǎng)頁變體。以下將展示幾個(gè)高質(zhì)量的產(chǎn)品頁面設(shè)計(jì)范例以供參考。

1、Luxy Hair

大多數(shù)Luxy的顧客都為女性，因?yàn)檫@家店鋪出售的是人類接發(fā)產(chǎn)品。該網(wǎng)頁以女性化的形式展示給訪問者，并在瀏覽器標(biāo)簽上添加emoji表情符號(hào)。

由于這類產(chǎn)品有許多不同變體，消費(fèi)者首先需要選擇他們頭發(fā)的厚度，然后是顏色，接著就可以來到符合他們需求的特定產(chǎn)品頁面。

通過清晰簡(jiǎn)潔的CTA按鈕就可以將產(chǎn)品加入購(gòu)物車，如果消費(fèi)者不確定產(chǎn)品是否適合自己，在購(gòu)買按鈕上方會(huì)有一個(gè)觀看概覽視頻的提示。

購(gòu)買按鈕下方的免運(yùn)費(fèi)與60天無理由退換貨的提示還有效地降低了購(gòu)物車放棄率。數(shù)據(jù)顯示，如果運(yùn)費(fèi)太高，絕大多數(shù)消費(fèi)者會(huì)放棄購(gòu)買。

另外，Luxy的客服團(tuán)隊(duì)是全天候待命的，這讓消費(fèi)者感到放心，如果他們有任何問題，可以隨時(shí)與客服取得聯(lián)系。

2、PooPourri

如果你銷售的是一些難以擺上臺(tái)面的產(chǎn)品怎么辦？

這個(gè)產(chǎn)品頁面巧妙地利用了有趣幽默的文案博得了消費(fèi)者的好感。

他們產(chǎn)品頁面上的文案這樣寫著：“在使用馬桶前，將此噴霧噴3-5次到馬桶的水面上，然后就繼續(xù)做你的事吧?！保憧赡苓€沒聽說過這種產(chǎn)品，這是一種馬桶噴霧，你可以在上廁所前使用，它能有效去除異味）

這樣的產(chǎn)品頁面有效地提高了銷量，它提示了消費(fèi)者，如果以訂閱方式購(gòu)買產(chǎn)品，他們就可以以優(yōu)惠價(jià)格買下產(chǎn)品。并且，它還提供每一個(gè)月、兩個(gè)月或三個(gè)月購(gòu)買一次的選項(xiàng)。它也不怕消費(fèi)者不信任自己的產(chǎn)品，因?yàn)楫a(chǎn)品頁面展示了產(chǎn)品的工作原理視頻，以此提高可信度。

3、Rocky Mountain Soap Company

這家天然皂公司知道顧客在瀏覽產(chǎn)品頁面時(shí)希望自己購(gòu)買的是高質(zhì)量、健康的產(chǎn)品。他們聲明該產(chǎn)品是100%純天然的，并在產(chǎn)品描述中列出了全天然成分，產(chǎn)品菜單中還可以查看產(chǎn)品中所有成分的完整列表。

這個(gè)產(chǎn)品頁面中特別引入注目的是其大膽的客戶評(píng)價(jià)，其中一條評(píng)論的標(biāo)題是：“MMMM MMM MOISTURE?！痹诳紤]購(gòu)買該產(chǎn)品的顧客腦海中，一條強(qiáng)有力的評(píng)論會(huì)給他們留下相當(dāng)持久的印象。

Rocky Mountain Soap深知客戶評(píng)論的力量。Bizrate Insights調(diào)查顯示，近四分之一的受訪者表示他們總是在網(wǎng)上購(gòu)物時(shí)參考客戶評(píng)論，40％的受訪者表示他們經(jīng)常這樣做。產(chǎn)品下方的社會(huì)認(rèn)同突出顯示產(chǎn)品被多個(gè)滿意客戶評(píng)為五星，這是減少買家對(duì)于從未親自觸摸產(chǎn)品的焦慮的可靠方法。

4、United By Blue

United By Blue是一家提倡環(huán)保的線上商店，它的使命是清除海洋和水道中的垃圾。在店鋪頁面中你能看到它反復(fù)強(qiáng)調(diào)承諾“每售出一件產(chǎn)品，就會(huì)清除1磅垃圾”。試問誰不想為地球的環(huán)保事業(yè)出一份力呢？

服裝尺碼表可以幫助消費(fèi)者選擇最合適的尺碼，從而降低退貨率。

每個(gè)產(chǎn)品頁面上的簡(jiǎn)潔設(shè)計(jì)使顧客更容易瀏覽產(chǎn)品詳細(xì)信息、客戶評(píng)論和一系列類似的產(chǎn)品。通過在產(chǎn)品縮略圖中顯示不同的顏色，方便顧客點(diǎn)擊并查看選項(xiàng)。

5、Sixty-Nine

很明顯，這是一個(gè)引人注目的產(chǎn)品頁面。不同于其他電商產(chǎn)品頁面，這些人物以動(dòng)態(tài)形式呈現(xiàn)，看似在與你互動(dòng)，以一種非常新穎的方式將網(wǎng)站及其特色產(chǎn)品呈現(xiàn)在你眼前。

一旦你點(diǎn)擊了某個(gè)產(chǎn)品，動(dòng)態(tài)的圖片將變?yōu)殪o態(tài)照片，并伴隨著一個(gè)干凈簡(jiǎn)潔的產(chǎn)品頁面。同時(shí)還有一個(gè)鏈接可以查看產(chǎn)品尺碼表，以確保顧客購(gòu)買合適的尺寸。并且，當(dāng)顧客是加拿大人時(shí)，那么通過一個(gè)按鈕，他們就能前往加拿大站點(diǎn)購(gòu)物。

簡(jiǎn)潔的設(shè)計(jì)消除了購(gòu)買體驗(yàn)中的任何干擾，為用戶提供了清晰而直接的購(gòu)買路徑。

這個(gè)網(wǎng)站在電商網(wǎng)站設(shè)計(jì)大賽中獲得了榮譽(yù)。

6、Leesa

Leesa是一家可折疊、可運(yùn)輸?shù)拇矇|公司。他們的品牌主打清爽干凈，主要依賴于他們白色、藍(lán)綠色和灰色的基調(diào)。許多類似的床墊公司已經(jīng)涌現(xiàn)出來，所以Leesa直接切入主題，強(qiáng)調(diào)為什么你應(yīng)該選擇他們而不是其他人：

他們借此機(jī)會(huì)展示他們的企業(yè)社會(huì)責(zé)任政策，那就是每賣出10張床墊就捐出一張床墊，讓潛在買家認(rèn)為他們選擇Leesa是一個(gè)正確的決定。

購(gòu)買床墊是一筆不小的開支，你瀏覽的越多，他們給你的購(gòu)買理由就越多。你可以通過圖片看到床墊的內(nèi)部結(jié)構(gòu)，以及其獨(dú)特之處。Leesa還展示了產(chǎn)品評(píng)論來與顧客分享其他買家的購(gòu)物體驗(yàn)。他們甚至還有一個(gè)常見問題解答頁面，這樣人們就不需要離開產(chǎn)品頁面來尋找問題的答案了。

7、Manitobah Mukluks

就像床墊一樣，Manitobah Mukluks每件產(chǎn)品的成本都很高，這意味著購(gòu)買過程就更加復(fù)雜了。如果產(chǎn)品的價(jià)格為20美元，而顧客又剛好需要，那么他們可能會(huì)買。但是，隨著價(jià)格越來越高，他們?cè)谧鲑?gòu)買決定的時(shí)候就會(huì)有罪惡感，而這種罪惡感對(duì)銷售額的提高可沒有什么好處。

這個(gè)產(chǎn)品頁面旨在減緩消費(fèi)者普遍存在的購(gòu)物焦慮——“免配送費(fèi)”和“免費(fèi)退貨”用粗體大字寫在購(gòu)物車按鈕旁。因?yàn)槿藗儾幌矚g在結(jié)賬的時(shí)候看到多出了一些他們沒有料想到的費(fèi)用。

與Leesa類似，它讓猶豫不決的購(gòu)買者在不離開產(chǎn)品頁面的情況下了解品牌及其使命。

通過以下圖片描述，顧客可以知道該品牌是本地企業(yè)（以及這意味著什么）以及他們靴子鞋底藝術(shù)背后的故事。如果頁面的末尾有第二個(gè)“添加到購(gòu)物車”按鈕就更好了，這樣，如果客戶在瀏覽過程中決定購(gòu)買，就不需要一直滾動(dòng)到頂部。

8、Perfect Keto

雖然Perfect Keto的產(chǎn)品頁面相對(duì)簡(jiǎn)單，但它具有高轉(zhuǎn)化率頁面的所有特征，包括出色的產(chǎn)品攝影，概述使用產(chǎn)品的理由，并且能夠通過“訂閱與保存”選項(xiàng)以更優(yōu)惠的價(jià)格購(gòu)買產(chǎn)品。

這個(gè)頁面還有一個(gè)“相關(guān)產(chǎn)品”部分，這樣即使人們不完全喜歡他們正在看的產(chǎn)品，他們也可以找到可能更適合自己的類似產(chǎn)品。

9、Johnny Cupcakes

Johnny Cupcakes是一個(gè)有趣的品牌，它戲稱自己是“世界上第一家T恤烘焙店”，并強(qiáng)調(diào)他們最近所有新品都是“新鮮烘焙的”。對(duì)于產(chǎn)品頁面設(shè)計(jì)，他們充分利用了產(chǎn)品攝影，通過高質(zhì)量的圖片來展示其服裝和有趣的設(shè)計(jì)。他們還給頁面添加上加載動(dòng)畫效果，展示了一個(gè)胖乎乎的年輕人追逐著一個(gè)紙杯蛋糕，畫面十分逗趣。

另外，當(dāng)消費(fèi)者點(diǎn)擊“BUY NOW”按鈕時(shí)，屏幕右側(cè)會(huì)彈出購(gòu)物車窗口，提醒買家可以隨時(shí)結(jié)賬。這是一個(gè)比較直觀的交易未完成提醒，它清楚地表明了買家可以支付的方式。這將有效地將產(chǎn)品頁面轉(zhuǎn)換到結(jié)賬頁面，因此這也是加快購(gòu)買過程的一種強(qiáng)有力的方法。

10、WP Standard

WP Standard靈活地運(yùn)用了產(chǎn)品攝影技巧，讓消費(fèi)者可以充分想象到擁有產(chǎn)品的感覺。其產(chǎn)品頁面中有一個(gè)獨(dú)特的元素，即提供將姓名首字母刻到包包上的選項(xiàng)。

11、Master & Dynamic

Master & Dynamic的網(wǎng)站頁面第一眼給人的感受是大膽、優(yōu)雅和奢華。其突出耳機(jī)細(xì)節(jié)的特寫鏡頭展示了產(chǎn)品的質(zhì)量和精心制作，讓人不由自主地想要嘗試一番。

Master & Dynamic的產(chǎn)品頁面給人一種親身體驗(yàn)的感覺。當(dāng)訪客在滾動(dòng)屏幕時(shí)，他們會(huì)看到更多關(guān)于耳機(jī)的細(xì)節(jié)設(shè)計(jì)——他們是由什么構(gòu)成的、有哪些高級(jí)功能以及如何使用控制它們。

但是，Master & Dynamic并沒有完全將設(shè)計(jì)的重要性置于轉(zhuǎn)化率之上。其頁面頂部浮動(dòng)的“add to bag”（加入購(gòu)物車）欄雖然不那么醒目，不會(huì)破壞買家的購(gòu)物體驗(yàn)，但仍然會(huì)不斷提醒他們可以將產(chǎn)品添加到購(gòu)物車當(dāng)中。當(dāng)想要購(gòu)買的時(shí)候，他們不需要一直向上滾動(dòng)并中斷購(gòu)物體驗(yàn)。此外，它還直接給出了所有產(chǎn)品顏色選項(xiàng)。

12、Primal Pit Paste

作為個(gè)護(hù)品牌，Primal Pit Paste巧妙地采用了干凈簡(jiǎn)潔的產(chǎn)品頁面設(shè)計(jì)，全白的背景加之一些明亮強(qiáng)烈的色彩，讓品牌和產(chǎn)品都生色不少。

Primal Pit Paste充分利用了顧客評(píng)論部分，其在價(jià)格旁邊和頁面左側(cè)始終存在的按鈕中突出顯示了這些評(píng)論。他們還在“Add to Cart”（添加到購(gòu)物車）按鈕旁邊重申了產(chǎn)品擁有的優(yōu)質(zhì)成分和品質(zhì)（天然的、有機(jī)的、無刺激性等等），以打消買家的任何猶疑不決。

另外當(dāng)買家向下滾動(dòng)產(chǎn)品頁面，他們還可以深入了解到產(chǎn)品成分以及如何使用非傳統(tǒng)產(chǎn)品。Primal Pit Paste對(duì)圖片和圖形的用心設(shè)計(jì)延續(xù)了整個(gè)頁面的趣味性，而且買家隨時(shí)可以點(diǎn)擊右下角的浮動(dòng)按鈕回到購(gòu)物車結(jié)賬。

13、Love Hair

Love Hair是另一個(gè)專注于清潔產(chǎn)品的品牌，他們同樣選擇了整潔利落的產(chǎn)品頁面設(shè)計(jì)。采用純白色的背景，以灰色為襯托色，并略施些暗色調(diào)微妙地突出了產(chǎn)品圖片。除產(chǎn)品圖片外，Love Hair還運(yùn)用了一些視頻內(nèi)容。在視頻下方，Love Hair向用戶分享了有關(guān)產(chǎn)品的更多內(nèi)容以及他們將從中得到什么，讓他們有機(jī)會(huì)直接指出受眾的痛點(diǎn)所在。

14、Pilgrim

Pilgrim的網(wǎng)站采用了動(dòng)態(tài)設(shè)計(jì)，提供日間和夜間兩種模式，用戶可以切身感受到他們的香薰產(chǎn)品放在自己家中的狀態(tài)。

Pilgrim的網(wǎng)站采用了動(dòng)態(tài)設(shè)計(jì)，提供日間和夜間兩種模式，用戶可以切身感受到他們的香薰產(chǎn)品放在自己家中的狀態(tài)。

15、Holstee

正如產(chǎn)品頁面所體現(xiàn)的那般，Holstee是一個(gè)頗為有趣活潑的品牌。簡(jiǎn)單的設(shè)計(jì)加之明亮的點(diǎn)綴色讓人不自覺地被吸引到頁面上的幾個(gè)關(guān)鍵元素：產(chǎn)品、“Add to Cart”按鈕以及突出顯示的文本。如圖中用黃色突出顯示的內(nèi)容，如果注冊(cè)會(huì)員，Holstee將會(huì)提供一定折扣價(jià)格。

Holstee是一個(gè)非常注重視覺化的品牌，他們?cè)陧撁嫦路教峁┝烁嗟恼掌?、視頻以及了解更多關(guān)于產(chǎn)品的信息選項(xiàng)。

Holstee實(shí)現(xiàn)了在產(chǎn)品詳細(xì)描述和規(guī)格、顧客評(píng)論、送貨和退貨及其品牌理念內(nèi)容之間的流暢切換，這消除了買家無休止地滾動(dòng)回到購(gòu)買按鈕的需要，相反，他們只需要直接跳回上面的部分。

（編譯/雨果網(wǎng) 王璧輝 陳小如）

【特別聲明】未經(jīng)許可同意，任何個(gè)人或組織不得復(fù)制、轉(zhuǎn)載、或以其他方式使用本網(wǎng)站內(nèi)容。轉(zhuǎn)載請(qǐng)聯(lián)系：editor@cifnews.com