Home » Html » Use of Iframe or Object tag to embed web pages in another

Use of Iframe or Object tag to embed web pages in another

Posted by: admin November 29, 2017 Leave a comment


In a web-based system I maintain at work that recently went live, it makes an Object element to embed a second web page within the main web page. (Effectively the main web page contains the menu and header, and the main application pages are in the object)

For example

<object id="contentarea" standby="loading data, please wait..."  
    title="loading data, please wait..." width="100%" height="53%" 
    type="text/html" data="MainPage.aspx"></object>

Older versions of this application use an IFRAME to do this though. I have found that by using the object tag the embedded web page behaves differently to when it was previously hosted in an IFRAME. In IE, for example, the tool tips don’t seen to work (I will post a separate question about this!), and it looks like the embedded page cannot access the parent page in script, although it can if it was an IFRAME.

I am told the reason for favouring the object tag over the IFRAME is that the IFRAME is being deprecated and so cannot be relied on for future versions of browsers. Is this true though? Is it preferable to use the Object tag over the Iframe to embed web pages? Or is it likely that the IFRAME will be well-supported into the future (long after I am old and grey, and past the useful life of the application I maintain)?


The IFRAME element is part of the upcoming HTML5 standard. Also, HTML5 is developed by the major browser vendors out there (Mozilla, Opera, Safari, IE), that basically makes a guarantee that we will have an IFRAME element in the foreseeable future. Some of them have support for some HTML5 elements already, like AUDIO and VIDEO and some new JavaScript APIs.

It’s also true that the OBJECT element is in the draft, but that’s because IFRAME and OBJECT will have different purposes. IFRAMES are mainly designed for sandboxing web applications.

So, my advise is to use IFRAME instead of OBJECT.


IFRAMEs are not part of the XHTML 1.0 Strict DTD. They are totally valid in in HTML 4 and XHTML 1.0 Transitional, I believe. For these reasons alone, IFRAME will continue to be supported for a long time.

A lot of bookmarklets and analytics code still use IFRAMEs.


If you are embedding a HTML page, here is one noticeable difference between iframe and object:

  • with iframe updating src will change the browser history (adding a new entry)
  • with object updating data will not change the browser history

Also it seems like drag&drop does not work if the page is embedded in the object tag, but works in the iframe tag. I noticed it personally using react-draggable, and I can see someone had the same issue (https://stackoverflow.com/questions/31807848/replacing-iframe-with-object-tag-drag-and-drop-not-working)


Although the W3C specs may indicate that the IFRAME tag is being deprecated, (in XHTML at least anyway), browser developers do not necessarily follow exactly what those specs say (IE6 anyone?)

As use of IFRAMEs is so prevalent at the moment, and the W3C can’t seem to decide if they are part of the future or not (HTML 4.01 vs XHTML), I am pretty sure they are the safer implementation to use for almost every browser.