網(wǎng)店商品詳情頁設(shè)計(jì)-商品詳情頁制作

項(xiàng)目四商品詳情頁設(shè)計(jì)4.1商品詳情頁制作

隨著電子商務(wù)的普及，幾乎所有的上架都知道寶貝詳情頁的重要性。買家在淘寶首頁搜索并瀏覽商品的主圖時(shí)，一般會(huì)直接進(jìn)入商品詳情頁。詳情頁就像一個(gè)銷售人員，雖然顧客沒有親手拿到產(chǎn)品，但通過詳情頁的介紹，有了比親手體驗(yàn)更有層次感的了解。據(jù)統(tǒng)計(jì)，約99%的顧客是在查看詳情頁后生成訂單的，詳情頁設(shè)計(jì)的好壞直接影響了該筆訂單是否生成。由此可知，商品詳情頁的裝修在店鋪裝修中至關(guān)重要。商品詳情頁不僅僅是介紹商品的頁面，更是店鋪重要的流量入口（例如自然搜索、類目搜索、直通車單品推廣、鉆石展位單品推廣、聚劃算活動(dòng)等）。商品詳情頁更是影響交易達(dá)成的關(guān)鍵因素。一個(gè)符合并滿足買家心理需求的詳情頁，其轉(zhuǎn)化率才會(huì)高。4.1商品詳情頁制作4.1商品詳情頁制作——4.1.1商品詳情頁分析

商品詳情頁的模塊需要根據(jù)產(chǎn)品進(jìn)行策劃，如數(shù)碼產(chǎn)品等標(biāo)準(zhǔn)化產(chǎn)品，用戶大多是基于理性，充滿關(guān)注的重點(diǎn)是功能性，此時(shí)就需要涉及到細(xì)節(jié)展示，寶貝參數(shù)功能展示等模塊。

4.1商品詳情頁制作——4.1.1商品詳情頁分析對于非標(biāo)準(zhǔn)化產(chǎn)品，如女裝，手包兒，珠寶飾品等，用戶更多的是基于沖動(dòng)。此時(shí)寶貝的展示，場景的烘托等就顯得尤為重要，總之，商品詳情頁的內(nèi)容要引發(fā)消費(fèi)者的興趣，在策劃模塊兒時(shí)需要把握三點(diǎn)。4.1商品詳情頁制作——4.1.1商品詳情頁分析

詳情頁從商品的功能，效果，材質(zhì)介紹，品牌介紹，生產(chǎn)制造，質(zhì)檢報(bào)告，產(chǎn)品使用前后對比，優(yōu)劣對比；信譽(yù)好評，保障與承諾，退換貨服務(wù)，優(yōu)惠；關(guān)聯(lián)產(chǎn)品，搭配套餐，店鋪分類導(dǎo)航等，從而引發(fā)買家興趣、激發(fā)潛在需求。讓買家在短時(shí)間內(nèi)，視覺享受的同時(shí)，清晰地明白這個(gè)商品是什么，有什么功能，對我有什么幫助，和其他同類商品相比有什么優(yōu)勢，贏得消費(fèi)者信任。通過品牌介紹，庫存緊張、預(yù)購從速等手段號召由于不決的顧客快速下單，替顧客做決定。詳情頁的關(guān)鍵是突出一個(gè)核心賣點(diǎn)。這正是詳情頁的目標(biāo)，為了提高網(wǎng)店的轉(zhuǎn)化率。

4.1商品詳情頁制作——4.1.1商品詳情頁分析

商品詳情頁的模塊按功能大致分為左側(cè)模塊和右側(cè)模塊，左側(cè)的模塊包括搜索模塊、寶分類模塊、寶貝排行模塊、收藏模塊和寶貝推薦模塊等。右側(cè)模塊包括寶貝基礎(chǔ)信息模塊寶貝描述信息模塊，以及自定義模塊，寶貝基礎(chǔ)信息模塊一般不需要設(shè)計(jì)。重點(diǎn)設(shè)計(jì)的是自定義模塊，包括寶貝展示模塊、寶貝細(xì)節(jié)模塊、產(chǎn)品規(guī)格模塊、功能展示模塊等，這些模塊對打動(dòng)買家起著十分關(guān)鍵的作用。

4.1商品詳情頁制作——4.1.2詳情頁內(nèi)容設(shè)置在商品詳情頁中，為了讓買家真實(shí)地體驗(yàn)到商品的實(shí)際效果，通常需要設(shè)計(jì)“使用感受”“尺碼標(biāo)示”和“商品細(xì)節(jié)”等內(nèi)容。由于對商品的不同描述需要在同一個(gè)頁面中展示，所以在設(shè)計(jì)中要注意把握好頁面的整體風(fēng)格。商品的規(guī)格、顏色、尺寸、庫存等雖然很容易介紹清楚，但如果設(shè)計(jì)不好會(huì)顯得非常死板。從一件商品的描述，可以看出整個(gè)店鋪的營銷水平。4.1商品詳情頁制作——4.1.2詳情頁內(nèi)容設(shè)置在購買服裝、箱包、鞋帽等商品時(shí)，搭配成為了消費(fèi)者關(guān)注的重點(diǎn)。一些消費(fèi)者具有自己的審美觀、講究品味，在購買商品時(shí)，能否很好的搭配成為了購物的影響因素之一。作為賣家，更要掌握一些商品的搭配知識，幾款不同的風(fēng)格搭配，可能會(huì)給人眼前一亮的感覺，最終促成訂單，提高店鋪的銷量。商品的亮點(diǎn)實(shí)質(zhì)為商品的賣點(diǎn)的表達(dá)形式之一。商品的亮點(diǎn)可以理解為商品具備的前所未有、別出心裁或與眾不同的特點(diǎn)。4.1商品詳情頁制作——4.1.2詳情頁內(nèi)容設(shè)置商品的亮點(diǎn)實(shí)質(zhì)為商品的賣點(diǎn)的表達(dá)形式之一。商品的亮點(diǎn)可以理解為商品具備的前所未有、別出心裁或與眾不同的特點(diǎn)。4.1商品詳情頁制作——4.1.2詳情頁內(nèi)容設(shè)置商品信息展示可以細(xì)分為參數(shù)說明、實(shí)物拍攝展示、顏色展示、全方位展示等，通過實(shí)物拍攝、顏色展示、等可以使消費(fèi)者更轉(zhuǎn)地查看商品，對一些參數(shù)通過肉眼獲取準(zhǔn)確信息。買家在瀏覽商品詳情頁面時(shí)，通常情況下會(huì)將圖像是視為一個(gè)整體，然后才將視線定位到比較突出或搶眼的位置，所以在排列商品圖像或展示模特照片時(shí)，為了突出商品的特征，可以將一些希望強(qiáng)調(diào)的圖像放大并布局與顯眼的位置，效果會(huì)更加理想。4.1商品詳情頁制作——4.1.3詳情頁頁面布局4.1商品詳情頁制作——4.1.3詳情頁頁面布局中間對齊模式的頁面布局這種布局方式具有可以吸引買家視線的優(yōu)點(diǎn)，但會(huì)顯得整體頁面比較狹窄。通常情況下，可以調(diào)整一些圖像的尺寸，將留白部分的特色發(fā)揮出來，從而清除沉悶、狹窄等弊端，產(chǎn)生安靜、穩(wěn)定的感覺。4.1商品詳情頁制作——4.1.3詳情頁頁面布局對角線排列的頁面布局這種布局方式適合表達(dá)自由奔放的動(dòng)態(tài)的感覺，并且會(huì)形成自然的z字形視覺牽引的效果，給人一種清爽、利落的感覺。當(dāng)然，無論怎樣的自由式布局，都要以指引線為準(zhǔn)對圖片和文字進(jìn)行設(shè)計(jì)和布置。4.1商品詳情頁制作——4.1.3詳情頁頁面布局棋盤式的頁面布局這種布局方式就是將圖像按照棋盤表面的方格樣式進(jìn)行布局，把眾多的圖像一次性展示給買家。這種布局方式適合用于展示商品的各個(gè)細(xì)節(jié)部分。其優(yōu)點(diǎn)就是將眾多的圖像集合為視覺上的一個(gè)整體，形成一種統(tǒng)一感，將買家的視線機(jī)中到一處。4.1商品詳情頁制作——4.1.3詳情頁頁面布局左對齊模式的頁面布局由于人們的視線一般都式從左向右移動(dòng)的，所以這種頁面布局會(huì)吸引更多的視線，適合用在表現(xiàn)那些有序之分的內(nèi)容上，如商品使用的說明順序、商品的制作過程等，這些連貫性的主題采用左對齊模式的頁面布局來表現(xiàn)效果極佳。4.1商品詳情頁制作——4.1.3詳情頁頁面布局對稱型的頁面布局這種布局方式式指畫面的橫向或縱向以中心線為軸，將頁面組成要素按照彼此相對的方式進(jìn)行兩側(cè)布局。在頁面布局中，即使兩側(cè)的組成要素不是按照完全相同的尺寸和排列方式進(jìn)行的，只要兩則的空間寬度和重量感相同，就可以體現(xiàn)出對稱的布局效果，這種布局能夠營造出一種文靜、安定的整體氛圍。4.1商品詳情頁制作——4.1.3詳情頁頁面布局商品的圖像和說明文字如何排列、如何布局，會(huì)影響到頁面的整體氛圍和感覺。為了更有效的進(jìn)行頁面布局，要確定商品的特定用途和需要表現(xiàn)得氛圍，并據(jù)此合理運(yùn)用這些布局方式，才能讓設(shè)計(jì)出來得頁面給人帶來視覺上得舒適感，并將商品的特點(diǎn)傳達(dá)給買家。對角線排列的頁面布局中間對齊模式的頁面布局棋盤式的頁面布局左對齊模式的頁面布局對稱型的頁面布局4.1商品詳情頁制作——4.1.4詳情頁圖片尺寸平臺詳情頁建議圖片寬度詳情頁單張圖片高度淘寶小于等于750像素小于等于1500像素天貓商城小于等于790像素小于等于1500像素京東商城小于等于790像素自定義速賣通小于等于790像素自定義4.1商品詳情頁制作——4.1.5詳情頁的設(shè)計(jì)思路商品詳情頁主要用于展示單個(gè)商品的細(xì)節(jié)信息，它的精致程度和設(shè)計(jì)感直接影響買家對商品的認(rèn)知。由于女裝的色彩清新而淡雅，雪紡居多，為了表