Images account for more than 60% of downloaded content on a web page. Optimizing the images on your website can yield significant performance improvements, but it’s a complicated process.

Image Optimization is both an art and science

Image optimization diagram

Dynamically select the most efficient format

Image formats can have a significant impact on load times. But, manually determining the optimal format and encoder settings for each image’s content can be complex and inefficient.

Loading time for different image formats

Cloudinary dynamically determines and delivers every image in the most efficient format, based on image content and viewing browser.

It can automatically deliver images as WebP to Chrome or JPEG-XR to Internet Explorer. In some cases, PNG may be selected when it better fits the specific image, such as preserving transparency.

Automatically adjust the compression quality

Precise adjustment of compression quality and encoding settings can significantly reduce file sizes without noticeable quality degradation. Finding the right settings for each image, however, is more complicated than it sounds.

File size reduction for different file formats and iamge qualities

Cloudinary automates the file size versus quality trade-off decision.

Encoding algorithms analyze every image to automatically find the optimal balance, and produce a perceptually fine image while minimizing the file size.

The quality compression can also be controlled by using simple transformation parameters: best, good, eco, or low.

Automatically scale and crop images to fit any page layout

Delivering images at dimensions larger than the required display size uses unnecessary bandwidth and slows down the page load. But, manually pre-creating multiple versions of every image to fit various screen resolutions can be resource intensive.

Resizing and cropping images

Dynamically scale image resolution on the fly to serve the optimal version that matches each user’s device resolution and viewport dimensions, without delivering unnecessary pixels.

Images often require cropping to fit responsive layouts and diverse device dimensions.

Cloudinary automatically detects the regions of interest and can dynamically crop images, without losing focus on important content.

Deliver images via a global content delivery network

Content delivery network

Efficiently deliver resources to visitors all around the world through leading CDNs - Akamai and Fastly - with caching across thousands of global delivery servers.