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).