One of the more polarizing parts of digital media is having video files autoplay or waiting until the user clicks on them. One option is excellent for engagement but bad for user experience, while the other is a better experience but lower engagement.
The most popular application of autoplay is capturing user attention, particularly through advertisements or promoted content. This strategy is notably prevalent on platforms like YouTube, where autoplay is switched on by default and plays a related video automatically after the current one ends. Autoplay, in this context, serves not just for engagement but also for marketing purposes.
In addition to its use on video platforms, autoplay plays a significant role in the functionality of peripheral devices. For example, in operating systems like Windows 10, autoplay settings enable the automatic start of software necessary to access and view content on MP3 players, memory cards, USB storage devices, and more. This feature simplifies the user experience by reducing the steps needed to interact with various media and devices.
This article will discuss how autoplay works and how you can include it into your platform.
What Is the Autoplay Attribute in HTML5?
In HTML5, the autoplay attribute is a boolean value that automatically tells a browser to start playing a video. This attribute can be added to an element by simply adding “autoplay” to your <video>.
However, it’s important to remember that video autoplay is generally frowned upon in modern web development. In most cases, it’s incredibly distracting and can be an unwelcome surprise to users, especially if there’s audio to accompany it. So keep that in mind when using this in your designs.
How Does Autoplay Work?
The autoplay feature has a few restrictions that will stop it from auto-playing unless one of the following is true:
- The source audio is muted (or the volume is set to 0)
- If the autoplay permission policy within iframes is set
- If the site has been allowlisted (which happens automatically through browser settings or other UI options)
- If the user has interacted with the site (i.e., they have clicked, tapped, or pressed something on the site.
You can see how detailed this feature works by reading Mozilla’s Web Documentation for Autoplay.
Using Autoplay with Cloudinary
Autoplay can be a powerful feature, but also one that should be used sparingly. Otherwise, you may drive away the users you want to keep on your platform. But with Cloudinary, you can have your cake and eat it too!
Thanks to Cloudinary, you can use our HTML5 video player and customize the viewing experience to your needs. With it, you can set up custom autoplay functionality so your users won’t be bombarded by maximum-volume 2000s alt-rock anthems and instead can enjoy a modern viewing experience.
Get started with a free Cloudinary account today, and see how you can take your media to the next level.
Additional Resources You May Find Useful:
