BannerMaker is usually 950x 120 in size. The format is jpg and gif.

If you can't find it, you can do it yourself. The font is square, thick, brown and black.

Civet e-commerce ~ ~ ~

What did BANNER material mean when you first saw this word? I don't know what this means. What's the difference with other pictures? Banners in web pages are usually advertisements, also known as "banner advertisements". In fact, banner advertising (the main form of online advertising) generally uses image files in GIF format, which can use static graphics or splice multiple frames of images into animated images.

How to design banner advertisements? Banner advertisements are everywhere. From the content recommendation at the top of the homepage of the website to the sidebar, from articles to the list of galleries, you will find that almost all the content exists in their shadows. Usually, they look beautiful and a little grandiose, which will erode your web browsing experience. Although we are trying our best to reduce their negative impact on users, bad reputation is always tied with them.

In fact, banner advertising has a great influence on users, and reasonable application 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?

Fuzzy theory may not be grounded enough. Let's learn banner advertising design skills from the following 50 cases.

1, stylized graphic typesetting

This is a group of banner advertisements made by DearMissModern, and each picture maintains the consistency of temperament and style in both text and picture material. The sense of form of fonts and the collocation of images and graphics in the picture material make the whole advertising 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 same is true.

2. Create a hierarchy

Visa's holiday advertising banners make 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 up the visual blur, ensures readability, and adds another layer to convey information to ensure that it will not be chaotic. The position of the button is just above the food and below the text, and the attractive click position is just right.

3. Use related icons

Google's advertising banner brings personal experience through hand-drawn icons.

Every hand-drawn icon in the picture is very easy to identify. Although it is not complicated, it gives people a feeling of crossing the world. This unspeakable but touching feeling makes this advertisement no longer just an advertisement.

4. Add unexpected elements

What should I do with job advertisements? Google's job advertisement is also unexpected. There are no tall instructions and beautiful girls, but graffiti-style 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.

Step 5 add illustrations

This case is also Google's advertising map. The addition of illustrations makes the whole advertising picture full of childlike innocence and interest, and with flat elements, it looks more unified as a whole. This diagram is not difficult to realize. It may look a little rough, but it's really friendly. Illustrations are different from photographic pictures. It can endow designers with incomparable temperament. Of course, you have to use it well.

6. Layout adjustment

This advertising picture of FatCow was designed by EnvatoStudio. In order to adapt to different advertising spaces, the whole advertisement has been made in several versions of 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, deleted or added before it can be realized.

7. Use colorful colors

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

8. Keep it simple

If Coca-Cola has any outstanding place, keeping the design simple is definitely one of the many advantages worth learning. Coca-Cola's advertising banner design well continues this tradition: the iconic color matching of LOGO slogan in product drawings. Although the content is not much, the effect is great.

A banner advertisement full of all 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

It is very useful for you to design banner advertisements by paying attention to popular culture and the trends that are becoming popular. Campbell is like this. Make good use of the IP of Star Wars movies, launch products with related themes, and attract fans of Star Wars to buy products. It is absolutely twice the result with half the effort to promote the corresponding products with the help of fashion trends and topics.

10, using texture

Jinbaotang's advertisement is a model of improving texture with texture. The serrated edge of the brush makes the visual effect of the whole advertisement more subtle, and other elements in the advertisement screen are far from outstanding, but the addition of texture is like the finishing touch, which improves the overall effect.

1 1, with the help of the minority

Niche refers to the market subdivided by the advantages of enterprises. Advertising usually needs to be targeted at the target group, so as to achieve the best effect.

If the advertisers of Target baby products are aimed at mothers, what could attract them more than a lovely pink picture?

12, show with pictures, not words.

Zarbee's vitamin advertising banner is quite outstanding in the use of pictures. Instead of vitamins, fruits strengthen concepts, rather than describing them in words, which is ingenious and intuitive.

13, clear focus

When advertising has a clear focus, the communication between brands and users will be more direct. This banner advertising picture is also designed for Target. Brand LOGO is conspicuous from location to color, and with the structural guidance of beauty posture, Target's brand LOGO is undoubtedly the focus of the entire advertising layout.

14, using images as a guide

This advertisement of McDonald's typically uses images instead of words to convey information, and uses corresponding pictures instead of the word coffee. While conveying information, it also makes the whole advertising picture no longer monotonous and become illustrated. Simple words and pictures can convey information, but mixed use is more interesting and distracting.

15, make the product sound.

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

16, creating an angle

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

17, using the lid

Covering the background image with a translucent layer of a specific color can make the text content information in the foreground more prominent. This design technique is not uncommon now. It makes the background information emerge from the cover, at the same time, it makes the text more readable and enhances the overall layering.

18, scene setting

Tiffany. The advertising graphic design of Co jewelry can be called fun. Rotating cocktail glasses and beautiful jewelry combinations 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 use their brains to make up the scenery.

19, creative font

Good typesetting can attract users' attention, especially this advertisement of Nike. Its font design is very creative, and these dismembered fonts are also highly recognizable, but this design makes them look lighter and more scientific. This visual enhancement makes advertisements and products more attractive.

20. 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 strength and energy, which is quite in line with Nike's brand temperament.

2 1, using multiple elements.

Although there are risks, a reasonable combination of different elements in an advertising map can produce a good sense of form, just like this ebay advertising map. Exquisite product drawings, standard fonts, handwritten fonts and illustration elements are harmoniously combined into an advertising picture. Of course, every element exists for a reason. It does its job, not randomly. Please remember this.

22. Become a popular weather vane

Incorporate trends and trends into Banner's design, and make it a link between advertisements and users. That's what this advertisement on eBay does. After replacing "HotlineBling" with "HauteLineBling", this popular culture has been better interpreted, thus attracting more users who pay attention to this fashion.

23. Free stretching

Not every advertising banner needs a grid to align every element accurately, and the design of free stretching is equally effective. Yoplait's advertisement is designed in this way, which is more interesting and childlike. Of course, whether such a design is appropriate depends on the temperament and characteristics of its products.

24. Create a contact person

In the process of design, it is very important to keep the pictures and words in your advertisement sufficiently relevant. Talbot's advertising pictures, pictures and words are very similar in temperament.

25, manufacturing comparison

Contrast is an effective means to attract users' attention, and the design of this advertising banner of ESPN knows this well. White characters stand out against a crimson background. Font is also a sharp and light type, so the information transmission is more effective.

26, symmetrical design

Symmetrical design can well balance the elements in advertisements. The designer may have gone through deep thinking to get this design, but the output is very fast. This advertisement of Apple is not complicated. The black and white photos of musicians are basically symmetrical around AppleMusic, while maintaining a certain aesthetic feeling. This simple design is simple but clear.

27. Life Guide for Target Users

Just like advertising Chegg, if you want to attract a specific group of users, you might as well stand in their position and inject lifestyle guidelines into the advertisements. It is easier to get * * * clicks by representing and displaying products from the standpoint of specific users, thus getting 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 reach users faster. Of course, the premise is that the design should be concise enough to avoid trivial content and make it easier for users to get it.

29, sharp and distinct

The advertisement of Gillette razor can be regarded as a sharp and vivid model visually. Sharp angles, sharp razor pictures on a dark background, angular fonts and contrasting color schemes all make this advertisement visually clear and eye-catching, which makes people want to stop.

30. Create visual depth

Honda's advertising graphic design is not complicated, it is characterized by yellow line strokes on the background. The car that seemed to be suspended in the air seemed to fall to the ground against the line. Without complicated design, it can create visual depth and leave an impression on the advertising map.

3 1, using a unique font

Using personalized fonts in banner images of advertisements can also effectively attract users' attention. The fonts used in Pepsi's advertisements are full of individuality, clear and easy to read, giving people a playful and interesting feeling without affecting the transmission of information.

32. Use all kinds of beautiful typography.

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

33. Use simple pictures

Simple and intuitive pictures are very practical on the website. They usually display content more effectively and make the information of advertising banners 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 visual depth.

The advertising picture of Adidas is very interesting visually, and the texture of the background is 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 colors

If PayPal's iconic blue color is not used in banner advertisements, only the pictures in the pictures will not leave a deep impression on you, but it is the use of brand colors that bind the pictures and brands together, promote each other and make you remember deeply.

36. Don't just think about promotion.

Advertising banners are used for promotion, no problem, but sometimes they don't need to be so obvious. This advertisement of 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. Use eye-catching colors

The color matching of my and Anna's advertising pictures is bold and full, red is full of vitality and eye-catching, and the addition of yellow makes the whole color matching more coordinated and easier to attract users' attention.

38. Give a simple example.

Sometimes, beautiful illustrations don't necessarily conform to your brand or what you want to express. This advertisement of Starbucks was born in this situation. Exquisite and exquisite pictures do not meet their needs, while flat and slightly childish illustrations are more concise and in place. It shows the ingredients of the new drink, and this advertising picture makes you feel like watching the Starbucks menu.

39, the introduction of dynamic effect

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

40, move with all your might.

If you are skilled enough in the use of dynamic effects, you might as well make the elements in the whole advertising banner move, which makes it easier to stand out. With the help of dynamic effects, the designer fully demonstrated the application process in the tablet. In just a few seconds, you can get more information than the static banner picture, and the experience is excellent.

4 1, using geometric texture

This advertisement of Corona applies the popular oligomeric elements to the image of orange. This geometric texture makes oranges feel cool and transparent, which makes you interested in beer in Corona.

42. Divide the space with interesting graphics.

Brightgreen's advertising screen is divided into two different spaces by diamonds, which makes the advertising screen become two natural levels. The blank part carries text information and the green part carries pictures, which makes the whole picture clear and rich in texture.

43. Add shadows

Long shadow is a popular design trend for a long time before, and this advertisement created by Webduckdesign is a very good use case. If there were no shadows, the whole picture would look rather monotonous. The addition of the long shadow makes it look less flat and layered.

44. take the pattern as the texture.

Different from exquisite patterns, superimposing specific patterns on the background as textures can create a specific atmosphere. This advertisement, designed by Annesophiehorst, uses the patterns and textures of ice cream and pineapple to create a summer feeling.

45, using color block segmentation

If you don't want to use only the picture in your hand as the background in the advertising picture, you might as well divide it into different parts and use it with monochrome color blocks to make the whole advertising picture have a stronger sense of form.

Step 46 decorate with lines

Advertising pictures are mostly composed of pictures and words, but adding some decorations properly will make the advertising pictures look fuller. Compared with all kinds of highlights, lines are not weak in decoration, but also more free, and the effect is quite good.

47. Tell stories

The ultimate goal of advertising is to sell products, and the most effective way is to tell the experience of real users. This advertisement is designed for Amazon's e-book APPAudible. The scene in the picture aims to promote that their products can be used undisturbed in many scenarios.

48. Be humorous

Humorous display is usually more effective than strong sales promotion, and they prefer to see funny content.

49. Use simple font matching.

You don't need complicated typesetting design, but with several fonts with the same style and easy recognition, such as this advertisement of Pizza Hut, you can also achieve the effect of increasing information and pleasing to the eye.

50. Use simple graphics to emphasize.