如何用Photoshop在线制作banner图

Banner图有哪些？

其实banner也就是大家常见的广告大图，或者广告小图；Banner可以作为网站页面的横幅广告，主要用到网站页面的顶部、电商平台顶部、报纸上面部分、各种宣传大图。广告商有时会计算banner的 "浏览量"，或在一段时间内下载banner图的次数。Banner主要体现中心意旨，形象鲜明表达最主要的情感思想或宣传中心。

为你的网站、广告或社交媒体页面设计一个banner图很困难吗？不可能！我们将告诉你如何使用Photoshop几步制作一个banner。你不需要花几个小时，学会以下这些方法，你可以很快完成制作。你也可以用空白画布DIY，在设计上打上你自己的独特标记。

如何用Photoshop制作banner图

1. 你需要多大的尺寸？

第一步是按照你需要的特定banner尺寸创建一个空白文件。以下是常见的尺寸。你可以用下面的说明在Photoshop中键入尺寸。

在Photoshop或类似工具中选择这些横幅尺寸之一

在Photoshop中，进入文件>新建

在弹出的窗口中，选择 "网络 "并输入尺寸为300 x 250像素。这是标准的横幅尺寸之一。点击'创建'，一个新的空白图像就打开了。

2.添加产品图片

进入 "文件">"打开"，打开你想在banner上展示的产品图片。可选：如果你想在banner中改变背景颜色，那么请使用具有透明背景的产品图片（png文件，不是jpg）。可以使用jpg文件，但背景会显示在banner上。下面的截图中的格子背景是Photoshop显示它是透明背景的方式。

然后进入窗口>排列>垂直平铺。这将显示图像和模板并排在一起。

接下来，点击移动工具（下面的绿色箭头），然后点击并拖动你的产品图片到banner上。如图所示，产品现在出现在你的banner上。一旦产品出现在横幅模板上，你就可以关闭产品图像标签。

在Photoshop中制作banner

3. 调整图像大小以适应横幅

要调整你的产品图像的大小，使其适合旗帜，去编辑>自由变换。这将在你的产品图像周围设置标记，你可以用它来调整图像的大小。这也让你在横幅上的任何地方移动你的产品。因此，调整大小并将其移动到你想要的位置。

你也可以使用顶部栏来调整大小，如下图所示。请注意，该图像已被调整为原始高度和宽度的38%，以适应我想要的位置。

调整banner图大小

4. 改变背景颜色

由于我们使用的是透明背景的产品图片，我们可以把背景的颜色改成我们想要的任何颜色。在屏幕右下方的图层面板上点击背景层（下面的图层1）。

然后点击屏幕左侧所示的取色器工具。这就打开了颜色工具。选择黑色或任何你喜欢的颜色。

改变背景颜色

5. 给背景上色

使用油漆桶工具，点击图像上的任何地方（确保图层1仍被选中）。这样就把背景改成了黑色。

给背景上色

6. 在横幅上添加一些文字

在本教程的其余部分，我将继续使用白色背景。

选择第2层。这是因为我们希望文字出现在横幅的顶部，所以点击最上面的层。然后选择文本工具，在你想让文本出现的横幅上点击。你会看到一个文本框被创建，你可以在那里输入你的文本。

在Photoshop中为banner添加文字

你可以通过屏幕右侧的菜单中的选项来改变字体大小和颜色等。

在Photoshop中改变字体设置

7. 在横幅上添加一个按钮

点击矩形工具，在图像上点击并拖动。注意，有些工具是在子菜单中。要看子菜单（如下图），点击并按住工具图标。有些工具有子菜单，有些没有。

通过点击四角并拖动来确定矩形的大小。

在Photoshop中添加一个按钮

现在从顶栏的 "填充 "菜单中选择一种颜色。

在Photoshop中改变按钮的颜色

再次点击文字工具，然后点击矩形，使文字出现在矩形上，使它看起来像一个按钮。输入一些文字，如 "立即购物 "或类似的。

在Photoshop中为按钮添加文本

要移动文本并定位它，再次点击移动工具，就像我们在本教程前面移动图片那样。一旦你定位好了，这里就是最后的横幅了。

如果你想添加你的标志，你可以打开你的标志文件，再次使用移动工具，点击并拖动标志到横幅上，按你想要的方式调整大小和位置。

在Photoshop中制作banner广告

8. 保存JPG文件和横幅设计模板

最后，进入 "文件">"另存为"，从下拉菜单中选择JPG，将文件保存为JPG，以便在Adwords和广告需求中使用。然后重复该步骤，但现在保存为PSD文件。这将保存所有图层的文件，以便你以后可以回来改变图像、文字或按钮，并从中创建新的横幅。该PSD文件是你的横幅设计模板。

保存横幅文件和设计模板

其他banner图的尺寸

现在你已经创建了一个300×250的banner图，你可以继续创建其他标准尺寸的banner图，如728×90、160×600、120×600和移动尺寸。模板创建需要时间，但一旦你完成了基础工作，那么在你推出新系列时制作不同版本的banner图就会变得快速而简单。

Banner制作的注意事项：

1.构图清晰

参考左字右图、左图右字、左中右构图、上下构图、文字作为主体居中、不规则构图，按照这种排版方式我们就可以做出效果和内容更加丰富的Banner。

2.文字效果

选择字体就就需要采用宋体和细黑体两种形式，这样设计出来Banner整体看起来更符合网站，也更符合整体网站和谐性。

3.颜色选择

尽量选择较少的颜色，整体色调统一。如果选择颜色很复杂的物体， 尽量不要使用彩虹色、晕边等复杂的特技图形效果。我们在设计网站Banner的时候，可以采取黄黑白这三种颜色搭配的方式进行，这样做出来的效果更加颜色效果对比鲜明，而且视觉效果更加具有冲击力。

4.尺寸

考虑浏览者的网速，banner图不宜制作的过大。Banner 的显示尺寸非常有限，摆放太多产品，反而被淹没，视觉效果大打折扣。所以，产品图片不是越多越好，易于识别是关键。