How to Embed a QuickTime Movie in a Web Page or Blog Post
Screencasts have become the rage for authors and trainers trying to share information on the Web with readers. Recently, I decided to try my hand at creating and publishing these QuickTime movies. Although you might think that the hardest part is getting the content recorded, for me the bigger problem was putting the file online in a way that made it easy for my blog’s readers to view the content when they wanted it—not have it display automatically. Although I’d done this before with success, I’d simply forgotten how. (Age plays cruel jokes on people.)
This article is written not just for you, but for me. I’ve researched and experimented with the technique. Now I’m putting it down in writing so I don’t forget again.
I should mention here that if you’re interested in video podcasting, I’ve already written up instructions for doing that. You can find those instructions at http://www.peachpit.com/articles/article.aspx?p=683807. This article tackles embedding QuickTime content on a Web page or post—not linking to it.
Step 1: Create the Movie Content
These instructions work with all kinds of QuickTime movie content—not just screencasts. So you can use your camcorder to capture video, massage it in iMovie, and save it out as a QuickTime movie. Or you can create a QuickTime VR panorama of still images. Or use your iSight or other WebCam to create a timelapse movie (http://www.peachpit.com/articles/article.aspx?p=1014973). Or do what I did: use a little software program called IShowU (available from Shiny White Box: http://www.shinywhitebox.com/) to record your Mac’s screen as you narrate a task.
However you start, you want to end up with a QuickTime movie sized to fit in the Web page you want to place it in. Size is important for two reasons:
- Smaller movies generally have smaller files. That means they’ll download more quickly from your site’s server to the people who want to see them. This is convenient for them and also reduces your bandwidth usage, which could save you money if the movie gets popular.
- If the movie’s dimensions are wider than the space allotted for content on the Web page, the movie simply won’t fit on the page. The result can be unattractive, to say the least.
My movie’s dimensions were 307 x 230. (That’s roughly 40% of the size I created it at: 1024 x 768.) These dimensions are important, so be sure you know them. If you don’t know them, you can find them in the Info window for the QuickTime movie file. Select the file in the Finder, choose File > Get info, and display the More Info area. Figure 1 shows the Info window for my little movie.
Figure 1 The Info window for a QuickTime movie provides lots of information, including the dimensions, duration, and file size.
And if you’re thinking that it might be a lot easier to simply upload the movie to YouTube and then embed a link to it; well, that is an option. But if you have quality video to share, YouTube’s compression schemes are very likely to make it a blurry mess. (YouTube is great for sharing video of your office Christmas party, but not well suited to screencasts.)