Video for the Web
If pictures are worth a thousand words, is a video worth a thousand pictures? Assuming your video is running at 24 frames per second, a 42-second video is a thousand pictures. But a video is more than just a series of pictures, it is sound as well. Video uses two of our senses to deliver us information, making it a powerful way to deliver content and is why we are seeing video used more and more on the web. Although it is an effective form of content, video can be complex. This article walks through all the factors that need to be considered when delivering video content through your website and the tools available to help you.
History of Video on the Web
Early websites and browsers were unable to play video natively. Instead, they relied on other applications to deliver and play video within a website. You may be familiar with Micromedia/Adobe’s Flash player which was one of the more popular means of delivering video. While this solution existed, creating videos that played nicely on the web was a challenge. The video had to be small, as your dial-up bandwidth was not conducive to watching video in real time. Additionally, the applications to deliver the video had to be purchased and were cumbersome to configure.
HTML 5 Video Element
Then came the latest web standard (HTML5), which instituted a native video element. This allowed web developers to simply select a video file to play and the browser would play it. No longer was there a need to include other applications to manage and play your video. Some of the features the HTML5 video element boasts are:
- Basic controls such as play/pause, seek, and volume control.
- Fallback formats, where the browser can switch to another video file format if the primary video format is not recognized.
- The ability to easily add subtitle files to the video for better accessibility.
- Can be styled like any other HTML element, making it flexible and adaptive to different sized screens.
- Progressive loading where pieces of the video are sent over time, instead of needing to download the entire video to play.
However, this element does have its limitations. Video files must be complete. This means that the video element will not accept partial video files or a live stream. This is especially true with the MP4 video format that has “keyframes” of important video data throughout the length of the video. The element also does not have the ability to switch video files based on the available bandwidth or have controls for switching videos based on language preference. Lastly, delivering your video through your website uses up a lot of bandwidth. Every user streaming or downloading a video from your website eats from your total bandwidth, slowing down the delivery of content to all your users. Unless you have multiple servers placed nearest your users, video content can slow your website’s response to other users. So how do we overcome these obstacles to make all our videos accessible to all our users?
Feature Rich Web Video
A Much Easier Solution
As you can see, video on your website can be as complex or simple as you would like it to be. Unless you have a need for some special controls or functionality, using an established CDN is your best bet for delivering your videos. Now that you know the technology behind the video, it’s time to get behind the camera.