So, what is a background web video?
It is fair to say that a background video is one more tool to make your website distinctive among the others in the age of information overload. It is by no means a guarantee that each visitor will stay at you website longer and make a purchase or sign in. However, background web video, the same as an exquisite design and eye-catching visual representation of the website, will add to its positive impact. Other words, a background video is no more just a design element or a fancy, it is now an excellent marketing solution aimed at attracting clients. You should already know that motion graphics of any kind engage a viewer more than any static image. If the animation you use is devoted to your product or service this would definitely serve as a great marketing trick!
Using video tag you may easily integrate an animated video to your website. However, as you know, video tag supports several video formats. How to choose the better video format? This is the issue to consider. As usual, a background web video does not have audio track. Thus, let leave an audio issue aside and move to video formats. Video tag may use one video file represented with the src attribute. Multiple media resources uses source nested tag.
Anyway, there are three widely used web video formats available for you:
• OGG Theora is a free and open video compression format;
• H.264 (MPEG-4) is the most popular and widely spread format;
• WebM is open, royalty-free, media file format designed for the web.
Despite video tag supports each of the above video formats, browser compatibility is a challenge. We suppose to use several formats at a time. For example, almost all the browsers support MPEG-4, while webm is only compatible with Chrome, FireFox, Opera and partly with Android Browser. The same is valid for OGG Theora. We may only guess about the reasons, so we will not go deeper into details. Based on the foregoing, it is better to use several formats.
Useful tip: If you know for sure which browser your clients use, you may reduce the range of video formats up to one or two. Anyway, we recommend using MPEG-4 because it has proven to be the most popular.
In common cases video tag of an animated background video may be as follows:
<source src="movie.webm" type='video/webm; codecs="vp8, vorbis"' />
<source src="movie.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
<source src="movie.ogv" type='video/ogg; codecs="theora, vorbis"' />
<video>
Alexander Parovoy
As you may see, using background video is easy. Just follow our tips:
• Don’t forget looping your video background;
• Don’t make overlong video. Mind that the longer footage you make the larger video you get;
• Make a simple video. It is always better to create simple animation than to compromise quality.
• Create theme-based video. For example, you may create simple commercial for your product.