电商网站banner图如何设计

1、怎样设计出优秀的电商banner

一、走心的文案

好的标题能够吸引你的注意，而糟糕的标题，让人看都不想看，扫一眼便略过去了。所以做好Banner第一件事情，就是需要设计走心的文案。所谓走心，就是触动你的心灵，或者说让你感兴趣，激发你的点击欲望。

我们时常会看见这样的广告：文案内容直接罗列了公司经营产品或业务，抑或是像说明书一样详尽介绍产品或服务的主要功能。从广告主的角度来看这是合理的，用户需要知道我们产品有这些特点，这样我的的产品和服务才能被记住。但事实往往是：这些平淡无趣的广告，除了广告主自己以外，很难有用户真的愿意关注它。

那我们来分析下写文案人的心理：B点明确想让用户买我的记录仪。那么A点是用户想买记录仪不知道哪家好，我的记录仪有这么多功能，那么用户一定需要这个记录仪。

但用户真正的A点可能并不是“想买记录仪，不知道哪家记录仪比较好”，而是我为什么需要行车记录仪?所以对于这样的用户A点，可能更合适的文案思路是告诉用户：

当然用户绝对不会因为你写了几句话，就买下产品，还会考虑价格品质等等因素。不过我们这个Banner的使命就是吸引用户点击，提高页面转化率。用户感兴趣点了，你就成功了。

一篇帮你快速学会写文案的经典好文：《年度最佳教程！7招教你写出互联网顶尖文案！》

二、均衡的构图

构图其实说白了就是经营画面，进行布局，如何在你构图的引导下吸引用户点击，产生欲望，了解内容，如果都能达到，那说明你的构图成功了。

第一眼睛看到这个banner这个图完全抓不到重点啊，满眼的小文字，另外加上两个傲娇的大叔。完全不知道想表达什么。等等，

2、网店Banner的设计原则是什么？

与LOGO一样，Banner是任何购物网站开发与建设过程中不可缺少的元素，LOGO与Banner都有动态和静态之分，其创作的主要工具就是Photoshop与Flash。AdobeFlash是用来制作LOGO与Banner的动画，造型、背景、素材编辑、图像特效等用Photoshop来完成。Photoshop主要用于设计无动画的LOGO与Banner。

在网络营销术语中，Banner是一种网络广告形式。Banner广告一般是根据网站的风格和不同需要放置在网页上的不同位置，在用户浏览网页信息的同时，吸引用户对购物网站内容和广告信息的关注，从而获得网络营销的效果。

在各类购物网站中，Banner有多种表现规格和形式，早期的网络广告还有一种相对小一点的广告，称为按钮式广告（Button），常用的按钮广告尺寸有四种：

12525像素，1200像素，1200像素，881像素。随着网络广告的不断发展，新形式和规格的网络广告不断出现，因此美国交互广告署（IAB）也在不断颁布新的网络广告标准。其中最常用的是4860像素的标准标志广告，由于这种规格曾一度处于主导地位，在早期的网络广告领域，如没有特别指名，通常都是指标准标志广告。这种标志广告有多种不同的称呼，如横幅广告、全幅广告、条幅广告、旗帜广告等。通常采用图片、动画、Flash等方式来制作Banner广告。

对于网店来讲，主要目的就是销售商品，为消费者服务，所以网店Banner的设计也比较自由，形式多样。在一些打折网店、时间性促销网店，Banner的设计更加丰富。在各类平台的众多网店中，Banner的形式也是非常丰富、多种多样的。其中比较重要的一个类型是横幅广告，Banner尺寸一般在192060像素，或者950300像素等，有些高度数值会更大，要看具体的设计，要根据网店的情况来确定。

当用户访问一个网店的时候，主页面的信息展示是非常重要的，它在很大程度上影响了用户是否决定浏览本网站。在网店页面设计中光靠文字大面积地堆积，很难直观而迅速地告诉用户来到这里会得到什么有用的信息。因此，Banner设计在网店整体运行中起到了至关重要的展示作用，特别是首页的Banner，能使有效的、重要的信息传达给用户，让用户和文字之间的互动变得生动而有趣，吸引其浏览网店的注意力。关于Banner的位置，一般在网店首页的导航栏下面，处在视觉的核心位置。

图5.55所示为聚划算平台上的冬季保暖鞋Banner的定位与位置设计。

3、怎么设计网页banner

Banner规格尺寸大小不一，文件大小也有一定的限制，这就使得在设计上增加了许多障碍，颜色不能太丰富，否则会在文件大小的限制下失真，软文不
能太多，否则会没有重点，得不偿失，怎么在方寸间把握平衡，变得十分重要。接下来，我为大家总结累一些，如有鄙陋，请指正，万分感谢。

第一部分：颜色

1．Banner与环境对比

试想如果在一个以浅色调为基准的网站上投放Banner，是不是从明度上拉开对比会很好的提高用户的注意力呢(相反亦然)。

以此也可推想出，如果在一个有颜色基调的网站上投放补色或者对比色的Banner，效果就会变得更瞩目(补色和对比色案例)。

2．Banner颜色简单至上

(1)试想一个Banner五颜六色，是不是就能够吸引眼球了呢?首先，先对比一下

哪个更吸引你的注意力呢?大多数人肯定会觉得后者给用户带来的视觉传达力更强，简洁明确、朴素有力的效果，给人一种重量感和力量感。前者颜色虽多，却没有带来更好的视觉传达效果，为什么呢?颜色过度使用会打乱色彩节奏，并且，减弱了颜色间的对比，使整体效果变弱。

(2)其次， 使用颜色越多，最后保存时文件体积越大，加载起来越慢，让用户等待就意味着和用户说再见了，如果靠降低品质来达到Banner的上传要求，那展现给用户的是低质量的banner，也一样会丢失一些用户。

所以，颜色简单有力，加载清晰快速，对于banner的视觉传达很重要，只要让用户产生点击欲望，我们推广的目的就达到了。

第二部分：构图

1．构图的定义及规则

构图其实说白了就是经营画面，进行布局，如何在你构图的引导下吸引用户点击，产生欲望，了解内容，如果都能达到，那说明你的构图成功了。构图的基本规则是：均衡、对比和视点。

均衡：均衡不是对称，是一种力量上的平衡感，使画面具有稳定性。

均衡不是对称

对比：在构图上来说就是大小对比，粗细对比，方圆对比，曲线与直线对比等等。

白色线条的对比产生了空间感

视点：就是如何将用户的目光集中在画面的中心点上，我们可以用构图去引导用户的视点

将视点集中引导到slogan上

介绍完构图的基本规则，举例子检视下：一张X-MEN的宣传banner，这张banner人物排布既平衡又不对称，人物大小不一，产生出对比，突
出了部分剧中人物。Banner正中一个大大的X，把视点集中到了画面的最中心，很好的利用基本构图规则进行banner设计。

2．构图的样式

构图大概分以下几种：(1).垂直水平式构图 (2).三角形构图(正三角和倒三角)(3)渐次式构图 (4).辐射式构图 (5).框架式构图 (6)对角线构图

(1)垂直水平式构图：

平行排列每一个产品，每个产品展示效果都很好，各个产品所占比重相同，秩序感强，此类构图给用户心情：产品规矩正式、高大、安全感强。

(2)正三角形和倒三角构图：

多个产品进行正三角构图，产品立体感强，各个产品所占比重有轻有重，构图稳定自然，空间感强。此类构图给用户心情：安全感极强、稳定可靠。

多个产品进行倒三角构图，产品立体感极强，各个产品所占比重有轻有重，构图动感活泼失衡，运动感空间感强。此类构图给用户心情：不稳定感激发用户心情，给用户运动的感觉。

(3)对角线构图：一个产品或两个产品进行组合对角线构图，产品的空间感强，各个产品所占比重相对平衡，构图动感活泼稳定，运动感空间感强。此类构图给用户心情：动感十足且稳定。

(4)渐次式构图：多个产品进行渐次式排列，产品展示空间感强，各个产品所占比重不同，由大及小，构图稳定，次序感强，利用透视引导指向slogan。此类构图给用户心情：稳定自然，产品丰富可靠。

(5)辐射式构图：多个产品进行辐射式构图，产品空间感强，各个产品所占比重不同，由大及小。构图动感活泼，次序感强，利用透视指向slogan，此类构图给用户心情：活泼动感，产品丰富可靠。

(6)框架式构图：单个或多个产品框架式构图，产品展示效果好，有画中画的感觉。构图规整平衡，稳定坚固。此类构图给用户心情：稳定可信赖，产品可靠。

3．软文（Slogan）

(1)俗话说得好“话不在多，精辟就行”当今炙手火热的微博就是一个例子“140字概括你要说的”，Slogan也是一样。

(2)要言之有物，第一要抓住用户的心里，了解用户的想法很重要。第二我们要推给用户什么，用户对什么感兴趣。下面举个例子：

Slogan只有四个字，终于来了，白色iphone4吊足了apple迷门近两年的胃口，这四个字恐怕是他们最想听到的。用户从不会质疑apple的性
能，科技领先性及用户体验性，他们最想的恐怕就是拥有自己梦寐以求的白色iphone4。所以，apple的slogan简约而不简单。

4、怎么设计出好看的电商banner

这个得先要清楚自己想要表达个什么样的内容，再确定好你的受众群体，根据你受众群体的共同特征去提炼卖点和找素材，基本上就差不多了。

5、如何设计电商Banner制作

banner图制作根据产品的需求，介绍产品定位、产品文案、产品信息、产品设计。整个banner图要看起来合理清晰，尽量不要太花哨啦。

6、网站Banner 应该如何设计

一般网络banner设计都需要文案，都是根据文案来做的，所以需要文案才能设计，配图需要和文案有联系，这种设计主要考虑构图，构图技巧可以在花瓣上面有许多模版，

7、如何玩转电商产品banner图设计

设计感和层次感是作品的追求，电商banner设计，用有限的空间，展示店铺的核心版元素，考验的就是美工权的设计感。
层次感是banner主、次、辅的一种划分，要分析出主次和装饰元录，然后进行准确的设计.使人在第一眼就看到重点突出地方，设计师在作图的时候，有时候一 点点小小的细节和颜色都会影响到整个画面的层次美观感，一层一层的设计，虽然麻烦， 但是为了出更好的效果也值了!
过对版面的分割并且采用了倾斜性的分割形式等她手法，另版面活跃起来、有节奏感。通过对比色配色加大画面对视觉的冲击。

8、电商banner设计是什么?

电商banner设计是指网站页面copy的横幅广告，banner主要体现中心意旨，形象鲜明表达最主要的情感思想或宣传中心。
电商，是在互联网、内部网和增值网上以电子交易方式进行交易活动和相关服务活动，是传统商业活动各环节的电子化、网络化。电子商务包括电子货币交换、供应链管理、电子交易市场、网络营销、在线事务处理、电子数据交换、存货管理和自动数据收集系统。在此过程中，利用到的信息技术包括互联网、外联网、电子邮件、数据库、电子目录和移动电话。

9、怎么设计网页banner?

设计网页banner的方法如下：
1、以文字为主
虽然现在网站的图片大多都提倡图文并茂，这样能够提高用户体验，但是我们现在看到很多网站上的图片很多都是以图片为主，这样就是容易陷入一个误区：banner图只是为了用图片的形式来展示网站的主要产品或者企业的总体形象。其实这样的banner是很难能吸引到用户的。因为有些用户还是需要一定的文字来理解广告中的内容的。如果是文字为主，做到言简意赅，这样的图文并茂才能有利于提高点击率。
2、不要出现价格信息
一般的消费者对于价格都是非常敏感的，除非是你的产品价格相比同行业的产品价格低出很多，很有价格上的优势，否则不建议在banner上出现价格信息。因为价格一旦不是用户心理能接受的，这个banner就会被用户无视。
3、添加免费或者巨大优惠等字样
根据众多消费者的消费心理，他们对于那些物美价廉的产品都是非常热衷的。对于企业网站的推广和banner的设计也是这样，在banner上添加免费或者巨大优惠等字样也是能很有效地吸引到用户。
4、设计带有行为号召力
我们平时上网看到有些banner上会有个类似点击的按钮或者链接，潜意识会有着想点击的念头，可能会情不自禁地点击进去。这种方法也能很好地提高点击率。

10、电商banner怎么设计

你百度一下 我的电商历史图库，选海报墙。你看你是哪个类目的，选个类目大把的可以参考