How to insert a movie or video into an HTML document

Users can embed a movie into an HTML document using any of the examples below. It is important to realize that before you use the following examples, you should know the movie you are going to be playing, as well as the browsers it will be played on. By default, a browser may not have the necessary plug-ins to view the movie file you choose.

Tip: Hosting your own movies can be expensive because of bandwidth costs. If you dont want to worry about hosting video files and want to gain the attention of a huge audience hosting the video on YouTube and embedding the link on your site is a great idea.

Link to movie files
Basic embed tag
Add movie files using the img tag
Embed tag to play QuickTime movies (.mov)
Type attribute for embed tag to specify plug-in

Link to movie files

The examples below provide different methods to make the video file viewable from the browser window. We also recommend that you create a direct download link to the file, which allows visitors to download the file if the movie won't play in the browser. Below are two examples of direct links for the two video files in this document.

Floppy drive robot

HTML code

<a href="http://www.computerhope.com/issues/floppy2.avi">Floppy drive robot</a>

IBM Linux commercial

HTML code

<a href="http://www.computerhope.com/issues/ibm-linux.mov">IBM Linux commercial</a>

Basic embed tag

Below is code for the most basic method of embedding a file into a web page.

Example HTML code

<embed src="http://www.computerhope.com/issues/floppy2.avi"></embed>

In this example, you're using the embed element to pointing to the source of the movie file you want to play. Keep in mind, this is a very basic example and will not display any warning or point the user to a location to download a plug-in if the video file is not supported.

Example of video

Add movie file using the img tag

If you don't want to use the <embed> tag, you can also include a movie file using the <img> tag, as shown in the example below.

Example HTML code:

<img dynsrc="http://www.computerhope.com/issues/floppy2.avi" start="fileopen">

Example of video

Floppy movie

Embed tag to play QuickTime movies (.MOV)

Apple QuickTime movie files are another popular type of movie on the Internet. Below is a basic example of how to include these files in your web page.

Example HTML code

<embed src="http://www.computerhope.com/issues/ibm-linux.mov" Pluginspage="http://www.apple.com/quicktime/" width="320" height="250" CONTROLLER="true" LOOP="false" AUTOPLAY="false" name="IBM Video"></embed>

In the above embed example, the first portion of the code points to the src (source) of the movie file, which is the movie file itself. Next, the pluginspage is the location of the plug-in if the visitor does not have it installed. The width and height are the actual dimensions of the video file. You may want to increase the height of the video file if you are unable to see the controller. The Controller value can be set to true or false to toggle the displaying of the bottom controls. Loop is a setting for when you want the file to automatically start over when finished. Finally, autoplay tells the browser to start or not to start playing the video file after the page has finished loading.

Example of video

Type attribute for embed tag to specify plug-in

In the embed tag, include the type attribute to specify the MIME type for the video file. Doing so allows you to specify the plug-in needed to play the video in a browser.

Example HTML code

<embed src="http://www.computerhope.com/issues/floppy2.avi" type="video/x-msvideo"></embed>

In the above example, the type attribute is set to video/x-msvideo, which is the MIME type for AVI video files.

To determine the value to assign to the type attribute for other types of video files, check the list of MIME types for video files on the IANA Media Types page.

Additional information

  • See our movie and video definition for further information and related links on this term.