Optimizing image file assets

This article will provide an overview of Image Asset Optimization.  Check out this article for more information regarding video asset optimization.

 

Images account for most of the downloaded bytes on a web page, and also often occupy a significant amount of visual real estate. For digital publishers, optimizing images used in online advertisements can have a huge impact on visibility and viewability.

When creating your digital ad, it's important to make sure you are utilizing assets optimized for the web. The Adventive platform supports JPG, PNG, SVG, and GIF image formats. The image formats you choose to use in your ad build will depend on the specifications of the ad you are creating.

 

Sizing & Best Practices

Adventive will automatically compress image assets in our platform. As a result, we recommend that you upload high-resolution images, up to 10MB. For best results, use image files at 72 DPI. You should also avoid using TIFF files, as they are too large and will load creatives very slowly.

Transparent images can significantly increase your file size. This is common with PNGs. While sometimes unavoidable, try to only use transparent PNGs for assets like buttons, logos, and/or animated elements.

If your ad does not require a specific or branded typeface, using Adventive’s type tool will add custom text and help reduce your overall file size.

JPG images will compress better than any other image format. We recommend this image format to be used for any large images in your project, such as background images. For static ad units, we always recommend uploading a flattened JPG rather than individual layer assets. If working with your clients to receive assets, this should be on your list.

 

Asset Guidelines

Format Use Case Best Practices
.png Best used for product shots, design elements and transparent backgrounds Upload a high resolution file, up to 10MB.
.jpg Best for full-color backgrounds, flattened images and custom typography Upload a high resolution file, up to 10MB.
.gif Animated assets best for quick, short, or looping sequences Use the smallest image size without sacrificing quality
.svg Best for logos, text, iconography and CTA buttons Upload a high resolution file, up to 10MB.

 

More Ways to Optimize:

Some additional tips and techniques to keep in mind as you work on optimizing your images:

  • Choose vector formats when possible: vector images are resolution and scale independent, which makes them a perfect fit for the multi-device and high-resolution world.
  • Experiment with optimal quality settings for raster formats: don't be afraid to dial down the "quality" settings, the results are often very good and byte savings are significant.
  • Serve scaled images: resize images and ensure that the "display" size is as close as possible to the "natural" size of the image. Pay close attention to large images in particular, as they account for the largest overhead when resized!
  • There are plenty of free online resources you can use to compress large image files. Try https://tinypng.com/ to optimize your .JPGs and .PNGs.