Cloudinary Blog

Advanced Techniques You Can Use Now to Improve Your Site’s Performance

 Top Transformations You Can Use to Improve Site Performance Now

Everyone wants a great website. Few know what it takes.

Building engaging websites and apps are often primary goals for developers and marketers. The key to increasing your site’s performance is making your content relevant and engaging, and your website fast and fun to use.

However, with serving dynamic content comes a challenge—speed. Many see their site slow down as they add more features and functionality. Fonts, JavaScript, CSS, and HTML are significant factors, but images and videos contribute the most to bloating, accounting for 75% of page content.

Recently, resident image optimization expert and Senior Solutions Engineer here at Cloudinary, Simon Tetelbaum, presented at our How to Optimize for Page Load Speed webinar, where he discussed how best to optimize the images and videos on your site to enhance performance.

Challenges discussed were:

  • Measuring content to build and maintain a cutting-edge site
  • Adapting media for responsive delivery across different devices
  • Handling multiple image types across various browsers

When it comes to speed, you need to be able to measure the content on your site and find out how it affects your page load time. Simon recommended a few leading-edge tools you can start using today. The best part? They’re all free.

  • Speed Curve: monitors the front-end performance and build of your site to show the most impactful areas. Compares your site to others and shows areas of improvement.
  • Webpagetest.org: run a website speed test and break down how your site content is loading. Includes detailed optimization recommendations.
  • Google Lighthouse: an open-source, automated tool for improving the quality of your web pages.

Adapting media for responsive delivery across different devices is another challenge Simon discussed. For instance, automatically delivering a reduced image size to a user on mobile versus a user viewing from a laptop can drastically improve the mobile user experience. One, if not the most, effective approach is to use SrcSets. SrcSets allow you to leverage multiple images and size attributes to help the browser determine which image(s) to request.

Services like Cloudinary help make this process easier. Cloudinary uses advanced techniques to automate optimization and responsive imagery.

  • f_auto: automatically converts delivered images to WebP and JPEG-XR on supported browsers to save bandwidth and optimize delivery time.
  • q_auto: automatically calculates the optimal quality for images. In other words, it finds the smallest possible file size that won’t affect perceptual quality.
  • g_auto: automatically decides which part of the image to keep and which to crop or remove.
  • w_auto: deliver the largest or highest-resolution images only to those users whose device resolution or browser size requires it.
  • dpr_auto: the ratio between physical pixels and logical pixels. Use the dpr parameter to set the DPR value of the delivered image.

See it in action!

To Sum It All Up

Many factors influence your site performance. Format, compression, and automatic responsiveness are what will most meaningfully impact your page speed.

So, how’s your site stacking up? Are you delivering content to your potential customers in optimal formats? If not sign up free with Cloudinary today. You’ll find out what optimized performance can do for your website—and your business.

Recent Blog Posts

The Visual Media Report: Visual Engagement and User Experience

With privacy top of mind, we wondered what we might learn from analyzing the large volume of data. What user behaviors would we discover, what regional differences might exist? What insights or early hints from different industries could we extrapolate? These questions guided us as we analyzed millions of anonymous end-user experiences and asset interactions across our platform.

Read more
How a Cloud-native DAM Platform Optimizes Customer Experiences

In today’s digital age, brands rely heavily on rich media to tell stories, foster engagement, and make emotional connections that drive results. Marketers use videos and images, tuned to customers’ interests, to create dynamic visual experiences. Digital campaigns about trips to Florida, for instance, have separate plot lines, depending on audiences’ passions for golf, deep sea fishing, or kid-friendly versus romantic getaways. Marketers expect to detect preferences, produce personalized experiences highlighting different desires, and turn digital prospects into vacationing customers. The ultimate success of a marketing campaign relies on the consistent delivery of these customer experiences, at scale.

Read more
Cloudinary’s Media Developer Experts Program

Cloudinary was founded by developers and developer-centric thinking is in our DNA. Our work with developers helps them better understand all things rich-media management and delivery is crucial to us. Now, in an effort to recognize, support, and reward the innovative leaders in that technical community, we’re excited to introduce a new Media Developer Experts (MDE) program! MDEs will leverage the Cloudinary platform to foster a community of media-management professionals; receive training and certifications to become experts within their field or audience; advance the state of media management, adoption, and best practices; and make the web more accessible.

Read more
An Eye-Opening Talk: Building Apps for the Next Billion Users in Africa

William (iChuloo) Imoh, who hails from Lagos, Nigeria, recently embarked on a U.S. speaking tour, February 20-March 12, during which he powwowed with technical and product teams and communities at such renowned enterprises as Netlify, Pluralsight, Lucidchart, Twilio, and more in Salt Lake City, Dallas, Las Vegas, and San Francisco. On March 5, he gave an enlightening talk, entitled International Developers and Development: Building for the Next Billion Users at Cloudinary in Santa Clara, California. Below is a synopsis. For details, see the related slides.

Read more
The Debut of the Cloudinary Customer Advisory Board

Focus on customers has always been Cloudinary’s mantra. Because we owe them our success, we are constantly reaching out to our customers, not just for feedback on our offerings, but also for their vision, wish list, and buy-in of what Cloudinary can do to meet their needs and make them succeed. About six months ago, it occurred to us that it would be beneficial if we could meet regularly with those who are behind innovation at our key customers—executives, product gurus, developers, content managers—to swap strategies, product roadmaps, best practices, and such. In particular, we’d like to solicit actionable feedback as a foundation for our plans of product enhancements.

Read more