YouTube is cool, and it's a really easy way to get your videos online. You can even link from your web site to your video on YouTube. But wouldn't it be better if you—not YouTube—controlled how the video displayed? David Karlins shows how to use Dreamweaver to embed a video clip into your own web page, presented with your own customized display skin, and surrounded by your own content.

From the author of

From the author of

Online video has become almost synonymous with YouTube. That’s
simultaneously a good thing, and kind of a shame. It’s a good thing
because now anyone who can make a video can put it online. Give YouTube credit
for breaking through technical and psychological barriers that kept online video
out in the shadows for so long.

But what’s missing from this picture is integrating customized video
into web sites. With Dreamweaver, you can embed a video clip into your own web
page, surrounded by your own content—not YouTube’s. And Dreamweaver
lets you customize the display, the start volume, the player interface, and
often the background color.

Another nice thing about embedding video in your own web page is that you can
use Dreamweaver to embed QuickTime movies, Windows media, and even Real Media
video. (Real Media is a bit more challenging, beyond the scope of what I can
show in this short article.)

Two Kinds of Flash Video: Movies (SWF) and Flash Video (FLV)

There are actually two types of Flash movies, both of which are very widely used to present animation online:

The Flash video format, which presents video, is emerging as a common format that transcends the Mac (QuickTime) or Windows (Windows Media) associations of other video formats. Flash video files have the extension .FLV.

There are many easy ways to convert Windows Media or QuickTime movies to Flash video format. Adobe packages the Adobe Flash Video Encoder with recent versions of Flash (the program used to create Flash movies). When you upload a movie to YouTube, it automatically converts to Flash video, so one easy option for presenting videos at your own web site is to upload them to YouTube, and then embed (and customize) a link to the YouTube video in your own web page. I’ll show you how to do that a little later in this article.

The other type of video that is (confusingly) also generally called "Flash video" is the SWF format, with the file extension .SWF (pronounced "swiff"). SWF files are generated in Flash. This format often is used for embedded animations in a web page—animated banners, icons, and the like. SWF files can include complex programming and interactivity, and whole web sites can be constructed solely as SWF files. For this article, I’ll focus on embedding discrete SWF elements in a web page.

I’ll focus here on how to work with two kinds of Flash video in a Dreamweaver web page. If you’re embedding QuickTime or Windows Media video, you’ll find that you can transpose the process slightly for those video formats.