常用的商品詳情頁面布局（常用的商品詳情頁面布局-）

大家好！今天讓創(chuàng)意嶺的小編來大家介紹下關于常用的商品詳情頁面布局的問題，以下是小編對此問題的歸納整理，讓我們一起來看看吧。

開始之前先推薦一個非常厲害的Ai人工智能工具，一鍵生成原創(chuàng)文章、方案、文案、工作計劃、工作報告、論文、代碼、作文、做題和對話答疑等等

只需要輸入關鍵詞，就能返回你想要的內容，越精準，寫出的就越詳細，有微信小程序端、在線網頁版、PC客戶端

官網：https://ai.de1919.com。

創(chuàng)意嶺作為行業(yè)內優(yōu)秀的企業(yè)，服務客戶遍布全球各地，如需了解相關業(yè)務請撥打電話175-8598-2043，或添加微信：1454722008

本文目錄:

• 1、怎樣對網店進行視覺布局？

• 2、一般淘寶網店的頁面都是怎樣布局的？

• 3、商品詳情頁設計風格有哪些要求?

• 4、商品詳情頁應該要怎么制作?

一、怎樣對網店進行視覺布局？

網店的布局設計在不同的平臺上是不一樣的，淘寶與天貓平臺上也有普通店鋪與旺鋪之分。但一般的網店店鋪最關鍵的展示區(qū)有店鋪首頁、商品（寶貝）分類頁、商品（寶貝）詳情展示頁，其他的展示區(qū)還有很多，比如個人空間、信用區(qū)、店鋪介紹區(qū)等。這些功能區(qū)域在設計時要進行合理的布局。

（1）店鋪首頁：在旺鋪設計上用戶可以自由發(fā)揮的余地較大，可以內置網頁程序代碼；專業(yè)的網店店鋪設計，可以充分利用首頁空間，達到美化店鋪，對產品對店鋪背景進行宣傳的目的。

（2）商品分類頁：針對產品（寶貝）的分類模塊的特點進行裝修裝飾，采用不同的設計和布局以及素材的搭配，達到預想到的效果，讓人感覺店鋪設計美觀大方。在網店的裝修設計中，系統(tǒng)后臺有自定義分類模塊、左側分類模塊與右側自定義模塊等，要對這幾個模塊進行合理布置。

自定義分類模塊，相當于一個網店店鋪的橫向目錄，通過點擊不同的分類項可以展示不同的頁面，因此，在此頁面的設計上一定要條理清晰，以加深店鋪的瀏覽深度，這也是消費者經常重點關注的模塊。一個好的自定義分類，可以凸顯店鋪風格定位、商品重點推薦、特惠活動、與顧客的互動等。這個模塊可以自定義，即商家在系統(tǒng)后臺可以自行設計。

左側分類模塊，是提高店鋪瀏覽深度的一個重要操作，而其中的類目排列則為重中之重，通過左側模塊可以向消費者展現店鋪銷售的各類商品，通過合理的排序，可以讓消費者方便快速地找到需要的商品。在系統(tǒng)后臺商家（企業(yè)）可以增加相應的模塊，如幫派入口、新款推薦、熱銷商品、特價促銷、一元換購等，這些模塊的添加，會增加消費者的黏性，提升消費者反復點擊或者購買的行為，讓消費者停留的時間更長。

右側自定義模塊，是店鋪首頁的黃金展位，建議設置最新店鋪活動、熱銷款、主打商品、快速導航。右側模塊可以選擇放置當下店鋪主推的產品大圖，盡量不要用密密麻麻的文字填滿。模塊中部，產品的排列不需要過分整齊，進行有層次的展示，差異產生關注點擊。

（3）商品詳情展示頁面：商品詳情頁對于網上銷售的商品來講是非常重要的。消費者在搜索到商品以后，基本上都是通過商品詳情頁了解商品的特征與屬性，而事實上商品的銷售也關鍵看這個頁面，商品詳情頁是否做得美觀、舒適、可信，商品屬性描述得是否清楚等，均影響消費者對商品品質與價值的把握。一般來講，為了使商品詳情頁更適應消費者的閱讀，使商品詳情頁更美觀漂亮，商家會使用各類方法與技巧，比如用商品描述模板、給商品拍很多細節(jié)照片、把商品詳情圖設計得非常悅目等，這些都需要巨大的工作量和投入，可見商品詳情頁的重要性是不言而喻的。對于業(yè)績比較好的網店商鋪，商品詳情頁的上半部分一般設置店鋪的店招，左邊有分類欄，下面部分設置同類商品推薦模塊，使網店頁面整體協(xié)調，并最大限度地吸引消費者在店鋪里瀏覽。

商品詳情頁布局

首先，要考慮消費者的購物邏輯，消費者在網絡平臺的購物邏輯與實體商店的購物邏輯相似，在安排商品詳情頁的信息流邏輯順序時，也應當尊重消費者遞進的情感需求。比如去商場買一部手機，可能一眼看中一個放在柜臺醒目位置的型號，這相當于消費者從網店店鋪首頁進來；接下來可能會走近看看機器的整體外觀，詢問相關配置信息，這就需要商品詳情頁的主圖和產品介紹圖與相關文字來提供給消費者；接下來拿起樣機看看功能、材料、做工、配件等，這時候相當于瀏覽網店商品詳情頁的功能展示圖、商品細節(jié)圖。如果消費者覺得滿意，符合需求，一般情況下會再了解售后服務信息以及優(yōu)惠活動、物流等情況，然后就是下單成交。以上是一般的購物邏輯。

根據以上所述，在設計商品詳情頁的時候應考慮如下信息：商品的主圖、商品整體圖、價格、產品基本信息、規(guī)格尺寸、細節(jié)、使用方法、質量認證、售后保障等。通過歸納可以整理為以下幾個模塊來展現商品與服務的詳細信息。

商品展示類———款式、色彩、搭配、細節(jié)、賣點、包裝。

吸引購買類———賣點強化、情感打動、熱銷盛況、買家好評。

品牌形象類———榮譽、資質、生產、銷量。

促銷信息類———熱賣推薦、關聯銷售、促銷活動、優(yōu)惠套餐。

購物指導類———購買、付款、收貨、驗貨、退換貨、保修。

在確定了商品詳情頁需要表述的內容以后，就需要根據實際情況來分析與確定商品詳情頁展示內容的邏輯結構與展現順序。根據消費者一般的購物主流程，可以根據以下順序來逐一地為消費者展現商品與服務信息。

店鋪活動信息———刺激消費，流量引導，提高轉化率。

商品整體展示圖———吸引顧客，強化賣點，情感共鳴。

商品介紹文字———清晰完整的商品介紹功能與特征，可以圖文并茂，促成交易。

商品細節(jié)圖———多角度展示、場景展示、細節(jié)展示、包裝外觀展示、包裝配件清單展示。

品牌介紹———品牌故事、榮譽資質、生產實力、加強信任。

購物須知———交易條款、常見問題、售后相關、聯系方式。

但不是所有類目的商品都用以上流程排序，企業(yè)應根據不同的商品類目、不同品牌的特征與內涵，以及平臺促銷活動情況，因地制宜、因時制宜地設計商品詳情頁。商品詳情頁承載的信息量很大，一般要優(yōu)先選擇消費者首先關注的信息作為導航，放在頁面的前幾屏展示出來，其他次重要信息可以放在頁尾，也可以新建頁面描述，還可以通過客服告知。

二、一般淘寶網店的頁面都是怎樣布局的？

優(yōu)化導航設計

買家進入店鋪首頁之后，首先看到的是產品導航。賣家在這里只是簡單的放置了兩個產品的主圖，沒有突出產品的賣點，是比較失敗的地方。

建議：

賣家可以在導航欄加入店鋪的介紹，建立單獨的店鋪形象頁面，增加一定的信賴感，讓人感覺到產品都是優(yōu)質的，都是有保障的。另外，賣家可以在首頁首屏，把店鋪的活動信息或者店鋪的主推產品，頁面以海報的形式展現給客戶。

合理設置首頁架構

首頁的設計，掌柜列出了大量商品，但是，產品的圖片均為實物圖，很少出現場景圖，這樣簡單粗略的布局，讓客戶看的眼花繚亂。

建議：

店鋪首頁就是讓客戶舒服而又快速準確的找到自己想要的信息。

自定義區(qū)是做關聯推薦比較好的一個區(qū)域，在這里可以關聯店鋪最熱門的活動，還可以關聯店鋪中最熱門的搭配。比如，店鋪內有兩個寶貝一起被購買的機率非常大，就可以把這兩個寶貝放在首頁自定義區(qū)做關聯搭配。另外，如果有新品上市的話，也可以在自定義區(qū)域展示，給新品多一些展示機會，提高新品的曝光度，提升成交量。

左側欄內容最好能包含促銷主題和時限、原價、現價、立省多少等信息，有針對性的向新老客戶推薦店鋪鎮(zhèn)店之寶。新客戶通常比較關心熱銷程度，所以應突出呈現成交量；而老客戶在對店鋪和店鋪商品有一定信賴度的基礎上，更為關心折扣力度，所以應突出呈現優(yōu)惠價格。

寶貝分類、櫥窗推薦等設置可以按照買家的消費需求和搜索習慣來進行分類，比如：按商品品類、功用、消費力、使用場景等來劃分，以便老客戶都能最快的找到自己的消費目標，引導他們進入下一級的商品列表。如果同時想針對的是新老客戶這兩大消費群體，那么就要在視覺設計上同時強化銷量和折扣這兩個信息，迎合他們的興趣點，引導其瀏覽頁面。

優(yōu)化寶貝詳情頁

先來看看該店鋪寶貝詳情頁面出現的問題。頁面情況：簡單的單品促銷，其次就是產品展示。顯然這樣簡單的布局，對客戶的體驗度是很不好。

建議：

寶貝描述要增加客戶體驗，簡單說，就是要表達出這個產品用來干什么的，是解決什么問題的，賣點一定要抓準顧客的心理需求，用圖片和文字展現。

針對該店鋪要注意三點：

1.可以增加實景圖，把產品放到現實生活中去，讓客戶可以直接感受到，自己如果用上該產品，大致是什么效果。

2.建議實景圖，可以同時加在寶貝詳情的頂部和底部，加在頂部是給客戶一個大致的效果展示，刺激客戶看下去，加在底部是為了刺激客戶形成購買。

3.賣家在做單獨的促銷活動頁面時候，同樣可以參照上面首頁的布局思路，但切忌，要抓住整個促銷頁面的主題核心，圍繞著這個主題核心展開相關的頁面設計。

三、商品詳情頁設計風格有哪些要求?

①頭圖，頁面最終目的是銷售產品，如果過分強調畫面的美感，增加圖片視覺的占比，強調網站設計的藝術性，反而不會收到好的效果。頁面應鮮明且不喧賓奪主，讓瀏覽的者能產生深刻的印象。

②標題，清晰合理表述產品的內容，突出產品的核心價值。標題語意通順，無亂碼雜質。

③銷量，銷量一定程度上標明了產品的受歡迎度，銷量可選擇月銷量、季度銷量或年度銷量，通過銷量讓用戶知道產品的爆款程度。

④促銷，以價格優(yōu)惠、捆綁優(yōu)惠進一步推動用戶購買欲望，滿足“節(jié)省”或“買到則賺到”心理，提供活動促銷、券碼優(yōu)惠等信息。

⑤評價，提煉好評關鍵字置頂展示，將客觀好評內容排序到評價前面或積極互動內容有意展示，通過用戶評價內容介紹產品更有說服力，更能體現產品滿足用戶真實需求。

⑥圖文，圖片和相配的文案話語。圖片給人的印象深刻，相比文字具有更強的感性認知。但如果只關注圖片，忽視與圖片相配的文案，則不能達到預期目的。因為產品的屬性、賣點，以及迎合用戶的情感訴求都需要文案來進行說明與闡述。

關于商品詳情頁設計風格有哪些要求，環(huán)球青藤小編就和您暫時分享到這里了。如果您對網站設計、頁面排版、圖像處理方面比較感興趣，希望分享的這篇文章可以給您的學習或工作提供幫助。如若您還想了解更多關于平面設計的素材及技巧等內容，可以點擊本站的其他文章進行學習。

四、商品詳情頁應該要怎么制作?

1、促銷闡明

促銷信息十分顯著，促銷信息的放大，色彩的突出，價格的引誘，點擊按鈕的呈現，絕對經典的促銷方式呈現，也是最能招引顧客眼球，因此促銷手法也是最為重要的。

2、招引購買

頭圖也就是整個詳情頁的品牌形象圖是至關重要的，占首要位置。因此品牌形象圖一定要給顧客有深入的形象。其間包括品牌產品、產品名稱、產品賣點。結合產品賣點制造品牌形象海報圖，參加切合產品功能性的布景，以情感互動的局勢才能更能感動顧客。

當然咱們也是少不了注意字體運用標準了，一般正規(guī)的品牌都會有自己的字體庫，字體的運用標準。然而咱們也是最不能忽視的是資料的運用版權了。一個好的品牌，圖片的運用也是需求特別注意的，通常都會有專用的資料網站，專用的資料購買版權。

3、商品展示

列點闡述，依據產品賣點結合資料圖進行圖文結合規(guī)劃，當然也是時間注意著文字運用標準，大小標題的一致，重要賣點的突出的字體運用標準，才能使整體賣點的一致與連貫性。產品的形象圖(熊媽媽與熊寶寶)的展示，也是最能體現品牌的特性。

4、實力展示

用圖片的局勢列點具體展示產品的賣點，明晰明了，使得顧客對咱們產品有一定的信任運用地圖的局勢展示原料的生產基地，凸顯產品的高品質。圖片的方式展示，減少顧客的視覺疲憊。藍色主題的定位，健康環(huán)保，對眼睛也是有維護作用，從而使顧客愛上咱們的產品。

5、溫馨闡明

溫馨的提示，運用方法的解說，排版需簡潔明了駭要?？ㄍㄐ蜗蟮膮⒓痈茏尶菰锏年U明變?yōu)樯鷦?，也是最為簡略而又通俗易懂，這是顧客最為樂意接受的規(guī)劃。

以上就是關于常用的商品詳情頁面布局相關問題的回答。希望能幫到你，如有更多相關問題，您也可以聯系我們的客服進行咨詢，客服也會為您講解更多精彩的知識和內容。

推薦閱讀：

seo有哪些領域（seo的幾個常用領域）

常用的紙盒結構有哪些（常用的紙盒結構有哪些類型）

人工神經網絡常用的算法（人工神經網絡常用的算法hebb）

走路的軟件排行榜（走路的軟件排行榜有哪些）

杭州四季青老市場具體地址（杭州四季青老市場具體地址是什么）