Section 16.3. Video Clips | Creating Web Sites: The Missing Manual

16.3. Video Clips

Video clips haven't quite taken off, but with the recent wave of digital cameras that shoot movies, video cell phones, and other video gadgets, interest is growing. Family members , tourists, and adventurers all regularly keep in touch by posting video clips, and the blogging community (see Chapter 17) is getting excited, too. Bloggers are in the midst of coining a new word for Web sites that feature regular video postings. (Current candidates include "videoblogs," "vidblogs," "vogs," and "vlogs;" check out http://videoblogging-universe.com for some neat samples.)

Surprisingly, you can pop a video into your Web page using the exact same techniques you used with digital audio. That means you can link to a video so that it opens up in another browser window:

 Click to download or open my home movie <a href="ouch.mpg">Ouch, That Hurts</a>.

Or, you can use the <embed> tag to place a video window right inside your Web page.

 <embed src="ouch.mpg" autoplay="false">

If you use the <embed> tag, make sure you turn off the autoplay behavior. Otherwise, surfers with feeble dial-up connections will see their Web pages slow to a crawl while your video downloads.

The video window shows up wherever you place the <embed> tag (see Figure 16-5).

Figure 16-5. You can add a video window to your Web pages almost as easily as adding basic audio playback controls. If you don't specify a fixed size , the video window automatically adjusts to the dimensions of your video.

If this seems too easy to be true, that's because it is. There are two stumbling blocks that you'll encounter when using video in a Web page. The first challenge is getting the video in the first place. Not just any video will workyou need a highly compressed format that won't choke your visitors ' browsers.

The second problem is the fact that it takes a while to download a video file. When you use the <embed> tag, your video won't start playing until it's completely downloaded. Internet techies found a way around this unbearable wait, by inventing streaming video (see Section 16.3.2). Their solution works great, but it requires special software on the Web server, which most budget Web hosting companies won't provide.

Note: Modern media players can perform streaming on the Web browser's computer with certain file types. For example, both QuickTime Player (with .MOV files) and Windows Media Player (with .ASF files) can start playing audio before it's completely downloaded. This technique is called a progressive download , and it doesn't require special Web server software.

16.3.1. Creating Your Own Movies

Putting personal video on a Web site is a task meant for ambitious multimedia mavens. The key stumbling block is the sheer size of your files when you start dealing with digital video.

For example, consider a popular MiniDV camcorder, which stores an hour of video on a single tape. You can download that video to your computerbut only if you have a spare 13 gigabytes handy! The ugly truth is that every second of raw, high-quality video chews through a sizeable 3.5 megabytes of space. Not only is that enough to take a bite out of any Web master's Web space and bandwidth allocation, it's too big for even the speediest surfers to download.

What can you do to make a respectable Web video? You can always use someone else's Web-ready video (or just pay a video editing company lots of money to trim yours down to Web proportions ). Assuming that's not what you want, you have two choices.

Record at a lower quality . In some cases, you may have the option to record your video using lower quality settings. Some video cameras allow you to record lower-quality video just for the purpose of putting it on a Web site. Usually, this video gets stored on a memory card instead of a tape. Cell phones, tiny computer spy cams, and digital cameras all create low-quality movies, letting you dodge the conversion headaches and enable you to send your video straight to your Web site. In fact, some video fans find the best solution is to have two types of recording devicesone for ordinary home movies and one for lower-quality Web movies.
Lower the quality afterwards . More commonly, you'll need to start with your high-quality video and go through a long process of re-encoding to convert it to a size that's more suitable for the Web. In order to do this, you'll need a video editing program. Video cameras generally include some sort of tool to help you out, although you may want to pony up for more powerful software. Two popular choices are iMovie (for the Mac) and Windows Movie Maker (which is included with Windows XP).

Note: For full details on how to operate Windows Movie Maker, check out Windows XP Home Edition: The Missing Manual . If you're using iMovie, take a look at iMovie HD & iDVD: The Missing Manual . You'll also find some great articles on Web video preparation at www.internetvideomag.com.

Here are the basic steps you need to follow to get your video ready for the Web:

First, film your movie .

Video gurus are careful to film their video in a way that makes it easier to compress and introduces less distortion. For example, if you keep camera movements smooth and gradual, and don't film complex patterns, your compressed video will be smaller and look better.
Fire up the video capture program that was included with your video camera. Use this program to download your movie to your computer's hard drive .

Typically, this step involves connecting your camera to your computer using a FireWire cable. (USB cables need not applythey're just not fast enough to keep up with huge chunks of raw video data.)
Now you need to use a video editing program to snip out the part you're interested in posting to your site .

Depending on the program you're using, you might use this moment to add music or special effects.
Next , you need to re-encode just that piece of video in a highly compressed format. If all the format information in your program sounds like gobbledy-gook, look for an option that clearly says "Web video" when you save your clip .

Technically, you're making three choices in this stepthe video format (the algorithm used to encode the video), the dimensions of the playback window (Web pages usually fall somewhere between 176 x 144 to 320 x 240 pixels), and the quality (as with JPEGs, the greater the compression, the more detail you lose in the picture).

Tip: There are a wide range of competing Web video formats, but the most common is MPEG-4. Just to make life more interesting, MPEG-4 has all kinds of quality settings, so you can use it to create DVD-quality movies or Web-friendly video clips. If in doubt, double check the final file size of the movie. If you can get 60 seconds of video into a file that's one megabyte on your hard drive, you're doing well.

Re-encoding video is a time-consuming operationeven the speediest computer may take five times as long as the length of the original clip to re-encode the video. The good news is that at the end of the process, you'll have a more manageable Web-ready video filesay, two megabytes for a full 90-second clip.

Tip: Need more space for your video files? Even Web- sized videos can consume more Web server space and bandwidth than you have. Consider using a free video hosting service, which lets you put your videos on another server. The disadvantage is that if that Web server is slow or buggy , your videos won't work as well. There's a good list of options at www.internetvideomag.com/ProductReviews/Services/FreeVideoHosting102.htm.

16.3.2. Streaming Media

Streaming video is designed to take the pain out of video playback on the Web. The key idea is that instead of sending a video file in one large piece, the Web server sends small chunks to the browser as they're needed. Modern computers, which are quite adept at doing two things at once, simultaneously play the current chunk while requesting the next one. The only drawback is that streaming video can sometimes bog down a bit ( especially if the viewer's got a pokey Internet connection); in that case, the video will pause briefly until the next chunk downloads.

On the whole, streaming video is much more satisfying than downloading the whole enchilada first. Some Web mavens also like streaming video because it makes it more difficult (although not impossible ) for the viewer to save a copy of the video on their own computer.

In order to use streaming video, the browser and the Web server need to enter into a more detailed conversation than usual. Rather than the standard "Give me this file" instruction, a browser needs to ask, "Can you give me a piece of that data?" and, when appropriate, "I'm ready for some more." This requires special software on the Web server. You can ask your Web hosting company if they provide this feature. If they don't (or you're unwilling to pay the extra price), you do have another option. Recently, free streaming servers have started to crop up on the Web. They let you store your video on their Web servers. And because they have the streaming software, you can stream the video through your Web pages. Right now these services are still pretty unreliable, but check out www.pixparty.com if you're interested in giving it a whirl.