March 18, 2024

Do Video Backgrounds Hurt or Help Your Website’s UX?

Many top-ranked websites and brands unrolled video backgrounds in 2015, and as a modern website design trend, it might be one of the more popular options during that year. But while video backgrounds might look cool, there might be some very significant UX reasons to keep them off websites. So before you follow the herd and add background videos to some of your website’s pages, consider the following pros and cons.

websiteux111

Con: Video Slows Down a Website

Visitors are incredibly likely to click away from slow pages, and even just a few milliseconds of added load time can increase your website’s bounce rate. Sure, there are a few tricks which can help you mitigate how slow adding background videos make your website, but at the end of the day, it will likely still be slower.

Con: Video Can Be Distracting

If there’s a lot of text to read on a website to explain what it’s about, having a large video can be distracting, and take up so much space above the fold that readers need to scroll to see what your website is about, or what it’s offering. As more and more website visitors are coming from mobile devices, this can be another hassle which causes them to click away. To help a video be less distracting, ensure that it’s just a short loop, 30 seconds or less, and remove the appearance of the video controls!

Con: Poor Contrast With Callout Text

Especially if you’re using rich video, callout or headline text can become more difficult to read when it’s placed over video content. If you do decide to use a video, ensure that it’s one on which your callout text contrasts well and really “pops”. An easy way to accomplish this is to put a color overlay atop the video.

Con: Irritating Audio

Especially if someone comes to your website on a mobile device, surprise auto-starting audio can be embarrassing! Always make certain that a video’s audio function is muted when you embed it. And if a video absolutely needs sound, make certain that audio must be engaged by the visitor.

websiteux1111

Pro: Communicates Complex Topics

Videos can be used to communicate complex topics well, or to demonstrate a great experience. A great use of using video to accomplish this is to use a short video to show how one might use the service your website is advertising, or to show panning shots of what your website is about. This is particularly great for experiential marketing. Most website visitors far prefer watching an informative video to reading informative text.

Pro: SEO Value

Especially if the video is produced in-house and cross-posted on different video sharing sites, videos can have a significant SEO value. That value is magnified the more views that video has, so promoting your video on a page that many visitors can see can have an impressive positive effect. You can compound that by posting the video transcript using services like Speechpad and Verbalink.

Pro: Cutting Edge Design

Many visitors believe that video backgrounds are cutting-edge (no matter how easy they are to technically implement) so it can translate to a positive brand experience. Trust in a website and brand is one of the number one reasons which visitors do (or don’t) engage, and videos are a powerful way to establish your brand as forward-thinking and tech-savvy.

websiteux11

Always Test Your Implementation

Whether you’re thinking of adding new opt-in functions, background video, or a new style of landing page, at the end of the day you should always split-test the change before fully implementing it across your website. If you think that using background videos might do well by your website, design specific alternate pages to test and promote, and see how your own visitors respond.

 

 

 

 

One Comment

  1. JonathanPDX Reply

    I only hope video backgrounds go the way of the blink attribute quickly. Or give us a way to make sure they don’t play unless asked. Just because you can do something doesn’t necessarily mean you should.

Leave a Reply

Your email address will not be published. Required fields are marked *