電商詳情頁是品牌店鋪提高轉(zhuǎn)化率的最重要因素之一，一個(gè)好的設(shè)計(jì)可以激發(fā)用戶的消費(fèi)欲望，幫助用戶樹立對(duì)店鋪產(chǎn)品的信任度，打消顧客的消費(fèi)疑慮，促進(jìn)用戶下單，優(yōu)化產(chǎn)品詳情頁可以提升轉(zhuǎn)化率。詳情頁要與產(chǎn)品主圖、產(chǎn)品標(biāo)題相契合，產(chǎn)品詳情頁必須真實(shí)地介紹出產(chǎn)品的屬性。

下面我們來看看各大電商平臺(tái)的詳情頁尺寸

淘寶：寬750px，高度不限；

天貓：寬790px，高度不限；

京東：寬990px，高度不限；

一號(hào)店：寬750px，高度不限；

唯品會(huì)：寬990px，高度不限；

蘑菇街：寬720px，高度不限；

Tips：雖然高度不限，但是最好總長度和高度控制在2萬px之間，單張的切片高度在1500px之間，如果這家店鋪天貓和淘寶都有，我們就要先做天貓的，再把790px的圖片同比例縮小到750px就可以了，還有我們PC端使用最小字體像素不能小于14px，移動(dòng)端最小20px來進(jìn)行設(shè)計(jì)，一定要注意圖片素材和字體使用，是否有版權(quán)問題，尤其是有一定知名度的店鋪，這個(gè)潛在風(fēng)險(xiǎn)是非常大的，不要使用非授權(quán)素材。

一、詳情頁賣點(diǎn)圖

賣點(diǎn)圖算是整個(gè)詳情頁的重中之重，很多商家感覺自己有詳情頁但還是轉(zhuǎn)化率不高，可能就是因?yàn)橘u點(diǎn)這塊沒研究明白怎么寫。

什么是賣點(diǎn)？我們首先要想清楚消費(fèi)者對(duì)什么感興趣，是注重品質(zhì)、價(jià)格、或者口碑，這些都是賣點(diǎn)，而你的賣點(diǎn)需要提煉修剪，把你的優(yōu)勢(shì)襯托出來，而不是隨意做出一些不存在的功能、用途、性能等，如果與描述不符，消費(fèi)者就不敢去下單，對(duì)后面店鋪的運(yùn)營也會(huì)造成影響。 通過阿里指數(shù)的大數(shù)據(jù)排列出幾個(gè)常見的賣點(diǎn)：

1、低價(jià)引流

這算是吸引消費(fèi)者最直接的辦法，也是很多商家都會(huì)用的一個(gè)賣點(diǎn)，如打折、低價(jià)、包郵、贈(zèng)品等方式。

2、款式的吸引

不是所有的人都會(huì)看到一個(gè)降價(jià)就會(huì)去買東西的，總要有人要買需要的，這時(shí)候你商品的款式就成了另一個(gè)賣點(diǎn)了，它會(huì)用款式、外觀來引流，造型的美觀、獨(dú)特的產(chǎn)品更能在同樣的產(chǎn)品中更吸引消費(fèi)者。

3、功能材料

功能材料大家都了解，就是字面的意思，商家如果能長期的吸引客戶回購，那這款產(chǎn)品就是非常成功的，你的功能性好，你的材料耐用，自認(rèn)能保證消費(fèi)者們的粘性。

4、文化賣點(diǎn)

我們發(fā)現(xiàn)現(xiàn)在很多國外的產(chǎn)品到中國后不是都有市場(chǎng)的，可能因?yàn)闆]有考慮中國或亞洲文化特色，所以要融入當(dāng)?shù)丨h(huán)境情感等因素。

5、品質(zhì)創(chuàng)意圖

利用創(chuàng)意特色來吸引消費(fèi)者的方法已經(jīng)越來越多了，大家都想著自己的東西比同行的有特色從而形成差異化。 除了質(zhì)量外，首先會(huì)吸引到別人的就是你的創(chuàng)意圖設(shè)計(jì)，因一張圖來實(shí)現(xiàn)轉(zhuǎn)化率已經(jīng)不稀奇了。 比如：你的圖片全都是用手機(jī)拍的低像素圖片，而同行的包裝和創(chuàng)意圖、文案等都安排上了，你覺得兩者之間消費(fèi)者會(huì)選你的產(chǎn)品嗎？

二、詳情頁設(shè)計(jì)要點(diǎn)

1、首屏創(chuàng)意海報(bào)

我們要了解的一點(diǎn)是，詳情頁整個(gè)頁面很長，有些消費(fèi)者沒太多耐心全部看完，抓住這點(diǎn)我們就要用第一屏的創(chuàng)意設(shè)計(jì)來吸引消費(fèi)者們，引導(dǎo)他們往下看下去。

2、整體頁面協(xié)調(diào)

每款詳情頁對(duì)應(yīng)一款產(chǎn)品和主題，主題風(fēng)格跟產(chǎn)品不同，每種風(fēng)格給人帶了的感覺和氣質(zhì)都各不相同。比如：

高貴氣質(zhì)：通常都是簡(jiǎn)潔有質(zhì)感，或做出種奢華、華麗等感覺。

文藝特色：這類頁面所用的色彩往往都是以清新淡雅為主，給人一種柔和、寧靜的感覺。

年輕時(shí)尚感：頁面通常做的棱角分明，顏色亮麗，通常用亮色來點(diǎn)綴。

科技感：往往以深色、藍(lán)色調(diào)為主來做，或加入一些機(jī)械零件等，或棱角矩形之類。

3、布局設(shè)計(jì)規(guī)劃

左右布局：因其屏幕占比率較大，這類主要都以PC端為主，現(xiàn)在大部分流量都轉(zhuǎn)到移動(dòng)端了，現(xiàn)在反而不多見了，大家知道就好。

1字型布局：這種布局讓人有種厚重硬性的感覺，一定要用一些質(zhì)量很高的模特大圖來制作，不然根本做不出效果來。

S型布局：相比于常見的平鋪直敘類型，這類會(huì)讓人顯得有趣味性，常用在兒童用品類或女性物品。

Z字型布局：與S型作用類似，這種倒是多用在男性產(chǎn)品或科技類產(chǎn)品中。

樓層式布局：這類頁面很簡(jiǎn)潔也比較好把握，通常設(shè)計(jì)節(jié)奏在背景方面由深-淺-深-淺這種布局進(jìn)行，方便與我們預(yù)覽閱讀。

自由布局：這種設(shè)計(jì)沒有太多固定模式，排版全都被分割成一小塊一小塊，而且頁面做出來往往是看著簡(jiǎn)潔，但對(duì)設(shè)計(jì)的人來說，排版這塊要求會(huì)很高。

這種設(shè)計(jì)很適合那些走高端路線的時(shí)尚服飾類，不建議新手來嘗試。

三、詳情頁細(xì)節(jié)

1、內(nèi)容裝飾

裝飾性內(nèi)容在詳情頁中是起到了讓內(nèi)容更加豐富飽滿的作用，而為了讓詳情頁看起來更美觀，很多人喜歡加入一些英文字母來點(diǎn)綴，我們要知道英文在這里面是一個(gè)裝飾元素，切記不要做的太大或者顏色過深而喧賓奪主。

2、用色原則

因?yàn)槲覀冊(cè)斍轫摰拈L度問題，在用色上就不宜用大面積的色彩背景，如用上一些低明度色彩：灰色、黑色、白色等作為背景較好，彩色的顏色用在一些標(biāo)題或賣點(diǎn)圖上做點(diǎn)綴即可。

3、統(tǒng)一調(diào)性

做詳情頁一定要保證色彩、標(biāo)題、布局和風(fēng)格氣質(zhì)的統(tǒng)一，不然整個(gè)頁面會(huì)顯得雜亂不堪，讓人看不下去。

四、總結(jié)

詳情頁的作用除了讓消費(fèi)者們了解產(chǎn)品，更重要的是能給商家?guī)礓N量的提升，一張優(yōu)秀的詳情頁設(shè)計(jì)。

設(shè)計(jì)師首先要做的不是設(shè)計(jì)，而是思考確定整體頁面的方向，一張?jiān)斍轫摰耐瓿捎幸话氲臅r(shí)間拿去思考制作的方向，一半的時(shí)間才用于設(shè)計(jì)。

做設(shè)計(jì)時(shí)我們一定要學(xué)會(huì)先去思考，再下手做，才能慢慢增加自己對(duì)設(shè)計(jì)的理解從而更上一層。

原文出處：厚孜網(wǎng)絡(luò)