Each of us is faced with advertising every day, watching TV, sitting on the Internet, being on the street, in a shopping center and many more where. In this article we will talk about one of the most popular types of advertising - banners. You will learn what banners are, what types of them are and how to create an advertising banner in Photoshop.
What is banner advertising
Banner advertising is a graphic image of an advertising character. Billboards on the streets, banners over shops, pictures on websites on the Internet, when you click on which you go to another site - these are all banners. Street banners appeared long ago, when there was not even a radio. But on the Internet they leaked in 1994 and quickly began to gain popularity. To date, no business is complete without advertising, and in particular advertising on the Internet, and banners are one of the most effective tools in promoting goods and services.
What types of banners are
- Outdoor advertising banner. It is made of special polyvinyl chloride film, vinyl, latex or nylon paper. It is a rectangular canvas of various sizes on which advertising information is printed. Printing is done by printers for large format printing - plotters.
- Advertising banners on the Internet. At first, these were vivid and memorable pictures, but with the development of technology, banners appeared with animated content, in the form of a short video clip, and even interactive mini-games. In any case, this is advertising, so it contains a hyperlink leading to a specific site. Even if you do not click on the banner, anyway, an informational image of an advertising nature will remain in your memory.
Types of Internet banners by implementation methods
Before you learn how to create a banner in Photoshop, we will get acquainted with the varieties of ways to implement them.
- Static The simplest banner is a picture with advertising content. The file size is small, so it loads quickly even on a slow Internet. It is easy to create a banner both in Photoshop and in other graphic editors.
- Animated. They weigh several times more than static, in connection with this, they load more slowly, but they are more striking to the user. To create such an advertising banner in Photoshop is already much more difficult.
- Rich text. A banner similar to an informational article with a graphic component.
- HTML5, JS, flash animation. These are already banners, which are interactive mini-programs. For example: various tests, primitive games, questionnaires. To create such an advertising banner in Photoshop, as you know, will fail.
Sizing a banner
Before you learn how to create a banner layout in Photoshop, you need to decide on its size. The standard is the size of 100 x 100 pixels. The most commonly used option is 468 x 60 and 234 x 60. The first digit determines the width, and the second length. So the vertical banner will have a size of, for example, 60 x 468 pixels. Therefore, it is important to know where you will place your banner.
Where to begin
So we learned that you can create a banner in Photoshop, both large and miniature. But you should not hurry even before you open the program to create a banner, as in any creative business, you need to estimate the design and content. We advise you to do this with paper and pencils. First, draw a rectangle, given the proportions of the future banner. We come up with the necessary advertising text. Then we determine what the background will be. There is no need to draw all of this; you just need to write your plan in words. Then you can already figure out which pictures you can insert and where to place them stylishly, including a possible corporate logo. Most likely, the resulting on paper will look like a schematic plan. The final stage of preparation: we are looking on the Internet for pictures that fit your idea. It is important to remember about copyrights, therefore we select pictures on free resources.
Making your banner ad
So your layout is ready. Now we proceed directly to the main process.
In this article, we will make a static horizontal advertising banner with a size of 468 × 60 pixels and the text “iPhone 5 sale. Do not miss the chance” in the Photoshop program version CS6.
- Run the program. Create a new document with dimensions of 468 × 60 pixels.
- We will make the background blue, seamlessly turning into white. To do this, select a color in the lower white corner, then select the Gradient Fill tool. To apply a fill, click on one side of the canvas and, without releasing, swipe to the other end. Try different options until you find one that suits you.
- The next item, we will insert the image that we found in the search engine. We open it in Photoshop. First, we will adjust the size of the image for the banner - select the "Image" tab in the menu and click "Image Size". Set the height to 60 pixels, the width will be proportionally reduced. Now you need to separate the image of the smartphone from the background. Select the Polygonal Lasso tool and select the necessary space. After that, we move the selected area using the copy-paste command.
- Insert text using the Text tool. We adjust the sizes, select the font and color. You can use ready-made templates in the window with styles. Pay attention to the Layers tab. There, each element of the banner is a separate layer. They can be copied, deleted, changed various properties individually. We duplicated the image layer and moved the second image to the opposite side of the canvas. It remains only to save the file. When saving, select the format of JPG, GIF or PNG.
Your first banner ad is ready, it remains only to place it on the right site. Everything actually turned out to be quite simple.
This was an introductory article for beginners with a minimal detailed instruction on creating a banner. On the Internet there are a lot of specialized literature and video lessons. After spending a few days studying this wonderful program, you can create much better advertising banners. It is also worth noting that there are similar products with lightweight functionality, as well as applications specifically made to create ad units.