Audio and video can be a strong way to engage customers, tell your story and even increase conversion rates, but recent trends by the companies that develop browsers have made it more difficult to use video and audio in your Shopify theme — especially if you want it to play automatically.
Nearly all of the major browsers — Chrome, Firefox, Edge and Safari — have at least some limitations on video, particularly video with audio, that prevents it from autoplaying and the restrictions tend to become even more strict on tablets and smartphones.
TL;DR: The bottom line
The bottom line with autoplaying video or audio is that you should not rely on it working any more — no matter what device or the format of the multimedia file you’re using.
Browsers
Almost all popular Web browsers have an option, whether natively built in or available via a plugin or add on, to block autoplaying video and audio based on the user’s preferences.
This can be done globally — that is the browser might be instructed to block all instances of video from starting automatically. It’s also possible to block this feature on a per site basis or the browser might leverage machine learning and a user’s browsing history to determine if an audio or video file should automatically play or not.
We won’t get into the nuances of which browser does what, not only because it changes all the time, but because there are typically so many variables that it’s difficult to outline hard and fast rules.
It’s also important to note that autoplaying rules are most likely to change — and probably get stricter as time go on — so preparing yourself now with these tips will be a good step toward making your site ready for down the road.
Silent video
In general, if you’d like to increase the likelihood that your video will automatically play, removing the sound is a good first step.
In most Shopify themes, this is most frequently used for large, full width video backgrounds that may have text or other elements over it, which can be a great way to create an eye-catching hero element for your store.
However, even silent autoplaying video can be blocked by browsers or user preferences or settings, so this approach is far from guaranteed.
Mobile dilemma
However, keep in mind that most browsers have a whole different set of rules when it comes to their mobile versions, if available.
In general, mobile devices are much stricter and it’s even more likely (if not guaranteed) that most auto-playing audio or video will be blocked. This is basically done out of consideration for the end user, whose mobile data plan may inadvertently get eaten up by visiting a site that’s auto streaming a large video file, for example.
In addition, most mobile browsers can’t display background-style video properly. For example, even if the user opts to view the video by tapping it, it generally will display in fullscreen mode — meaning any text over it won’t be readable and the user will need to exit the video player mode to return to your site.
Video pros and cons
With or without audio, video does have many great uses, including the ability to:
- Tell the story behind your company or products
- Demonstrate how products or services work
- Showcase customer testimonials or case studies
- Illustrate how products and services look in the real world
- Serve as an attention-getting design element
However, there are a few factors to keep in mind:
- As discussed in this post, video behaves differently in different situations: This means you can’t always rely on it working the way you intend.
- Video can affect both site speed and bandwidth usage: Most video formats don’t need to be completely downloaded before they start playing or if the user never clicks play, but if the user does opt to view the video, it can take a significant amount of time and eat up users’ mobile data quickly to be able to load the entire clip.
- There are many cases where a video, particularly one with audio, may not be of use to a customer: For example, customers who are browsing your site in a public place may not have headphones handy and either will skip watching a video assuming there is sound or, if there is sound and the user’s device is muted, they won’t get the full experience.
- Utilizing video also adds accessibility issues: Video clips can’t be enjoyed fully by those with hearing or visual limitations. There are alternatives, such as transcripts, captioning, on-screen text and audio descriptions, but these are all factors to consider carefully.
- Starting a video with sound automatically can be a great way to grab a user’s attention, but it’s also likely to annoy a good portion of your user base, particularly if they aren’t expecting it — and there are a lot of better ways to grab attention.
- Using video that plays automatically, even without sound, can sometimes bog down a user’s device. There can also be instances where, for example, a video background is choppy or glitchy, which can be a big turn off to shoppers.
- Since video is, by its very nature, a moving image, it can be difficult to find or create video clips that still allow the text or other elements placed on top of it (either right in the video file or by your Shopify theme) to be legible the entire time. Adding a layer of opacity over the video clip can be a good solution to make it easier to read, though this does make your video less prominent.
- Video can be expensive and time consuming to produce: in many cases, if a video is not well lit and professionally shot and edited, it can seem amateurish and out of place, especially when going up against the highly polished professional videos your customers may be used to seeing.
All that said, video can still be a great selling tool if done properly:
- Give up on trying to get video to automatically play — there are simply too many variables and “what ifs.” Plus, if autoplay behavior changes in the future, you’ll be ready.
- Instead of worrying about grabbing attention with an autoplay video, focus on creating a great cover image: A cover image is the image shown before a video starts playing and, depending on your video platform and your status with it, can be changed to something custom (like to a YouTube help article). You can also use text or imagery near the video to compel users to click play.
- Videos on product pages are a great way to showcase products in another way. Videos can be as simple as a 360-degree rotation of your product, to closeups of features, to a highly produced overview of the product. A good way to add these types of videos is through your Shopify theme’s image gallery. When adding a video to a product image gallery in an Out of the Sandbox theme, the thumbnail associated with the video clip can be any image you’d like. Consider uploading an icon of a video camera or “play” button so that browsers can see a video is available. Another option is to take a screenshot of a key scene in the video and place a “play” button on top of it.
- A video is also a great way to add personality to your brand — whether it’s through a video clip that introduces a founder, employee or customer, or takes the viewer on a behind-the-scenes look at how your products are produced, or what features make them stand out.
However, before using video there are some key questions and considerations you should always ask yourself:
- Am I creating a video just for the sake of it? Is video really the best format to present this information?
- Is the information included in the video vital for everyone to see? If so, have I presented it in another format somewhere else on the same page so that if a shopper doesn’t watch the video for whatever reason, they still get the information?
- Does my video work well if the audio is muted? Have I considered how I can ensure my video is accessible to those with visual or auditory limitations?
- Imagine if the video “disappears” from your site — does the site still “work” without it and give customers all the information they need? Does it still look good visually?
- Is my video well produced and well lit? This doesn’t mean you need to hire a professional video company — even well lit and framed videos shot on a phone can be an effective selling tool.
- Does my video have “character” and strengthen my brand? Since you can’t always rely on everyone seeing your video (whether it’s autoplayed or not), it can be a good strategy to use videos as an “add on” to the images and text already on your site. If someone misses it or can’t view it due to any number of reasons, they should still have enough information to convert — while those who do watch will get even more information to help make a purchasing decision.
