How to Embed YouTube Video in HTML without IFrame

There are many ways you can embed a YouTube video in a web page without IFrame. Although, the iframe is the recommended method for YouTube embeds, if however, you do not want to use iframes, you can use the HTML5 <embed> element or the <object> element to embed YouTube videos.

Embed YouTube Video in HTML with out iFrame

Note: You can embed your favorite YouTube videos on a web page using YouTube IFrame Player API 💡. It is one of my favorite methods to embed videos.

Embed YouTube Video using <object> Element

One of the simplest methods to embed a YouTube video in a web page without iframe is by embedding the video using the HTML <object> tag. Simply add the URL of the video to the <object> element's data property and set few other properties like, the width, height, and you are ready to go. See the below example

<body>
    <object data='https://www.youtube.com/embed/nfk6sCzRTbM' 
        width='560px' height='315px'>
    </object>
</body>

Try it

Browser Support:
Chrome 39.0 - Yes | Firefox 34.0 - Yes | Internet Explorer 10 - Yes | Edge - Yes | Safari - Yes

The <object> element, in the above example, represents an external source. It’s a container. The source can be an image, URL, a plug-in application etc. Here, it’s the video URL (the address of the YouTube video), which I have provided to the element using the data attribute. In-addition, I have used the width and height attributes.

Embed YouTube Video using <embed> Element

The <embed> element allows you to embed an external video URL. For example,

<embed src="https://www.youtube.com/embed/nfk6sCzRTbM?autoplay=1"
    width="640" height="480" title="Everytime You Go Away - Paul Young"
        type="application/x-shockwave-flash">

Try it

Browser Support:
Chrome 39.0 - Yes | Firefox 34.0 - Yes | Internet Explorer 10 - Yes | Edge - Yes | Safari - Yes

The src attribute is where you will provide the YouTube video URL. The type attribute has the MIME type, or the type of plug-in it requires to run the video. You must have Adobe Flash Player installed in your computer to see the video.

The video URL has a querystring named autuoplay whose value is 1. Set it to 0 if you do not want to auto-play the video.

Note: You must add the "title" attribute, as it helps readers to understand what is contains. Since, the videos might take some time to load and run.

Now, in case you do not have Adobe Flash installed, you can remove the type attribute and see the video. Like this...

<body>
    <embed src="https://www.youtube.com/embed/nfk6sCzRTbM?autoplay=1"
        width="560" height="315" title="Everytime You Go Away - Paul Young">
</body>

Try it

Conclusion

There are plenty of options for you to embed your favorite YouTube video on a web page without using iframe. However, I would still recommend using the iframe method like the YouTube IFrame Player API, since it is designed specifically to run YouTube videos efficiently and has many useful features such as, autoplay, more controls, you can loop the video, mute sound and run video automatically and many more.

Do not rely completely on <embed> element, since many modern browsers have "deprecated" support for a plug-in.

← PreviousNext →