Media Optimizer overview (video tutorial)

Overview

Cloudinary's Media Optimizer is one of the fastest and easiest ways to optimize your site or app's images and videos at scale. Let's show you how to set up your first optimization project and to start delivering optimized assets.

Video tutorial


This video is brought to you by Cloudinary's video player - embed your own!

Tutorial contents

This tutorial presents the following topics. Click a timestamp to jump to that part of the video.

Supported media sources for Media Optimizer

Jump to this spot in the video  0:17 Our example uses Amazon S3 as the origin for our site's images. However, we support many other origins with the Media Optimizer, including Google Cloud Storage, Cloudinary's own storage, as well as any publicly available web address.

Serve optimized images and videos

Jump to this spot in the video  0:40 Delivering optimized assets should result in faster load times for the site, and a better user experience for visitors.

Access the configuration page

Jump to this spot in the video  1:41 Log in to your Cloudinary Media Optimizer account, and then go to the configuration section.

Create a media source

Jump to this spot in the video  1:55 Set up a new media source, giving it a memorable name and pointing to the S3 bucket.

Add a delivery profile

Jump to this spot in the video  2:38 Create a delivery profile for the optimized assets, which determines the new URL structure for the files and the optimizations used for them.

Format conversions and optimizations

Jump to this spot in the video  3:54 Media Optimizer automatically converts files to the most optimal format, based on the visitor's browser and device. Original files that are PNGs or JPEGs could be converted to different formats, such as WebP and AVIF, for all your visitors.

Optimized file quality and compression

Jump to this spot in the video  4:23 The automatic quality transformation applies the right level of compression, removing any extra kilobytes from the file to help it load faster, but also without any visible degradation to the original version.

Successfully deliver an optimized file

Jump to this spot in the video  4:56 Load one of the S3 bucket's images into the browser with the new URL from the Media Optimizer delivery profile and notice the incredible byte savings!

Update your site or app's URLs

Jump to this spot in the video  5:34 Replacing all of the URLs in your site is easy, since the file names from the S3 bucket remain the same. Changing the URL structure can be typically done quickly with most popular IDEs.

Keep learning

Related topics

If you like this, you might also like...

Transformation Basics
Learn the basics of a transformation URL
Optimization Tips
Tips for delivering optimized images
Named Transformations
Simplify & standardize complex delivery URLs

 

Cloudinary Academy

 

Check out Cloudinary Academy for free self-paced Cloudinary courses on a variety of developer or DAM topics, or register for formal instructor-led courses, either virtual or on-site.

 

✔️ Feedback sent!

Rate this page: