Online advertising has grown exponentially over the past five years. Growth is expected to continue in the coming years. Designing attractive web advertisements is a challenge. However, with some background knowledge, placement in appropriate venues and considerations about the target demographic, attractive web ads will drive traffic to a site and convert visitors to customers.
Design an Attractive Web Advertisement: Process, Tips and Overview
Online Ads Differ from Print Ads
Online advertising differs in several ways from print ads. First, online ads may implement multimedia components into the ad’s content. Second, a print ad must provide a call to action for the recipient to contact the company by phone or navigate to a website. Online ads provide point-and-click accessibility for users. An online ad is linked directly to the brand’s website, ecommerce catalog or to the product purchase page. A call to action for an online ad may simply be a statement to click an icon or link to be directed to the desired page.
Because of the inherent differences between print and online ads, the ad that will appear online must employ different design strategies. For example, quality and type of paper is a consideration when designing a print ad. However, online ads are delivered via a digital platform. Online ads will be presented tot he user on a web page.
Therefore, online appearance is of primary concern. Because the online ad is delivered digitally, paper quality is not a consideration. However, additional considerations become prevalent with online ads, such as responsiveness of the ad.
What is a Responsive Online Ad?
Responsive online ads are advertisements that are displayed according to the specifications of the rendering device. This means that the online ad must be displayed one way on a 15 inch monitor screen, and other way on a smartphone screen. In essence, the ad “responds” to the specifications of the display device. Responsive design has become important with the increase of use of mobile devices. In order for advertising to reach all possible viewers, online ads must be responsive to the device on which they are displayed.
Responsive ads are best utilized on responsive websites. A responsive website is one that is designed to respond to the browser on which it is rendered. Responsive websites are coded in such a way that the site displays, albeit sometimes formatted differently, on a variety of devices.
For example, a responsive website may display a homepage with a right sidebar when viewed on a standard monitor. When viewed on a smartphone, the same site may display the right sidebar as a section that continues under the main body of the page.
Not all websites are designed to be responsive. However, if your ad will appear on a responsive website, you should provide a responsive ad that will display on any device. Determining the need for a responsive ad will be determined, in part, by the target demographic.
Responsive Ads: The Future of Online Ads
The future of display ads lies in ads that respond to the rendering browser, or responsive ads. Responsive web design is made possible, in large part, due to the adoption of HTML5. For ads to be responsive, the ads too must be written in HTML5.
Responsive ad widths are flexible and adjust to the size of the rendering browser. Variable widths are utilized to make a banner ad responsive, just as with responsive web pages. Multiple heights may be defined for the ad, as well. For testing, standardization and backward compatibility purposes, height would be defined as fixed. However, ad height may also be variable by altering the iFrame size of the ad with CSS media queries.
HTML5 ads have many advantages over standard fixed-design ads. First, HTML5 ads may be edited after deployment, just like a web page. Javascript elements may be utilized within an HTML5 ad, just as with any web page. Responsive ads create using HTML5 may be tracked with tools such as Google Analytics, as with any other web page. Banner ads are hosted, just as with standard websites. The file sizes of HTML5 ads are very small and the same knowledge and skills are required for creating HTML5 as are required for creating web pages.
Responsive Ad Examples
Creative Partners
Responsive Banner Ads with HTML5 and CSS3
Understanding the Target Demographic
Determining factors such as whether the ad should be responsive is a function of determining the target demographic for the product. The target demographic is a function of the type of product that will be advertised in the online ad.
For example, if the product is an accessory for a smartphone, such as a protective case, the ad should render on a smartphone. In this case, the target demographic will be a subset of the population of smartphone users. If the protective case is for iPhones only, the target demographic will specifically consist of iPhone users. Ideally, the online ad for the product should render well in the iPhone browser. Moreover, the site on which the online ad is presented should also be responsive to the iPhone browser.
The point is that the target demographic is the audience for the online ad. The target demographic is determined largely by the type of product. The mode of delivery of the online ad is influenced by the product, as well as the target demographic and the mode of delivery. Consider first the type of product that will be advertised. What is the target demographic for the product? Next, consider the mode of delivery that will best reach the target demographic.
Using this formula, you will determine whether to create an online ad that will be responsive or one that is fairly generic. If you expect that the ad will be primarily accessed using a standard computer monitor, responsive design may not be of concern.
The Future of Online Advertising
Click-through rates of online ads is trending downward in recent years. Many marketers are concerned about the future of online advertising. A few phenomena have been noted that may be utilized when designing online marketing campaigns. Both Research Online, Buy Offline (ROBO) and localization of ads provide unique advertising opportunities when fully exploited.
- Research Online, Buy Offline
Designing online ads with the ROBO phenomenon in mind takes a different approach than the traditional PPC ad model. Designing an ad for this type of campaign might entail providing users with an ad they actually want to click on to discover additional information about a brand. Instead of promoting a specific product that the customer may purchase online, perhaps a white paper or a series of product reviews, along with a discount coupon that may be redeemed online or at a brick-and-mortar store, would pique the interest of users.During the interaction, your ad could prompt users to enter their email address and additional information to obtain the resource and discount. You build your potential client list and provide users with incentives to purchase the product locally. This model more closely resembles how users employ the Internet when making purchase decisions.
- Localization of Ads
The increasing ability to target ads to a local audience is particularly useful for those companies that depend on a local clientèle. Localizing ads even benefits online businesses because consumers will generally opt to spend their dollars within the community in which they reside. Google AdWords fully utilizes a location-based strategy for displaying ads to a particular geographically specific demographic.
Optimal Ad Formatting: Flash vs. HTML5
Video ads and animated ads tend to be more appealing to users. Flash and HTML5 are technical strategies for delivering animated and video ad content within an online ad. However, many online advertisers find that they need to implement both technologies to provide the majority of users with access to their ads. This is because some mobile devices support Flash and some do not.
On the other hand, many mobile browsers support HTML5, but some do not. Ideally, an animated or video ad will take a responsive approach and provide a version of the ad for browsers that support HTML5 and another version for those that support Flash.
HTML5 is generally supported by newer versions of major web browsers that are utilized on tablets and laptops. However, users that are viewing web pages with older versions will not have HTML5 compatibility. A Flash version of the ad would be a desirable alternative for those who are still using old web browser versions. Many industry experts believe that HTML5 will eventually replace the need for Flash. However, that time has not yet arrived.
Types of Online Ads
Types and formatting of online ads may range from extremely simple to very complex.
Text Ads
Text ads are simple links with a few lines of text provided along with the link. Text ads are often utilized with Google AdSense and AdWords accounts. However, text ads may also be utilized within popular blog posts, articles and other content. Designing a text ad mainly involves writing one or two lines of compelling copy to provide users with an incentive to click the link.
Display Ads
Display ads are generally graphic ads that display on a website within a designated area. Display ads may contain a graphic, a video or a Flash/HTML5 animation. Display ads may be identified by the size and shape of the ad. Types of display ads include:
- Banner Ads
These ads are wide ads that generally span the width, or a portion of the width, of the web page. - Skyscrapers
Skyscraper ads are those that are displayed vertically, generally in the left or right sidebar area of a web page. Skyscraper ads are taller than they are wide and cover more vertical, rather than horizontal space. - Box Ads
Most ads are rectangular or square box ads that appear at various locations within a web page. Box ads are created based on the size, or “real estate,” that is available on the page that will display the ad. - Pop-up and Pop-under Ads
Pop-up and pop-under ads appear either on top of or under the active browser window. These ads are often targeted by pop-up blockers and are generally not optimal in terms of user engagement. - Interstitial Ads
Interstitial ads are those that appear between requested web pages. The television channel, ABC, often utilizes interstitial ads between content segments for users who view programming online. This mode of deliver is often preferred when serving large graphics and video advertising.
Examples of Attractive Display Ads
Tailor Work
World of Warcraft
Lobster Anywhere
Audible.com Ads
Symantec Ad
How to Create an Online Ad
Step 1: Determine Available Real Estate and Number of Impressions
The first step in creating an online ad is determining the size of the space that the ad will fill. Most websites offer ad space based on sizing and number of impressions. When online ad space is purchased, the buyer will be charged according to the size of the ad first, and then possibly by the number of impressions, or user views, for the ad.
If the ad will be permanently displayed on a web page, the number of impressions is irrelevant. For example, if placing an ad on your own website, the ad will likely be a permanent or semi-permanent fixture. The ad will simply display to every user who accesses the page.
Step 2: Determine the Technology and Ad Content
Will the ad be a text ad, an animated presentation or a graphic that showcases a product? A text ad will take very little effort. Simply determining the text that will accompany a link to the desired destination site will suffice. Animated presentations will require a storyboard, of sorts. What is the information that should be conveyed to your potential customers?
Keep in mind that animated ads may have a large file size. The larger the file size, the slower the web page will load. You will need to determine an optimal balance between conveying the right message and the time it will take to load the web page into the user’s browser.
If creating a display ad, determine which type of graphic will be optimal for your purposes. JPGs are generally more crisp and clear. However, transparent backgrounds are not available with the JPG file format. GIF images are often less crisp, but a transparent background may be utilized. The JPG file format is the optimal format for photographs, whereas GIF is best for drawings and cartoons.
Step 3: Design the Ad
Finally, design the ad based on the available ad space and the desired technology. If the product warrants, users generally respond well to humorous ads. However, ads with an empathetic tone may be more appropriate for certain products.
Popularity of Display Ad Sizes
According to a recent study conducted by Marketing Sherpa, display ads that are 300 x 250 have the highest click-through rate of any other size of display ad. Coming in second place are banner ads measuring 728 x 90. Ads measuring 468 x 60 have the lowest click-through rates. According to the study data, the optimal size of 300 x 250 will generate more user response in terms of click-through rate.
Though the size of the display ad is important, maybe even more important is the placement and positioning of the ad on the web page.
Effectiveness of Ad Placement
Where the display ad is placed on the web page determines whether the user will notice and respond to the ad. According to research performed by Google AdSense, a “heat map” was developed to demonstrate the most effective placement areas on a web page for display ads.
The most effective placement of display ads on the web page is not in the top banner area, as one might think. The most effective area on the web page for ad placement is in the top center of the page body. The “hottest” area for ad placement is just above the primary content of the page, centered directly above the content.
Other effective areas for ad placement include the top half of the left sidebar area, the area within the page body to the immediate left of the primary content and the area just below the top navigation menu.
The heat map indicates that the least effective areas for ad placement are in the top right corner above the top navigation panel and in the lower area of the right sidebar. According to current research, the most effective display ad will measure 300 x 250 and will be centered within the body of the web page, located just above the primary content.
References
- Google: AdSense Help – Heat Map for Pages
- MarketingSherpa.com: Banner Ad Size and Click Rate – Bigger a Bit Better, But It’s Clicks That Count
- Reuters.com: The Future of Online Advertising by Felix Salmon
- WebAdvantage.com: Types of Online Ads
Conclusion
Perhaps the most important factor to remember when creating online advertising in today’s world is that the ad must provide value to the user. An ad will likely be overlooked unless the ad compels the user to act. Offering incentives, free items and discounts will often entice users to click on ads. Perform a mini-study by observing your own behavior and the behavior of friends and family.
Find out the qualities that an online ad must possess in order to get you and your friends to click on that ad. Integrate those qualities into your ad.
