Skip to content

RESOURCES / BLOG

Experiment With Content Faster Using Dynamic URLs

Optimizing your content brings a wealth of benefits. For newer businesses that haven’t quite nailed down what their audience is looking for, A/B testing content can be a great way to gain foundational insights to fine-tune your branding, increase engagement, and, of course, make money. So what should you test? Visuals like hero images, banners, and product images can mean all the difference between a click away and a click to purchase. The challenge: creating variations of all your content, at scale, takes a lot of time and effort.

In this blog post, we’ll walk through how Cloudinary’s dynamic URLs can solve that problem. Instead of using multiple complex image and video editing tools, simply add parameters to the image URL to generate limitless variations of your high-quality original images on the fly.

Dynamic URLs are addresses that enable you to open or load media files while simultaneously editing or transforming them. To put that into context, the link below points to a public image from the Cloudinary Media Library:

https://res.cloudinary.com/djte4pdpm/image/upload/v1737400983/cld-sample-4.jpgCode language: JavaScript (javascript)

This is what the original image looks like:

A sample image

Now, here’s a link to that same image, but with several dynamic parameters added:

https://res.cloudinary.com/djte4pdpm/image/upload/400,h_200,c_fill,e_sepia/v1737400983/cld-sample-4.jpgCode language: JavaScript (javascript)

This is what the edited image looks like now:

An image transformed with Cloudinary Dynamic URLs

That’s it. No need for manual edits in Photoshop or other fancy editing tools.

Dynamic URLs are relatively easy to structure, but you’ll need to reference the Cloudinary Transformation documentation to see all the parameters you can use with them. Every dynamic URL follows a simple structure:

<code>https://res.cloudinary.com/(cloud_name)/image/upload/(transformation parameters)/image.jpg</code>Code language: HTML, XML (xml)

Here’s what each part of that URL does:

  • Cloud name. This tells the URL which cloud to look for in the file. Check out this guide to find your cloud name.
  • Image/upload. This is the location of uploaded image assets in the Cloudinary Media Library. For video content, replace this with video/upload.
  • Transformation parameters. Cloudinary enables you to transform media assets in many ways, from resizing to cropping, trimming, adding text, and more.
  • Image.jpg. This is a placeholder for the name and file type of the asset you want to experiment with.

The workflow for creating dynamic URLs and using them for content experimentation is straightforward. Start by considering how you want to edit the asset, write the URL pointing to the Cloudinary Media Library and the specific asset, add the transformation parameters, and check the results. Keep iterating and changing the parameters to create variations, and use tools like Optimizely to test the variations to see which ones work best.

Most workflows that involve making simple edits or transformations to images and video assets can be automated using dynamic URLs. To put this into perspective, let’s talk about how to create variations for a landing page hero image using dynamic URLs.

Cloudinary dynamic URLs offer a great way to create and deploy images on a website. If you’re already serving image assets from Cloudinary, it makes sense to use dynamic URLs to create variations of them and experiment with what works best.

To do this, you’ll need a base hero image. Below is an example served from Cloudinary:

An image in the Cloudinary DAM, before transformation

The URL for that same image is:

https://res.cloudinary.com/djte4pdpm/image/upload/v1737400982/hero-image.jpgCode language: JavaScript (javascript)

For a hero image, it makes sense to experiment with different calls to action (CTAs). With Cloudinary, you can do this by adding a text layer to dynamically generated image. Here’s an example of the modified image and its dynamic URL:

hero image

The URL for that same image:

https://res.cloudinary.com/djte4pdpm/image/upload/l_text:Arial_80:Sign%20up%20today/fl_layer_apply/hero-image.jpgCode language: JavaScript (javascript)

Now that you understand how basic dynamic URL structures work, how to find your cloud name, and how to add transformation parameters to the URL, let’s see how Cloudinary handles adding text and layers to media files using the following two parameters:

  • Text transformation parameters. The l_textparameter lets you to add text to the asset. You can specify the font family, size, and several other style parameters.
  • Creating a new layer. Using the fl_layer_apply component adds a text layer to the asset. You can reposition this layer (and the text inside) using various parameters.

If you plan on adding text to media assets to experiment with CTAs, you’ll need to spend some time making sure the baseline parameters look good. Below is an example of an updated dynamic URL that adds better-looking text to the image:

https://res.cloudinary.com/djte4pdpm/image/upload/c_fill,h_312,w_820/co_rgb:FFFFFF,l_text:arial_70_bold_normal_left:Sign%20up%20today!/fl_layer_apply/hero-image.jpgCode language: JavaScript (javascript)

Here’s what the image looks like. You’ve just made a CTA in seconds.

An image transformation using Cloudinary Dynamic URLs

Structuring dynamic URLs can be challenging. If you’re struggling to get the experimental content to look like you want it to, check out the Transformation Center in the Cloudinary console. The Transformation Center has a visual interface that lets you set up complex transformations and edit text layers that include parameters you can add to your Dynamic URLs.

Cloudinary can help you create experimental content at scale. To test it, you’ll need to use a solution like VWO or Optimizely.

These are some of the most well-known variation testing tools in the market. You can use them on your website or application to show users variations of elements and track data on which ones get the most engagement. Which A/B tool to use is up to you, and it should depend on the kind of content variations you want to test.

Regardless of which A/B testing solution you use, you’ll want to keep the following in mind while experimenting with content variations:

  • Collect enough data. Run tests for as long as needed to determine which variations work best. If your website or app doesn’t get a lot of traffic yet, collecting sufficient data can be challenging.
  • Set clear goals. Are you testing for which CTA converts better with a certain image? Dynamic URLs enable you to experiment with content quickly and the data you collect can help you answer those questions decisively.
  • Takenotes on which variations perform well. Whichever analytics tool you use should track data on how user engagement. However, it’s up to you to keep notes on what patterns you see in variations that work better with users, allowing you to create more targeted content.

Overall, dynamic URLs are a fantastic tool for experimenting with media content assets. You can bypass having to use image or video editing software to make content variations, create them at scale using URLs, and get to the testing stage fast.

If you want to experiment with content at scale and bypass manual image editing tools, dynamic URLs can help you do that. Just specify how you want to transform or edit the image or video, and generate multiple variations on the fly. Combine that with A/B testing software, and you can leverage analytics to empirically determine what kind of content your users are looking for. 

Ready to streamline your content creation workflows? Sign up for Cloudinary today.

Start Using Cloudinary

Sign up for our free plan and start creating stunning visual experiences in minutes.

Sign Up for Free