Tag: GIF

New SWF compiler feature: better image optimization

 
We’ve added a new feature to our Ad Builder that compresses PNGs to smaller file sizes while at the same time maintaining transparency. This will give our customers a great deal more flexibility when using images in their display ads.

The post below gives a bit of detail on images compression and helps explain why this feature is so important.

The dark art of image compression

Image compression optimization might seem esoteric and unimportant, but in the world of online display ads, it’s a huge deal. Why? Because of all the different ingredients of a Flash (SWF) ad (images, text, fonts, Actionscript code, etc), images are by far the biggest contributor to file size.

And given that most Flash ads need to be 45K or less, it’s extremely important to minimize the size (in kilobytes) of all the different parts of an ad. An extra 1 or 2 KB can render an ad unacceptable, sending the designer back to the drawing board.

Why PNGs used to be the bane of our existence

Canned Banners has always been able to adjust the compression of JPEG images. However, many of our customers also use PNG images in their ads, especially for their logos. PNGs have a huge advantage over JPEGs, in that PNGs can have partially or fully transparent areas. This makes PNGs great for when a logo or a cutout photo needs to appear on top of different background colors, patterns, or photos.

The PNG image format comes with a significant cost, though: PNGs have large file sizes. See below. Even though the JPEG and the PNG look nearly identical, the PNG is double the file size (16K versus 32K):
 


JPEG, 70% quality: 16KB

24-bit PNG with transparency: 32KB

 
You might be thinking: “If the JPEG looks great and has such a small file size, why don’t you just use the JPEG?” Well, if we put these logos on top of a background image, you’ll see the downside of using JPEGs:
 


JPEG logo, no transparency.
Combined size of logo + photo: 28.4KB

24-bit PNG logo with transparency.
Combined size of logo + photo: 44.4KB

 
Above, the logo on the left (the JPEG) looks crappy because of the opaque white background, while the logo on the right (the PNG) looks much more professional because the area behind the logo is transparent, allowing the background photo to show through.

Have your transparency and eat it, too

As the above examples illustrate, there used to be an annoying trade-off that had to take place: if we wanted display ads to meet ad networks’ file size requirements (usually a measly 45K or less), we could probably get away with a small PNG logo, and that was it. This placed a great deal of limitation on the kinds of ad designs we could use.

Not any more! With our new PNG optimizer, we can reduce the file size of PNGs down to JPEG-like file sizes, all while maintaining the transparency. This means we can use multiple PNGs in a single design, or use larger PNGs (width x height).
 

Banner ad formats explained

What are the different types of banner ads?
These are the three basic types of banner ads:

  1. Flash Banner Ads
    These ads feature smooth animation and allow the user to interact with the ad by clicking, rolling over, and/or by typing on the keyboard. Flash banner ads are the type of ad you can make on Canned Banners. [click to view example]. Read more about Flash banner ads below.
  2. Animated GIF Ads
    These ads allow for primitive animation, but no user interaction except for clicking. This is different from a JPEG, which doesn’t allow animation. [click to view example]
  3. Static Banner Ads
    These have no animation. They are simply one still image, and almost always in JPEG or GIF format. [click to view example]

What is a Flash banner ad?
Flash* banner ads use a combination of animation and interactivity. The file format for Flash ads is a SWF — this is the file Canned Banners will send when you create your banners. Viewing Flash ads is possible by installing the Flash browser plug-in.

Because of the smooth animation and interactivity of Flash ads, they are usually more effective than other types of banner ads. They are better at attracting a user’s attention and retaining it for longer. The biggest downside to Flash was that, until Canned Banners, it took longer and was more expensive to design and develop Flash ads than it was to create less effective static or animated GIF ads. But with Canned Banners, if you’ve got a few minutes, you can build your own professional-quality Flash banner ad. Browse our banner gallery and start building your banner!

Do all websites support Flash ads?
No. Almost all major ad networks and websites support Flash, but some websites still only support GIF or JPEG ads. Check with your ad network or media company, or check directly with the website(s) you intend to advertise on.

Rich media ads
Rich media ads are a more sophisticated type of Flash ad. They can do things like expand over the content of a web page, play videos, and interact with external systems like Twitter or a database. Canned Banners does not currently allow you to make rich media ads, but we might in the future. Let us know what you’d like to see.

 Read about different banner ad sizes »

* Flash is a registered trademark of Adobe Systems Incorporated.