how to design a Banner advertisement map

Banner advertisements are everywhere. From the content recommendation at the top of the homepage of the website to the sidebar, from the articles to the gallery list, you will find their shadow in almost all the places where the content exists. Usually, they look beautiful, a little grandiose, and will eat away at your web browsing experience. Although we are trying our best to reduce their negative impact on users, bad reputation is always bound to them.

in fact, Banner advertising has a great influence on users, and reasonable use will definitely get twice the result with half the effort. So how to create an excellent Banner advertisement that is not boring and has a considerable conversion rate?

The vague theory may not be grounded enough. Let's learn Banner advertising design skills from the following 51 cases.

1. Stylized graphic typesetting

This is a group of Banner advertisements produced by DearMissModern, and each picture maintains the consistency of temperament and style in both text and picture material. The formal sense of fonts and the collocation of images and graphics in the picture material make the whole advertisement Banner feel stronger. If the picture is not so stylized, but more subtle, it should be matched with more classic and attractive fonts, and the reason is the same.

2. Create a hierarchical

Visa's holiday advertisement Banner makes full use of the advantages of hierarchical structure. The selection of photos is a kind of food with depth of field and layers, which will attract people at the first moment, while the typesetting of words covers the blurred vision, which ensures readability and adds a layer to convey information and ensure that it will not be chaotic. The position of the button is just above the food and below the text, which is just right to attract people to click.

3. Use related icons

This advertisement Banner from Google brings a personal experience through hand-painted icons.

every hand-drawn icon in the picture is very easy to identify, though it is not complicated, it gives people a feeling of walking through the world. This indescribable but touching feeling makes this advertisement no longer just an advertisement.

4. Add unexpected elements

What should a job advertisement do? Google's job advertisement is also unexpected. There are no tall instructions and beautiful girls, but graffiti handwritten advertisements like small handwritten advertisements on community bulletin boards. This kind of advertisement is not complicated, but it is unexpected, and this familiar feeling is touching enough.

5. Add illustrations

This case is also an advertisement picture of Google. The addition of illustrations makes the whole advertisement picture full of childlike innocence and interest, and with flat elements, it looks more unified as a whole. This kind of illustration is not difficult to implement. It may look a little rough, but it is really friendly. Illustration is different from photographic pictures. It can endow designers with temperament that they can't match. Of course, you have to use it well.

6. Layout adaptation

This advertisement map of p>FatCow was designed by EnvatoStudio. In order to adapt to different advertising spaces, the whole advertisement was produced in several versions with different sizes. After designing the most commonly used advertising map, the elements in it are edited twice to make it fit the size of other advertising spaces, and some elements need to be adjusted, removed or added, so that it can be realized.

7. Use gorgeous colors

This GoogleMusic advertisement uses vibrant pink and blue with the same high saturation, which is in sharp contrast and has a profound impact on people. Compared with the ordinary single-tone Banner, this colorful multi-color collocation is more eye-catching, but more attention should be paid when using it to ensure readability and coordination.

8. Keep it simple

If Coca-Cola has something outstanding, keeping it simple is definitely one of the many advantages worth learning. The Banner design of Coca-Cola's advertisement is a good continuation of this tradition: the iconic color matching of the LOGO slogan of the product map. Although the content is not much, the effect is great.

a Banner advertising picture filled with all the information will not do you any good, because users will not read it at all. It is enough to present the most important information.

9. Pay attention to trends

Paying attention to popular culture and the trend that is becoming popular is very useful for you to design banner advertisements. Campbell is like this. It makes good use of the IP of Star Wars movies, launches products of related subjects, and attracts fans of Star Wars to buy products. It is absolutely twice the result with half the effort to publicize the corresponding products with the help of popular trends and topics.

11, using texture

Campbell's advertisement is a model of using texture to improve texture. The jagged edges of the brush make the visual effect of the whole advertisement more subtle, and the other elements in the advertisement picture are far from outstanding, but the addition of texture is like the finishing touch, which makes the overall effect improved.

11. With the help of niche

A niche is a market subdivided by the advantages of the enterprise. Advertisements usually need to be targeted at the target population, so as to achieve the best results.

If the advertisers of p>Target's infant products are aimed at mothers, what could attract them more easily than a pink and lovely scene?

12. The vitamin advertisement banner of p>Zarbee shows with pictures instead of words

The skill of using pictures is quite outstanding. Fruits replace vitamins and strengthen concepts instead of describing them with words, which is ingenious and intuitive.

13, clear focus

When the advertisement has a clear focus, the communication between the brand and the user is more direct. This Banner advertising map is also designed for Target. The brand LOGO is conspicuous from the position to the color, and with the structural guidance of the beautiful woman's posture, the brand LOGO of Target is undoubtedly the focus of the whole advertising map.

14. Use images as a guide

This advertisement of McDonald's is a typical example of using images instead of words to convey information. The word coffee is replaced by corresponding pictures, which not only conveys information, but also makes the whole advertisement picture not monotonous, but also becomes a mixed arrangement of pictures and texts. Simple words and pictures can convey information, but mixed use is more interesting and distracting.

15. Make the product sound

In this advertising picture, McFlurry of McDonald's is undoubtedly the core, both in sense and visually. The gray background makes the colorful MacFlurry subject stand out. Let the product itself stand out in the advertisement, which can make the whole Banner more expressive and targeted.

16. Creating Angle

This advertisement of Audi presents different information by dividing the space, but the most striking thing is the unique visual experience brought by the slightly twisted angle. This adjustment makes the specific information more eye-catching, and with the angle of the car body itself in the picture, the whole advertising picture is more dynamic.

17. Use masking

Using a translucent layer with a specific color to mask the background image can make the text content information in the foreground stand out. This design technique is not uncommon now. It allows the background information to emerge from the cover, and at the same time makes the text content more readable and the overall layering enhanced.

18. Set the scene

Tiffany &; The design of the advertising chart of Co jewelry can be called fun. The rotating cocktail glass and beautiful jewelry combination suggest that they often appear in the same scene at the same time, creating an elegant and exquisite feeling. Through the combination of related items, users are prompted to make up the scene by their own brains.

19. Creative fonts

Good typography can attract users' attention, and this advertisement of Nike is particularly outstanding. Its font design is creative, and these dismembered fonts also have strong recognition, but this design makes them look lighter and more scientific. This visual enhancement makes advertisements and products more attractive.

21. Use stylized illustrations

Illustrations can be simple or full of details. Stylized illustrations can increase the thickness of information, tell stories and convey feelings through details and styles. This illustration is full of power and energy, which is quite in line with Nike's brand temperament.

21. Using multiple elements

Although there are risks, reasonably matching a variety of different elements in an advertisement diagram can produce a good sense of form, just like this advertisement diagram on ebay. Beautiful product drawings, standard fonts, handwritten fonts and illustration elements are harmoniously combined into an advertising drawing. Of course, every element exists for a reason, and it does its job, not randomly. Please remember this.

22. Become a popular weather vane

Incorporate trends and trends into Banner design, and make it a link between advertisements and users. This advertisement from ebay does just that. After replacing "HotlineBling" with "HauteLineBling", this popular culture is better interpreted, thus attracting more users who pay attention to this fashion.

23. Free stretching

Not every advertising Banner has to rely on the grid, so that every element can be aligned accurately, and the free stretching design is equally effective. Yoplait's advertisement is designed in this way, which makes it more interesting and childlike. Of course, whether such a design is suitable depends on the temperament and characteristics of its products.

24. Create connections

In the design process, it is very important to keep enough connections between the pictures and words in your advertisement. The temperament of pictures and words in Talbots' advertising pictures is very close.

25. Making contrast

Contrast is an effective means to attract users' attention, and the design of this advertising Banner of ESPN is well versed in this skill. On the crimson background, the white characters stand out. Fonts are also sharp and light types, so that the effectiveness of information transmission is higher.

26. Symmetric design

Symmetric design can well balance the elements in advertisements. Designers may have gone through in-depth thinking to design this design, but the output is very rapid. This advertisement from Apple is not complicated. The black and white photos of musicians are basically symmetrical around AppleMusic, while maintaining a certain beauty. This simple design is simple but clear-cut.

27. Life Guide for Target Users

Just like the advertisement Chegg, if you want to attract a specific user group, you might as well stand in their position and inject lifestyle guides for them into the advertisement. Representing and displaying products from the standpoint of specific users can make it easier to get * * * clicks and thus get more clicks.

28. Use dynamic effects

In a static page, it is undoubtedly the dynamic elements that attract people's attention most easily. If you use dynamic effects to present the advertising content you want to express, you can make your content get to users faster. Of course, the premise is that the design should be concise enough, so as to avoid trivial content and make it easier for users to Get it.

29. Sharp and vivid

The advertisement of Gillette shaver can be regarded as a model of sharp and vivid vision. The sharp angle, sharp razor picture on dark background, angular font and strong contrast color scheme all make this advertisement clear and eye-catching visually, which makes people want to stop.

31. Creating a visual depth

This advertisement design of p>Honda is not complicated, and it is characterized by yellow line strokes on the background. The car that seemed to be suspended in the air seemed to fall on the ground against the line. You don't need too complicated design, you can create visual depth for the advertising map and leave an impression.

31. Use a unique font

Using personalized fonts in the advertisement Banner can also effectively attract users' attention. The font used in Pepsi's advertisement is full of individuality, but also clear and readable, giving people a playful and interesting feeling without affecting the transmission of information.

32. Use a variety of beautiful typesetting

For beautiful text typesetting, most users still like this set. This advertisement of CaliforniaPizzaKitchen was carefully designed by McGrathCreative for them. Not only was the typesetting design exquisite, but it was also creatively combined with pizza itself.

33. Use simple pictures

Simple and intuitive pictures are very practical on the website. They usually show the content more efficiently, and make the message of advertising Banner more intuitive. At present, designers usually use simple illustrations with flat style to set off the main body and increase the amount of information, just like this advertisement of Coda.

34. Use textures to increase the visual depth

The advertising pictures of Adidas are very interesting visually. The textures in the background are not complicated, but the regular and scientific lines not only increase the visual depth, but also create a sense of speed that fits the brand temperament.

35. Use brand color

If PayPal's iconic blue color is not used in the advertisement banner, only the picture in the picture will not leave a deep impression on you, but it is the use of brand color that binds the picture and the brand together, promotes each other and makes you remember.

36. Don't just think about sales promotion

Advertising Banner is used for sales promotion, which is no problem, but sometimes it doesn't need to be so obvious. This advertisement from FreePeople encourages users not to just buy from buy buy, but to see more, shop more and compare more. Although this can also promote sales, it looks more like giving advice from the user's point of view.

37. Using bold colors

i, the color scheme of Anna's advertising pictures can be called bold and full, red is full of vitality and eye-catching, and the addition of yellow makes the whole color scheme more harmonious and easier to attract users' attention.

38. Have a simple illustration

Sometimes, exquisite illustrations don't necessarily conform to your brand or what you want to express. This advertisement of Starbucks was born in this situation. The exquisite and exquisite pictures don't meet their needs, but the flat and slightly childish illustrations are more simple and in place. It shows the composition of the new drinks, and this advertising picture makes you feel like you are looking at the menu in Starbucks.

39. Introducing dynamic effect

This advertising picture from Starbucks shows a very attractive dynamic element in a small area. The ripple starts from the center and diverges outward. When users see this advertisement, they will be involuntarily attracted by it.

41, fully move

If you are skilled enough in the use of dynamic effects, you might as well make all the elements in the advertising Banner move, which makes it easier to stand out. set