Advertising with banners of a website is one of the important elements when you want to generate income. If you don't know how to use them, it's best to find some inspiration with assorted banner examples to fit your personal website.
Table of Contents
Advertising spaces or banners are creative tools that display digital advertising. This advertising is usually made up of images and text, and in some cases sounds or some element with which the user can interact is included.
What is the importance of a banner?
Before investing in advertising, it is crucial to understand the purpose and function of a banner, as well as its contribution to your web page. A banner is a highly effective piece of advertising designed to capture the user's attention and direct it towards a specific action. Your composition can include images, videos, text, and even interactive elements, and your goal is to convey a clear and persuasive message.
These advertising elements are widely used in almost all web pages that seek to monetize their content, especially if they have significant traffic that allows the banner to have greater reach and visibility.
The versatility of banners allows web designers to use them organically, and they fall into three main types: fixed, expandable, and floating. Below are examples of banners of different types.
banner types
rectangle banner:
- Format: Rectangular, generally horizontal aspect.
- Location: It is placed in different areas of the web page, such as the top, bottom or in the middle of the content.
- Size: It has various measurements in pixels, depending on the needs of the design and the space available on the page.
- Function: Its objective is to attract the user's attention and direct it towards a specific action, such as clicking on a link or making a purchase.
Leaderboard:
- Format: Long Horizontal, similar to the rectangular banner but with a wider proportion.
- Location: It is commonly placed at the top of the web page, above the main content.
- Size: Usually has large dimensions, such as 700 x 90 pixels.
- Function: It is ideal for displaying prominent messages or important promotions due to its size and privileged position.
Page stealer:
- Format: It can be vertical or horizontal, and its design is integrated between the texts of the content.
- Location: It is usually placed at the beginning or in the middle of an article or blog post.
- Size: It can have different measurements, commonly being 300 x 600 pixels or 300 x 250 pixels.
- Function: Its objective is to grab the reader's attention while browsing the content and direct them towards a relevant action.
Skyscraper or skyscraper:
- Format: Vertical format, elongated and narrow.
- Location: It is placed on the sides of the web page, offering a prominent presence.
- Size: It usually has measurements such as 120 x 600 pixels or 160 x 600 pixels.
- Function: Being highly visible, it is effective to attract the attention of the user and direct it towards a specific action.
Interstitial:
- Format: Full screen displayed between transitions from one page to another.
- Location: Appears among the content as the user navigates from one page to another.
- Size: It occupies the entire screen, providing a high visual impact.
- Function: Being intrusive, its objective is to capture the user's attention in a prominent way and display a relevant message before accessing the desired content.
Reminders:
- Format: It can have different formats, such as floating or pop-up banners.
- Location: It is displayed during navigation, usually in an unobtrusive way.
- Function: Its objective is to remind the user of a relevant offer, promotion or action, seeking to return their attention to the message.
Layers:
- Format: It is a banner with animated or video elements superimposed on the web page.
- Location: It is displayed above the content of the page, but can be closed by the user.
- Function: Seeks to capture the user's attention in an attractive way and communicate a persuasive message.
Skin:
- Format: It involves changing the design and background colors of the entire web page to integrate advertising elements.
- Location: It adapts to the background of the web page and can be present in all content areas.
- Function: Provides a more immersive and personalized advertising experience for the user.
Rich media:
- Format: Involves multimedia elements such as videos, animations or interactive interactions.
- Location: It can be adapted to different areas of the web page.
- Function: Its objective is to generate greater user interaction and engagement due to its dynamic and attractive content.
Pop-up Banner:
- Format: Appears in an additional popup window above the main content.
- Location: Overlays the content of the web page, requiring user interaction to close it.
- Function: Highly visible and intended to quickly grab the user's attention, but should be used sparingly to avoid being intrusive.
Advertisement:
- Format: It is a type of banner that simulates the editorial content of the web page, integrating itself in a subtle way.
- Location: Displayed between articles or editorial content.
- Function: Its objective is to provide valuable and persuasive information to the user, promoting a product or service in a more natural and non-intrusive way.
Each type of banner has its own advantages and challenges, and the choice will depend on your marketing goals and the type of experience you want to provide your users. Always remember to measure the performance of your banners and optimize them according to the results obtained.
What elements should a banner have?
- Attractive design: Use bold colors and striking visual elements to capture the viewer's attention from the first moment.
- Clear message: Be direct and concise in your message. Communicate the value proposition clearly and convincingly, highlighting the benefits for the user.
- Call to action (CTA): Include a prominent CTA that invites the user to take action, such as "Buy now", "Sign up", "Download", among others.
- Mobile Optimization: Make sure your banner looks good and is functional on both desktop and mobile, as more and more users are browsing from their phones.
- Interactive elements: If possible, incorporate interactive elements that involve the user and generate a more immersive experience.
- Respect the context: Adapt the design and message of the banner to the context in which it will be displayed, be it a web page, an app or a social media platform.
- Measure results: Track the performance of your banners to assess their effectiveness and make adjustments as necessary.
Examples of creative banners
Understanding what a banner is is not enough to be able to use them, because in practice their use is more complex than it seems. Web design with these elements can come from the inspiration of other banners that have obtained good results. Therefore, these are some examples of banners that have worked well.
Brastemp
In the first of the banner examples we have the case of Brastemp. The Brastemp company designed a web page banner that creates an environmental awareness message. This banner consists of an open purified water dispenser and the falling stream of water.
When you touch the water with the mouse, it changes with a message that the water is no longer 100% pure. It is an example of an interactive banner that draws the attention of users.
Fedex
Creating a banner for a website can be complicated, but Fedex it does it with simplicity. This courier company created a rectangular fixed banner that shows the time in a dynamic way, it uses Fedex boxes to display each number.
The seconds, minutes and hours change according to the time that the ad is being viewed. This is one of the examples of creative banners for web pages that leave us speechless.
Nissan
Nissan's ad is clear, short and to the point. It consists of two parallel images of an unfastened seat belt and the bruised face of a young woman.
When fastening the belt, the Nissan logo is displayed and the woman's face is healthy, with a message that the seat belt gives a 70% chance of surviving a car accident. This is one of the banner examples that teach us that a banner can be clear, direct and to the point.
Volkswagen
Another globally known car brand like Volkswagen knows how to use ads. A clear example is his banner The New Golf, where he creates a maze in which a Golf car has to complete the route with the help of the user.
The objective is not only to promote the new model, but also to attract the attention of users with a didactic game of solving the maze by connecting the paths.
McDonalds
This is the last of the banner examples and McDonalds could not be missing from this list. Under the slogan of always making the best of this food chain, a web banner was created that shows one of its hamburgers and a button that says “Make it better”.
Clicking changes the background to a more prominent one, but the hamburger remains. Her message was clear and concise. Their burgers are always the best.
