Optimize your images for the web

Use faster-loading image formats

When deciding on the file format for your images, consider their intended usage and your specific requirements. For example, if your priority is preserving intricate details at high resolutions, you’d use PNG images. However, JPG is the superior choice for regular images due to its smaller file size, leading to faster loading times. Once you’ve determined the most suitable format for your use case, you can use the format (fm) parameter to convert your image to a different format.

Example: Format conversion 

Let’s see how much bandwidth you can save by converting your image to the right format for your use case.

Compress images to WebP

Using the next-gen file format known as WebP comes with a lot of perks – images in this format are smaller without compromising the resulting image quality. You can take advantage of the auto parameter that automatically delivers the image in a WebP format to the browsers that support WebP. To make sure your websites and apps appear correct if WebP isn’t yet fully supported by the end users, such as with Safari browsers, it’s good to have a fallback strategy in place. For example, by combining the auto parameter with the fm parameter: fm=png&auto=format. This combination converts the image to PNG if the WebP format isn’t supported.

Lossy or lossless compression?

If a lossy compression with the quality (q) parameter degrades the image a bit too much for you, you can always opt for a lossless compression by converting your images to WebP format and adding the lossless parameter like so: fm=webp&lossless=1. Lossy compression is a better option when trying to reduce the file size, even if the quality parameter is set as high as q=90. You can see that the first request times might be longer for the converted images. However, every subsequent request is cached in the CDN and served immediately.

Beyond image optimization