In my last article, I wrote about how you can save a lot of “weight” (in kilobytes) by using “hosted libraries”. Indeed, there are other ways to save a few kilobytes, and I always say: it might save lives! I keep hearing from my clients something like “can we do that with only 150 KBs?” – because that’s the magic limit for standard banners on most ad servers, like Doubleclick, Sizmek or Adform. Everything that exceeds this weight costs more, but is usually not planned in the budget of the media agencies. The magic word is “compression”!
Usually, it might be no problem not to compress images you are using on your ads, but as soon as you start having a bigger amount of assets (example, car diving into the ad on my last article or if you need your buffer for other stuff, like to embed your own fonts), then it might be a hard bite to keep the banner within the weight boundaries!
With Photoshop there is the possibility to save PNGs and JPGs with the setting “Save for Web”, one can adjust the compression level of JPGs. This is not the case with PNGs though and the PNGs saved from Photoshop will be “losless”, which means the image isn’t compressed and has a high file weight.
The sweet panda from TinyPNG https://tinypng.com gives you the chance to drag’n’drop the uncompressed JPGs and PNGs to upload them – which are then optimized on their server and can be downloaded directly as a single file or ZIP package or even stored directly to your Dropbox. Note the limit of 20 images per batch. Of course, you can start several batches after the other if you have a higher amount images (just as if you have to compress a whole bunch of ads).
Results of the compresson:
Overview of the saved kilobytes + dropbox/download buttons – ©TinyPNG
Also helpful in case you have a whole bunch of images to kompress is the Photoshop plug-in: https://tinypng.com/photoshop, which is available for 50 Dollars. In my opinion a very good investment for people like me, who constantly have to compress tons of images to reduce the weight of the banner.
PNG comparison:
Left uncompressed image with 82 KBs, right compressed image with 33 KBs. In my opinion, there is hardly a difference to be seen – ©Pixabay
With the plugin you can use the excellent compression directly from Photoshop when saving the assets – but even better is the possibility to use the “batch compression”, if you have to optimize several files. To do this, select a local folder on the computer and apply the optimization in all PNGs and JPGs in it, also in all subfolders! So you can produce the entire project including format adaptations “as usual” and let the compression run over the entire folder when you are ready. I still recommend to have a backup copy of the uncompressed images, just in case!
So as you can see, you can meet the agency’s demand for a small amount of data by reducing the size of the images with a tool like TinyPNG.
I hope to have helped with these words, if you have any questions and suggestions on this topic, please write them down in the comments! : -)