【学习网页电商设计】制品详情页设计思路和技巧
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">好的<span style="color: black;">制品</span>详情页能给用户一个<span style="color: black;">知道</span>的利益点，即卖点。通俗地说，<span style="color: black;">便是</span><span style="color: black;">为何</span>用户要买你的，而不是别人的同类<span style="color: black;">制品</span>，<span style="color: black;">因此</span><span style="color: black;">制品</span>页要专注在<span style="color: black;">制品</span>的卖点上，<span style="color: black;">同期</span><span style="color: black;">必要</span>在最短的时间抓住用户的心。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-axegupay5k/eb7aa9c3dc7743fba6e22ff2849680dc~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=b593YpajAtoejOgIrONoRjpuHdY%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">在快节奏的生活中，用户<span style="color: black;">无</span>耐心去看大篇幅的<span style="color: black;">照片</span>和文字，<span style="color: black;">因此呢</span>好的页面的文案话语，是短小精悍、言简意赅，让用户<span style="color: black;">火速</span>就能<span style="color: black;">认识</span>到他所想<span style="color: black;">认识</span>的<span style="color: black;">制品</span><span style="color: black;">状况</span>。一款<span style="color: black;">制品</span>详情页设计思路如下：</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/fbcda053d1684389a0226589af85da33~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=v9KvycRhrpFvFuUZh1Tl21hShFI%3D" style="width: 50%; margin-bottom: 20px;"></div>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/9f6cb847feae48779aa0321fcdb0bd42~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=fgOGt%2FZCzde7UPTV6GrVW9zFjfo%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">详情页是打动用户<span style="color: black;">促进</span>购买的关键页，将页面板块设计为商品板块、<span style="color: black;">评估</span>板块、图文详情板块和<span style="color: black;">举荐</span>板块。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/37c74f6cbe2e4b3cbde64a982fd67d0e~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=Hm2ESQPCl8N1Durin%2FgEeMOp6mw%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">①商品板块，<span style="color: black;">包括</span>商品属性如商品图、购买说明规格<span style="color: black;">选取</span>、价格优惠等。</span></span></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">②<span style="color: black;">评估</span>板块，传达给用户<span style="color: black;">更加多</span>的关于商品的信息，如已用过商品的用户<span style="color: black;">评估</span>、<span style="color: black;">怎样</span><span style="color: black;">运用</span>、售后服务等等感性介绍，从而解答用户心理的疑问和顾虑。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/ce864bf7c83840fb8b35754a95a2e648~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=ubiVtxzBOypkfhAgFMEcx%2Bg8REo%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">③图文详情板块，长度适宜,将用户需求的关键点和商品的卖点分出重要级之后，让图文详情板块的前半部分页面信息<span style="color: black;">明显</span>。</span></span></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">④<span style="color: black;">举荐</span>板块，<span style="color: black;">举荐</span>用户<span style="color: black;">关联</span>同类<span style="color: black;">制品</span><span style="color: black;">或</span>与此页<span style="color: black;">制品</span>相搭配的其他<span style="color: black;">制品</span>，给用户<span style="color: black;">更加多</span><span style="color: black;">选取</span>机会。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/c8b78b2c9b9041579378429a6bac1302~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=fZly1a%2FdPLfiITn24pc%2BlCB4YRI%3D" style="width: 50%; margin-bottom: 20px;"></div>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/70e3a1b95c684f948007646e8b64d49b~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=BSkjnHulkcv%2Bx7Ax6tDZg%2BeK1Mo%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">设计客服、<span style="color: black;">保藏</span>、分享、店铺和立即办理。注重人机互动，让这些工具<span style="color: black;">方便</span>地出<span style="color: black;">此刻</span>用户视野中，让其随时随地能基于场景进行高频的互动操作，<span style="color: black;">得到</span>用户更有效转化。从用户与商品的互动操作主题场景来分析，可对互动场景的价值性进行优先<span style="color: black;">次序</span>的<span style="color: black;">摆列</span>。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/1cfd37c0925c476f94575dc27bacd940~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=nOzydPcf%2F%2FI2ZRf3XbBQWXP8ziY%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">①立即购买，用户将<span style="color: black;">能够</span>直接进入购买确认页面。</span></span></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">②<span style="color: black;">保藏</span>，用户可将<span style="color: black;">制品</span><span style="color: black;">保藏</span>在个人中心里，在<span style="color: black;">将来</span>的某个场景下，将有可能进行购买。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/7c4c0e3c9c684386b359fddb38e386f6~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=Wcjwdk5NI6Jp8N87eatuFtiplpI%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">③客服，用户在<span style="color: black;">选取</span>和购买过程中，任何疑问均<span style="color: black;">能够</span><span style="color: black;">经过</span>人工介入解答。</span></span></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">④店铺，用户<span style="color: black;">能够</span>直接进入店铺<span style="color: black;">认识</span>和<span style="color: black;">选取</span><span style="color: black;">更加多</span>的<span style="color: black;">制品</span>。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/95b5f08b1e0f4ff3bdd9530fdc6051ba~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=3Gkjn7Nfryfm5tQyYl8%2FawPZUVI%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">⑤分享，<span style="color: black;">做为</span>对<span style="color: black;">制品</span>有了最直接认知的这一类用户，其主动分享的价值性要远远高于<span style="color: black;">经过</span>市场营销手段去刻意实现的分享过程。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/005c67b8650142f589a826286690b9f0~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=ccug1OBw8TMNHMoSRZ6pe8syDlI%3D" style="width: 50%; margin-bottom: 20px;"></div>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/38f3eea992fe4c92b43ce9ca56cb63df~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=A4ughUfncTqh5CFiLPxFN3oEfsY%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;"><span style="color: black;">全部</span>版面做到主题鲜明、简洁、<span style="color: black;">知道</span>，以优美画面向用户介绍<span style="color: black;">制品</span>卖点，<span style="color: black;">从而</span>吸引有需求用户的眼球。页面风格简洁明快，力求达到表格简单，色彩搭配协调，文字处理人性化，有亲切感等。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p26-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/1822074d87fa4d50af749560c018a221~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=8DPbG7BWg4TIi871Ga3E7dv7RhA%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">①头图，页面<span style="color: black;">最后</span>目的是<span style="color: black;">营销</span><span style="color: black;">制品</span>，<span style="color: black;">倘若</span>过分强调画面的美感，<span style="color: black;">增多</span><span style="color: black;">照片</span>视觉的占比，强调网站设计的艺术性，反而不会收到好的效果。页面应鲜明且不喧宾夺主，让浏览的者能产生深刻的印象。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/d34b96d55b3b4425a64a2bcbaa0ca0e4~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=3XNDu52IGfcotGCXYZhZv%2BlGcYg%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">②标题，清晰<span style="color: black;">恰当</span>表述<span style="color: black;">制品</span>的内容，<span style="color: black;">明显</span><span style="color: black;">制品</span>的核心价值。标题语意通顺，无乱码杂质。</span></span></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">③销量，销量<span style="color: black;">必定</span>程度上标明了<span style="color: black;">制品</span>的受欢迎度，销量可<span style="color: black;">选取</span>月销量、季度销量或年度销量，<span style="color: black;">经过</span>销量让用户<span style="color: black;">晓得</span><span style="color: black;">制品</span>的爆款程度。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/450f66439d13467f84cf57659899287b~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=6s5IiIVGAmx5ycM6YNMvzyvTI3w%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">④促销，以价格优惠、<span style="color: black;">绑缚</span>优惠进一步推动用户购买欲望，满足“节省”或“买到则赚到”心理，<span style="color: black;">供给</span>活动促销、券码优惠等信息。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/9644c3207fdf4bc5a242213272e24036~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=Bi8ZEs7ymY8%2BvM04KKp1vXjCjUw%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">⑤<span style="color: black;">评估</span>，提炼好评关键字置顶展示，将客观好评内容排序到<span style="color: black;">评估</span>前面或积极互动内容有意展示，<span style="color: black;">经过</span>用户<span style="color: black;">评估</span>内容介绍<span style="color: black;">制品</span>更有说服力，更能<span style="color: black;">表现</span><span style="color: black;">制品</span>满足用户真实需求。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/7d2017ada29f46deaa0f18b796f9844a~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=4UvaG2ad3lSg5MicV7PzVUmz%2Bzs%3D" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;"><span style="color: black;">⑥图文，<span style="color: black;">照片</span>和相配的文案话语。<span style="color: black;">照片</span>给人的印象深刻，相比文字<span style="color: black;">拥有</span>更强的感性认知。但<span style="color: black;">倘若</span>只关注<span style="color: black;">照片</span>，<span style="color: black;">忽略</span>与<span style="color: black;">照片</span>相配的文案，则<span style="color: black;">不可</span>达到预期目的。<span style="color: black;">由于</span><span style="color: black;">制品</span>的属性、卖点，以及迎合用户的情感诉求都<span style="color: black;">必须</span>文案来进行说明与阐述。</span></span></p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/224eefeb81d24267a5a4f90337cf57bf~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1723650826&x-signature=Ic6y4gVRhbZDYO88qnGy6y%2FhBgY%3D" style="width: 50%; margin-bottom: 20px;"></div>
楼主发的这篇帖子，我觉得非常有道理。 论坛外链网http://www.fok120.com/
页:
[1]