Read the Report →
The Path to Better Connections is a Visual One.
Welcome to Cloudinary’s 2021 State of Visual Media report. For our third annual report, we analyzed data across more than 670 global customer brands to gain insights into how visual media content is produced, managed, viewed, and consumed.
Spanning 10 vertical industries with a representative sampling of more than 80 billion transactions per month, the data we analyzed for this year’s report emphasizes the degree to which the visual economy is impacting brands and the way they engage and connect with audiences. With visuals at the center of this new world of digital engagement, or what we call visual-first engagement, most brands upload new image and video assets every day, from dozens to thousands. One of our largest retail customers saw its visual content bandwidth increase by 129% from 2019 to 2020, and is on track to see another massive increase in 2021. In March 2021 alone, Cloudinary managed and delivered an average of 2.4 million image and video assets per customer.
By tapping into this treasure trove of data, produced by some of the world’s most popular brands, we’ve identified several key trends in visual engagement, including trends shaped by the pandemic and our increased reliance on digital forms of communication and connection. We also take a look at what’s needed to raise the bar on these visual-first experiences as we return to a post-pandemic world — a world in which fast and flawless visual content will remain critically important across all facets of our lives.
Key findings from the 2021 Report include:
So dig in and let us know what you think.
Chapter 1: Covid Impact
Picturing the Impact of the Pandemic
During 2020, the power of visual content had new meaning.
Images and videos kept us connected and engaged in new ways — at work, at school and at home. Videos in particular provided a gateway to a world outside our locked down realties. Not surprisingly, image and video requests on Cloudinary’s platform increased significantly. From January 2019 to December 2020, video related traffic on Cloudinary had nearly doubled to 12.79% of total traffic, and the average percentage of monthly bandwidth for video rose from 18.97% to 26.74%.
However, these figures vary significantly by industry, and we can directly correlate the volume of visual media requests to that industry’s health. Some saw “epic scale” growth where others experienced significant deflation.
Video Traffic and Bandwidth
Pre-pandemic through December 2020
In harsh contrast, the travel industry – for obvious reasons – saw dramatic downward trends since the start of the pandemic. Until March 2020, the median percentage of video bandwidth in this industry was quite high with peaks of 23%. The video traffic plummeted to 1-5% of pre-pandemic image use levels.
These traffic troughs are a challenge. Many CDN providers base their fixed monthly fees on peak viewing bandwidth usage. As a result, the monthly fees increase the more often an image or video is viewed. If companies have significantly fewer visitors during off-season times or experience dips in traffic during a crisis like the pandemic, their monthly fee stays the same. A fairer approach is to charge a flat fee according to the size (in bytes) of the resource, as this also reduces the cost when there is less traffic on a website.
When traffic peaks occur, maintaining site performance is the primary challenge, along with avoiding slow loading times, and ensuring a high-quality user experience. This becomes especially important with Google’s Core Web Vitals directly impacting search rankings. Without a tool to automatically optimize images and videos, and guarantee bandwidth and image quality are well balanced, meeting all of these requirements is almost impossible. More information on what you need to consider can be found in the next two chapters.
VELTRA, Japan’s leading online travel experience marketplace, adopted Cloudinary’s advanced image optimization technology, delivered as an Amazon CloudFront service from the Amazon cloud, to enable maximum flexibility and greater efficiency to on-going COVID travel sector disruption. As a result, VELTRA — a play on the word TRAVEL — is now set up to deal with whatever the market demands from it in the next phase of post-pandemic leisure experiences.Read the case study
Cloudinary also has a fixed monthly fee, but with Amazon CloudFront, the CDN is fully charged on a pay-as-you-go basis, which we benefit from because it reduces the cost when there is less traffic on our website. We found Cloudinary’s service to be a good fit in terms of cost, as well as its many image management functions.
Beyond downscaling and upscaling, adopting a multi-CDN approach is critical when it comes to protecting your site against outages, internet breakdowns and inevitable traffic spikes and demands.
Chapter 2: Visual Mastery
Visual Mastery to Move Beyond the Basics
The modern visual workflow involved with routinely uploading images and videos requires an entirely new set of skills.
Our data suggests most brands fully embrace the most established visual transformations and automations, but are still making their way toward adopting more advanced capabilities. Today’s content and user experience teams need to continue developing their visual mastery to transform images and videos so that they can break through the visual cacophony without sacrificing load times and bandwidth constraints.
Fortunately, most customer brands that use images heavily are saving time and developer resources by automating the most routine transformations.
Most brands today fully understand the need to strike the optimal balance between file size and quality (75%) and rely on automatic format selections to ensure the best format is delivered (69%). Cropping transformations, which automatically remove parts of an image to either fit it into a required aspect ratio or to highlight a specific image area, are also incredibly popular and leveraged by most of the companies analyzed (63%).
Not surprisingly, a high number of media properties (56%) are harnessing the power of more advanced transformations, like intelligent cropping where detected faces are optimally positioned within an image crop.
Although we see huge untapped potential for brands to gain better business and financial outcomes by raising their visual mastery, we aren’t too surprised advanced capabilities are slow to be adopted. Brands are managing huge volumes of new content every day, and nailing the basics is a critical first step to success. Once that foundation is in place, expanding one's visual engagement toolkit is a natural next step. For inspiration look to digitally native companies that were born on the web, like Cloudinary's customer MADE.COM.
Rooted in the belief that great design should be available to everyone, MADE.COM firmly understands that its customer journey has to recreate as much of the physical experience as possible online. As a leading digital lifestyle brand for home goods with experiential showrooms across seven locations globally, the customer experience (CX) users get from its desktop and mobile online presence must be of the absolute highest standards, like its carefully chosen makers and materials. This bar has been met through a recent site rebuild with Cloudinary’s technology, guaranteeing the kind of engaging visual experiences MADE’s shoppers have come to love.Read the case study
We needed to make sure the products were the hero…We needed bigger, sharper images that really give you the detail of the fabrics we use, and we also wanted the option to easily change background colors. Grey backgrounds help frame product images while adding shadows gives depth. But we didn’t want to add such background effects to the images themselves to ensure they’d be future-proof for any brand design updates.
Embrace advanced AI-enabled visual transformations like autotagging, background removal, and intelligent cropping to take your website from good to great and stand out in today’s visual economy.
Chapter 3: Image Formats
Modern Web, Modern Formats
Today’s visual economy comes with a wide variety of available image formats, with most brands relying on three or four different image formats to tell their stories.
According to our data, in October 2019 60% of our customers used three or more formats and by March 2021 that number had risen to 71%.
More established formats like JPEG date back to the 1990s but newer, more modern formats like WebP have emerged in the last decade. It’s no surprise that JPEG – the lowest common denominator that displays well on all types of browsers and devices – remains the most frequently used image format (95%). PNG ranks second with 73%, and WebP with 69% is close behind in third place. Our data also shows that WebP adoption has grown since 2019 and is on track to overtake PNG. This development could be as a result of Safari adopting WebP in macOS Big Sur and iOS 14.
WebP’s momentum comes as little surprise when you consider the following data: the average WebP file size is roughly 20% smaller than the average JPEG. Another more lightweight format that grew in adoption was JPEG 2000, with an average size that sits in the middle of WebP and JPEG. In October 2019, just 4.5% of brands used the JPEG 2000 format and in March 2021 usage exploded to 25% - an increase of more than 450%.
The adoption rate of JPEG XR – also known as WDP, developed by Microsoft – went the opposite way: from 33% in October 2019 to 6% in March 2021. And newer formats like HEIC and AVIF still have very low adoption rates, though HEIC saw a noticeable increase from 0.2% in October 2019 to 2.1% in March 2021 with our customers.
One reason lightweight formats may have grown in popularity in 2020 might be companies’ preparations for the June 2021 launch of Google’s Core Web Vitals. These three metrics measure web performance and give search result priority to sites that prioritize the user experience. The first metric, Largest Contentful Paint (LCP), refers to how long the largest object on a site (usually an image) takes to load before a site visitor can see it completely. Google recommends keeping the LCP under 2.5 seconds. Data from the 2020 Web Almanac revealed that more than 47% of desktop and 57% of mobile websites must improve their LCP to meet Google’s criteria. The increase in WebP and JPEG 2000 usage in the second half of 2020 and the first quarter of 2021 suggests that companies have heard and acted on these search-affecting warnings.
With Core Web Vitals impacting search rank, we will likely see more companies interested in replacing JPEG where possible. The new JPEG XL format, based on Google’s PIK codec and Cloudinary’s Free Universal Image Format (FUIF) codec, is a promising candidate here. JPEG XL can not only reduce file size by 50%, but it is also the first “JPEG-replacement” candidate with a plausible transition path.
JPEG XL is a royalty-free raster-graphics file format that supports both lossy and lossless compression.
The format targets the capture, storage, archival, transmission, and distribution of photographic images, as well as graphics, illustrations, mixed contents (e.g. screenshots) and animations.
- Responsive Web
- Wide colour gamut
- High Dynamic Range (HDR)
- Legacy transition features
- Effective compression at high visual quality
Get the graphic
As roughly 60% of most of today’s website data is taken up by images, cutting file size in half from the current JPEG standard to JPEG XL could reduce bandwidth requirements by up to 25-30%.
Chapter 4: Video Demand
The Continued Rise of Video
No doubt video remains a critical medium for visual storytelling.
From January 2019 and through the pandemic, video requests on our platform doubled from 6.8% to 12.79%, and video bandwidth grew by more than 140% in Q2 2020. And while managing video is far more complex than managing images, there are fewer video codecs than image codecs to handle.
Among the brands in our study, the h264 video codec is the clear winner with an adoption rate of more than 98%, however other formats are slowly gaining momentum.
Other codecsUsage rate from October 2019
We also looked at differences between mobile versus desktop delivery. Our data showed that the h264 (21%) and HEVC (20%) formats are delivered much more often to mobile web browsers than VP9 files, which are mainly delivered to desktop browsers (29%).
No doubt managing video codecs can be complex. But that's not stopping brands from managing and transforming more video content than ever before. Our heaviest video users are transforming their video assets 17 times on average, not too far behind our heaviest image users which transform their images 20 times on average. See Chapter 5 for more.
Brands should consider how AI is making it much easier to transform and manage video at scale, such as:
3D videos that allow brands to generate 360-degree animated images from a 3D model; generate a 360-degree video from a 3D model; or generate a single, stand-alone image from a 3D model.
Video is absolutely everywhere, even in places where you might not expect to see it. As an example, Vorwerk uses Cloudinary to deliver short videos directly to the user interface of its Thermomix kitchen appliance. This requires special codecs, as video generates a lot of data that is compressed before delivery.
Vorwerk relies on Cloudinary to manage and deliver high-quality images and videos quickly and flawlessly to millions of Thermomix® customers using its “Cookidoo®” recipe platform. Hosting more than 66,000 digital recipes, Cookidoo® is available not only through the web and mobile applications, but also through the new generation of Thermomix® smart kitchen appliances TM6, bringing the Internet of Things (IoT) to life in the kitchen. With Cloudinary’s media experience platform, Vorwerk can deliver on its quality promise through compelling visual assets and a seamless global brand experience.Read the case study
Cloudinary allowed Vorwerk to deliver image and video content fast, without interruptions, in all served markets, on all its devices, including the Thermomix® IoT-appliances.
Lean and powerful — The open, royalty-free video codec AV1 was specifically designed for Internet video transmissions.
Same visual quality as VP9 codec with at least 30% bitrate savings
Chapter 5: Responsive Design
Activate the Benefits of Responsive Design
According to April 2021 data from Statista, mobile accounts for approximately half of web traffic worldwide.
This trend is confirmed by our usage data as well. During the last year, mobile devices generated 51.4% of traffic, with significant regional differences: in the US, mobile accounted for 47.7%, in Germany 50.2%, in the UK 56.8% and in India 81.3%.
This means that companies need to ensure all images and videos are responsive and optimized for mobile devices. Historically, this meant content teams needed to store multiple versions of every image and video to appear correctly in different viewing windows, including landscape and portrait orientations. Given that most brands now upload images every day, this is a difficult task. It’s not just about delivering responsive images and videos but also about delivering them at scale.
Mobile traffic by regionClick to toggle between data
The industries getting responsive right
When comparing responsive design usage, it is applied more often to videos than images across all industries. Those not using responsive design for images are losing an opportunity to score highly for Google’s Core Web Vitals, which are all about user experience. Given that half of the world’s web traffic comes from mobile, images – not just videos – should also load perfectly well. Optimizing for responsiveness will not only please the almighty Google algorithm, but customers will appreciate it as well.
An antiquated image management system, incompatible with modern browsers and devices, was making it increasingly difficult for GUESS to deliver an exceptional user experience. The vast majority of customers (76%) look at products on smartphones, so when GUESS was redesigning its viewer, they wanted to deliver the best mobile experience possible. However, the company also had to take into consideration that many customers completed their purchase on the desktop. Cloudinary’s auto-responsive Product Gallery provided GUESS the flexibility needed to deliver the same, high-quality user experience, regardless of device. With greater automation and continued technological innovation, Cloudinary has driven greater efficiency and organization in the workflow for the GUESS creative studio, merchandising team, and developers, while significantly improving performance for even the most image-rich pages.Read the case study
The ability to navigate the online store better, on both desktop and mobile, and view the products faster, either on the product listing or product detail pages, was a key component to the conversion improvements. Any improvement on the product detail page leads to a significant increase in conversions.
Up your SEO game and boost customer experience in a mobile-first world by applying automated responsive design to optimize images and videos at scale.
Chapter 6: Microbrowsers
Shine a Light on The Engagement Opportunities You Can’t See
The increase in mobile traffic leads us to another important trend: the growing importance of content shared in messaging app browsers, or microbrowsers
According to recent data from Spectrm, messaging apps have overtaken social media platforms in the number of active monthly users by 20%. This means the majority of content shared via mobile today is viewed on these so-called ‘dark social’ channels in the form of links pasted into emails, chat apps like WhatsApp and Messenger, and business collaboration tools like Slack.
The top instant messaging platform the brands in our study favor is iMessage. The service is the number one globally, except for in Southern Asia, Sub-Saharan Africa and Northern Africa, where WhatsApp leads. WhatsApp is the number-two service globally (in nine of 14 regions), followed by Facebook Messenger and Slack (in six regions each). Northern America is the only region where WhatsApp did not enter the top three.
iMessage maintains its number-one position across sectors, except for the Media industry where Facebook Messenger is mostly used to share images and videos (75%), and Computer & Electronics where Slack is ranked first (73%). This confirms the important role Facebook plays for news distribution. Slack is the number-two service across all industries and Snapchat ranks three.
And new dark social channels exploded during the pandemic, including secure systems like Signal, along with chat windows in video conferencing software like Zoom and Teams. Even though these channels started as communication platforms, they’ve mimicked browsers over time, effectively functioning as microbrowsers without the coding required for developing real browsers.
People shared content around the clock during the pandemic.
In our visual economy, it is important to address the unique needs of specific dark social channels. Why? Because each link shared within these microbrowsers “unfurl” differently, which means they create different previews based on the particular microbrowser. Brands can do a good amount of optimizing to tailor these images and videos to attract link clicks. The first step is to identify which microbrowsers are popular among a customer base and in a given industry, and then optimize (see Tips & Tricks) links accordingly. No keyword-search results, banner ads or newsletter will be trusted by a customer more than links shared by family, friends, and colleagues. Optimize those links accordingly, and a brand will shine through in the visual economy.
Upgrade the HTML markups on all your pages with microdata: titles, descriptions, images for links. Limit the title length to 10 words and descriptions to 240 characters each. And to avoid confusion, annotate only one favicon.
Add Open Graph tags.
As a protocol for expanding websites to facilitate content sharing among social channels, Open Graph promises to boost clickthrough rates.
Open Graph code snippet
<meta property="og:url" content="https://the-url.com/of/the/page"/> <meta property="og:title" content="A Page Title, Optimized for Microbrowsers"/> <meta property="og:description" content="A page description, optimized for microbrowsers"/> <meta property="og:image" content="/microbrowser-preview-image.jpg"/>
Post unfurl images.
Spotlight your content with a compelling image to entice the audience to seek more details. Assign the image a unique name to track the number of click throughs, which in turn will clue you in on the number of visitors the microbrowser impression has attracted.
Post nanostories or animated GIFs.
Microbrowsers like iMessage display nanostories, i.e., short videos of less than 720 pixels, and animated GIFs that showcase key selling points. Note: Only videos in MP4 format autoplay. By default, they are muted and looped so be sure to add subtitles to them.
Cater to all microbrowsers.
Microbrowsers render links differently from one another even though most would display your favicon. Familiarize yourself with the differences and ensure that your content satisfies the various requirements.
Ensure fast performance.
Latency issues exist for microbrowsers, which are not regular browsers. Post images and videos of a small footprint for efficient loading.
Automate generation and enrichment of images.
Automate the manual, mundane, and time-consuming tasks of managing rich media with software tools and digital asset management (DAM) systems.
Are you ready to make the experience as powerful as your vision?
Visual storytelling will always be a blend of art and science, a mix of creativity and technical innovations. Understanding how to harness the latter – to ensure your visual stories are displaying and connecting the way you intend – will enable you to deliver digital experiences that engage and inspire, around the world and on every platform and device.
Fill out the form to download the report.
Please click here to download a PDF of The State of Visual Media 2020 Report.