How to Embed Video in Your Email Marketing Campaigns

Remember when MTV changed the game with music videos? Well, now it’s email’s turn for a video revolution. With people devouring 84 minutes of video daily, it’s time to bring that cinematic magic to your subscribers’ inboxes.

Why jump on the video bandwagon? Because it’s like strapping a jetpack to your email metrics:

  • Open rates soar by 6%
  • Click-through rates explode by 65%
  • Unsubscribes plummet by 26%

While over 50% of marketers say video supercharges their email performance, a mere 34% are actually pressing play on this strategy. Talk about a missed opportunity!

We get it—embedding video in email might seem trickier than nailing jello to a wall. But fear no more, email champions! We’re about to show you how to master video embedding, even in the wilds of Gmail, Yahoo, and Outlook.

In this action-packed guide, we’ll discuss

  • Do videos in email work?
  • Different methods for embedding video in email
  • Considerations when using video in email
  • Best practices when embedding videos in emails
  • FAQs about embedding video in email

Ready to transform your emails from snooze-fests to must-see events? Let’s dive in and make your inbox the hottest screen in town!

Do videos in email work?

Yes, embedding video in your email campaigns can be a powerful marketing tool. In fact, marketers who use video are likely to grow their revenue 49% faster than those who don’t.

Videos allow you to:

  • Show how your products or services work with a visual tutorial
  • Put a face or a voice to your brand by showcasing employees
  • Humanize a case study by showing your customers
  • Surprise and delight your audience

More importantly, your subscribers want to watch videos about your brand. Subscribers say they prefer to consume video content to learn more about a brand or products versus other forms of media.

Different methods for embedding a video in email

For all of the ways email client support makes video in email a tricky topic, the actual process of embedding an email is fairly straightforward. We’ll outline each of the ways you can embed an video in email, including some we don’t recommend (and why):

DON’T: Natively embed video in email

While embedding video in email directly with HTML code is straightforward, if you are not familiar with HTML, it can open your email up to coding errors and issues with email client support. It’s not for the faint of heart, but with some coding know how and a little bit of pixie dust, it can work. Here’s how to do it, if you choose:

  1. Create your video file. Your first step is to create or choose your video file, which should be under 10 MB in size. Make sure that it’s a quality, engaging video that’s relevant to the email and no longer than 90 seconds. If you’re going through the effort to embed a video directly into an email, instead of just directing traffic to it, it should be content you’re proud of. Once you have your video file, upload it to your video hosting platform and copy the video file’s URL—you’ll need it for the HTML video tag’s src attribute.
  2. Upload your video poster image. A poster image is the image people will see in the email and as they download the video. Your poster image should be a still image from your video with a play arrow overlaid so people know it’s a video. You can also use this image to leave instructions for how to play the video. After you create the image, upload it to your server or ESP.
  3. Set up your HTML video tag. The important attributes to include in the HTML video tag are:
  • The src attribute: Put in the URL of the video file you’re embedding.
  • The poster attribute: This is the image that will be shown as the video is downloading.
  • The width and height attributes: Specify how tall and wide your video should be displayed.
  • Controls: This tells the email client to show the controls for the video. Not all email clients support this, but it’s nice to include for the ones that do.

The content between the video tags is what will be displayed if the video tag isn’t supported. This can be text or an image, but in either case, we recommend linking to your video so your subscribers can still get the video experience.

Here’s an example of what the HTML video tag looks like:

<video width="600" height="300" controls poster="https://via.placeholder.com/600x300" src="https://example.com/yourvideoname.mp4" >
    <!--your fallback goes here-->
<a rel="noopener" target="_blank" href="https://www.example.com" ><img src="https://via.placeholder.com/600x300" width="600" height=”300 /></a>
</video>

The only place you’ll need to add a specific fallback for is Outlook.com and Outlook mobile as these clients support the video HTML element, but have content restrictions that mean that the video won’t show up. For these clients you’ll have to add a class of video (class=”video”) and add code to support a fallback.

Let’s take a look at how much email-driven revenue you could be leaving on the table.

DON’T: Static image with play button

If all of that coding seems like too much work, then you can always add a screenshot or your thumbnail image into the email with a play button over it and call it a day, right?

Image support in email is much stronger than video. But this isn’t the best way to get video into your emails—mainly because having your subscribers click through to watch on your website’s landing page doesn’t really tap into how powerful video in email can be. Of course, sometimes email client limitations mean you have to do something. In that case, instead of using a static image, try an animated GIF.

DO: Video as an animated GIF

Unlike video, GIFs in email are supported almost everywhere. If you’re unable to add a video because of email client support, an animated GIF is the next best thing. You’re still adding eye-catching motion into your emails with the animation. Showing the promise of the full video can be enticing enough to get your subscribers to click through. Adding a play button into your GIF is one way to do that.

Animated GIFs are limited to short clips (just a few seconds) and don’t include sound. Still, it’s much more engaging than a static image—and a great way to get video into your emails.

Best practices for embedding videos in email

You’ve decided to add videos to your email, great! But, don’t just add a video for adding a video’s sake. Make sure you have good video content that addresses a need your subscribers have. And make sure your audience can even play your video in their emails. Here are some best practices to keep in mind for a successful video embed:

1. Optimize your email for multiple email clients and platforms

What makes embedding video so tricky is the lack of email client support:

Desktop Clients

Webmail Clients

Mobile Clients

Outlook 2000-2003

Gmail

iOS Mail ✓*

Outlook 2007-2019

G Suite

Gmail

Outlook for Mac ✓*

Yahoo Mail

Gmail IMAP

Apple Mail

AOL

Samsung Mail

Windows 10 Mail

Outlook.com

Outlook

Office365

Office365

Yahoo Mail

Thunderbird

Comcast

AOL

Orange.fr

SFR.fr

*supported with limitations

As you can see, that’s a lot of places where natively embedding a video in email is not supported. The best support for video in email is on Apple Mail, and Thunderbird. (This is why we we recommend using animated GIFs embed video in email!)

If you choose to embed a video in email using code, keep in mind your video needs to look good and work well across email clients and devices, so use a responsive email design to scale it to fit. Keep device sizes in mind when you choose your video, too. A ‘talking head’ video front he shoulders up is easier to see on a small screen than a zoomed out panel interview, for example.

2. Consider video file size and hosting

Another thing to consider is the video itself. File size and where it’s hosted are major factors that’ll determine if the video will even play within your emails.

When natively embedding a video, we recommend no more than a 10MB for the video file size due to extended load times hindering your subscriber’s experience. Larger video file sizes take longer to load and require more from your subscribers’ data plans. Keep your subscribers engaged by keeping your file sizes low.

You also need to keep in mind where you’re hosting the video. Your video file has to live somewhere, and the hosting platform you choose can make embedding it in email a bit easier. You have to host the video yourself in some way—YouTube, Vimeo, or another video hosting platform will not work.

3. Choose an engaging thumbnail

Your thumbnail needs to get people to want to press play as their call-to-action, so choose a shot that:

  • Is clear (unless a blurry action shot is an intentional style choice)
  • Has a single focal point, like a person or product, instead of a busy scene
  • Has high contrast for accessibility

Packlane uses a solid video backdrop and clear still shots for its video thumbnail. Image via Really Good Emails.

A large or colorful play button on the thumbnail lets subscribers know it’s a video and not a still shot. You can also explain that it’s a playable video in your copy and headlines, or even mention it in your email subject line to boost open rates.

To watch, simply hit the button below - Watch on demand.
Use a CTA button to direct subscribers to on-demand video

 

4. Consider background images and videos

While not strictly video embedding, using background images or HTML5 video backgrounds can add visual interest to your emails.

Background images in emails are widely supported and can create a cohesive look for your campaign. HTML5 video backgrounds, while less supported, can add subtle motion to your email design.

In both cases, ensure you have appropriate fallbacks for email clients that don’t support these features, and always prioritize readability of your main content.

Catch errors before they reach subscribers. Test rendering, links, and spam scores in seconds. All in one place.

5. Set up fallbacks for natively embedded videos

Since email client support for natively embedded videos varies, you may need to add some workarounds to make sure the video looks right for every email platform.

Embedding videos with iOS

We used to have to deal with several client-specific fallback images when iOS stopped supporting video in iOS 8 and 9. But as we’re some years past that (support was reinstated in iOS 10 and the most recent release—iOS 17—still supports video), you’re relatively safe not including it.

If for some reason your subscribers are still using iOS 8 or 9 (on devices up to an iPhone 6 Plus), you can check out Remi Parmentier’s method to target those email clients, hide the video tag, and show a fallback.

Embedding videos with Outlook

You’ll need to add a fallback for Outlook.com, though (which also happens to target Office365 webmail, but as video isn’t supported there, having the fallback won’t change anything). To add a fallback, you add a class to your video tag:

<video class=”video” width="600" height="300" controls poster="https://via.placeholder.com/600x300" src="https://example.com/yourvideoname.mp4">
    <!--your fallback goes here-->
    <a rel="noopener" target="_blank" href="https://www.example.com" ><img src="https://via.placeholder.com/600x300" width="600" height="300" /></a>
</video>

Then, hide that from Outlook.com with:

.video{ display: none !important; }

Afterward, create the fallback with a display: none property and an mso-hide: all to keep it hidden on Outlook desktop clients:

<a class="videoFallback" style="display: none; mso-hide: all;"  rel="noopener" target="_blank" href="https://www.example.com/"><img border="0" src="https://via.placeholder.com/600x300" width="600" height="300"></a>

Add in the CSS to display the fallback on Outlook.com:

.videoFallback{ display: block !important; }

And you’re all set to go. The whole code would look like this:

<video class="video" width="600" height="300" controls poster="https://via.placeholder.com/600x300" src="https://example.com/yourvideoname.mp4">
    <!--your fallback goes here-->
    <a rel="noopener" target="_blank" href="https://www.example.com" ><img src="https://via.placeholder.com/600x300" width="600" height="300" /></a>
</video>
<!--outlook.com fallback-->
<a class="videoFallback" style="display: none; mso-hide: all;" rel="noopener" target="_blank" href="https://www.example.com/"><img border="0" src="https://via.placeholder.com/600x300" width="600" height="300"></a>

And place these styles in their own style block the <head> so they don’t interfere with any other email clients:

<style>
.video{ display: none; }
.videoFallback{ display: block !important; }
</style>

6. Use strong visuals and storytelling

Video makes a real impact when you tell a story with it. But keep in mind, it must be under 1 MB for email, so you don’t have much time or space. That means you must carefully plan your shots and commentary to hold attention and tell your story. You can use the rest of your email copy to help tell the story of the video—just make sure to add captions or a transcript to your video file as well to show you prioritize email accessibility.

Here are a few great examples of embedded video in email done right:

Source: Really Good Emails

Wistia used an embedded video in an email about their new embedded video feature, which is a great way to actually show the power of video in email. They used a thumbnail fallback for non-supported clients.

Why it wins:

  • Relevant (and fun!) for the email content
  • Content player visuals in the email make it obvious it’s a video, not a photo
  • Fallback thumbnail for non-supported clients

See this email in action

Netflix is an obvious place to find video in email, but surprisingly they don’t use it very often. So when they do, it stands out. They use the thumbnail that links directly to your Netflix account so you can start watching right away. It might be worth experimenting with dynamic content recommendations based on past behavior or live content that updates based on when a subscriber opens a message for the next iteration of this email, though. 🤔

Why it wins:

  • Play button over visually striking thumbnails
  • CTA button to ‘Play trailer’ with a play button

Bring emails to life with video in email

Video has the potential to turn your email marketing from ordinary to extraordinary, capturing attention and driving engagement like never before. Whether you’re using GIFs, embedding natively, or leveraging creative workarounds, the possibilities are endless. The key is to find what works best for your audience and keep experimenting with how you deliver your message.

So, why settle for static when you can give your subscribers something worth clicking play? Start bringing your emails to life and watch your results take off.

Create on-brand, engaging emails quickly with our versatile builder. No HTML skills? No problem.

Frequently asked questions about video in email

People usually ask us these questions about video in email:

Should you embed videos in email?

Yes, you can and should embed video in email! While you don’t want to overdo it with videos in every email marketing campaign, a well-placed video packs a powerful punch.

You can make a video appear in an email four different ways:

  1. Embed using native code
  2. Add a static image and have subscribers click through
  3. Use an animated GIF
  4. Embed automatically with Litmus Personalize

Yes, you can autoplay video in an email based on the settings in your code if you choose to embed a video in your email using native code. However, we don’t recommend autoplaying video in email because it will increase email load time, creating a poor experience for the recipient. Plus, unexpected motion can present as an accessibility concern.

No, YouTube videos won’t work in email. However, if you link to a YouTube video from your email, Gmail will show recipients a preview of that video at the bottom of the email.


The post How to Embed Video in Your Email Marketing Campaigns appeared first on Litmus.

https://www.litmus.com/blog/video-in-email