How to Use Video on Your Website as a Design Element
Video is now being used effectively (and in really cool ways) as backgrounds on websites, like the example above from Kickstarter. Thanks to advances in HD video, compression and web technology like HTML 5, the impact ofÂ video can be used in ways like never before.Â To be clear, we’re talking about using video as a background, not just embedded. This is kinda a big deal.
To help get a handle on what’s possible, here’s a link to a great selection of cool websites that use video as a background element in the design. Go ahead, check it out, then come on back…I’ll wait.
At Digital Accomplice we are actually in the process of redesigning our website now and will be using these video web design techniques. While we are experts in creating video content, using it as a design element in websites this way is new… to everyone actually. As we explore how we want to use video on our site, I wanted to share a little perspective about what you’ll need to consider before getting started with this process for your site.
To get some more perspective, we reached out to a few people in our network who could share relevant perspective.
Aaron Taylor, Partner at Hinge Marketing offered this great design-focused advice: “Full-width video backgrounds are an incredible way to create engagement right away. Use them to set a mood, as a foil for your messaging or to begin the story-telling process. Because these videos are silent, choose your clips carefully. Close ups of people’s faces and expressions create an immediate connection and intimacy. Movement pulls a viewer into your story. And dramatic landscapes can pack an emotional punch. When using type on top of video to keep the copy short and pithy so that it isn’t overwhelmed by the moving images. Remember, the video is there to enhance the message. It should never steal the show.”
One of our strategic partners is Trevor Gavin, owner of video production company Alchemy Creative. Trevor says “The real goal is almost always to build ‘brand trust’ and the best way is to give them content that appeals to them. Nobody wants to read a lot of text on websites anymore. Video jumps out at you and can’t be ignored like text. If it’s the right visual message at the right quality level, it’s a win.”
We also spoke with Duane Serfass, Digital Services Manager atÂ Webmarketing123, a San Francisco Bay Area web marketing agency. With his background in webdesign, he believes it’s key to “Keep it smart, keep it short. The load on servers is always a concern…but anything you can do to grab their attention is great. Video is also perfect for mobile audiences, who really want and expect to be entertained.”
With these perspectives in mind, it seems clear that well planned and high-quality video content can be used sparingly to a very powerful extent on websites.We expect to see this trend continue and for those forward thinking companies that use this technique wisely to see an engagement lift.
Here are a few key items to keep in mind when planning to use video as a background in your website:
Motion –It’s obvious of course but video is all about motion. Think about how you can best use it to your advantage.
Timeline -Video has a start and finish, you have to consider where things start and end.*
Story – There is an option to tell a visual story, you don’t have to, but it’s a powerful tool.*
*Design and Layering *– Consider how video can fit in with other design elements like text, logos, buttons, etc.
*Â Compression – *Once you have your video, make sure you have it compressed in a way that is consistent with the overall feel of your site. If it’s too compressed it just looks bad so shorter is better and sparing motion can be your friend in compression-land.
As we continue to explore and develop video for our new website, we will be excited to share what we learn here. Please do the same and feel free to ask questions, we’ll answer if we can.
I hope this gives you some insight on how you can prepare to use video for your company’s growth. If you want some more helpful perspective, check out our complimentary downloadable guide outlining 5 ways you can use video to help your organization grow, complete with case studies and examples!
Hungry for even more insight? Download our free Online Video Marketing Guide: Learn How to Promote your Organization with Video (Free Download)