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.
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)
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.
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.
Related
Is it possible to include iframe with HTML5 format inside HTML4 document?
Then, will HTML5 features work as expected?
Or, will root document restrict the HTML5 features?
The doctype declaration will not restrict the elements if the browser needs to support the element.
https://html5test.com/results/desktop.html
Source: HTML 4 Iframe with HTML5 content
So, answering your questions:
Yes it is possible to do this.
Yes all features will work, if the browser supports it.
No there will be no restrictions because of the document.
Normally, it will be. Frame rendering is independent of the parent page, so I think you will be able to load almost any page, even HTML5, in a frame on a root page with an older !DOCTYPE.
There's a section on my site where I display data from another site, using:
<embed src="URL"></embed>
I recently discovered that this works fine for most people, but that Firefox users get an error telling them they need to install a plugin. I searched around for a solution and people seemed to find that specifying the MIME type worked:
<embed type="text/html" src="URL"></embed>
But this isn't working. I can switch to iFrames, but I dislike how they display the information. Any other suggestions?
Per spec, embed elements are only handled via plug-ins or an SVG renderer (and in the latter case behave just like iframe).
You can do <object data="URL"></object>, but of course that will also behave like iframe...
I've been having the same issue with an html5 game. It appears that Firefox doesn't support if you want to embed an external html file. This tag should only be used for plugins.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/embed
To embed an external html file into another page in Firefox you have to use iframe or object tags instead. For the interactive nature of my external page I used iframe and it worked in IE / Chrome and FF, I had to make the margins larger than the game itself.
Update: This question is no longer valid. See comment below.
YouTube embedding is done using iframes nowadays.
HTML5 introduces the seamless attribute, that not only should affect presentation, but make the integration with the host page tighter. (It should not be announced to screen readers as a separate document.)
HTML5 introduces the sandbox attribute, that restricts the iframe and thus improves security.
In a world where browser support for these 2 attributes is complete, will they benefit or in any way adversely affect the page, when embedding YouTube videos? (Yes, the last half of the question is primarily about seamless.)
I am thinking about recommending my students to always use these 2 attributes for YouTube videos and benefit automatically as browser support becomes available.
I'll focus on just discussing the sandbox attribute.
To play YouTube videos in a sandbox you need to do the following:
Add sandbox="allow-scripts allow-same-origin"
Add ?html5=1 to the video URL
A problem with #1 is that Flash will not be loaded; whether Flash is required depends on a few things, such as the end-user's browser, their YouTube settings or when a video is simply not available as an HTML5 video (this is worsened by #2).
Another (more serious) problem with #1 is that the combination of allow-scripts and allow-same-origin effectively removes any security benefit you would have otherwise enjoyed.
Conclusion
Forget about using the sandbox attribute for YouTube video embedding.
Further reading
HTML5 Sandbox and some notes
Error playing embedded youtube video in a sandboxed iframe
No, fullscreen does not seem to work with both attributes enabled, if you are in the HTML5 beta check an example here:
http://bcmoney-mobiletv.com/view/2133/monty-python-tax-sketch/
However, when I leave the HTML5 beta program it plays back in the standard YouTube Flash player, which ignores those iFrame attributes completely.
So, it really depends what your goals are. If you want added security and an experience that feels more like an in-page web video that is controlled by your page, go ahead and use those attributes, however, if you want to give the user a full range of controls and options, leave off sandbox and/or seamless.
I have these webapplications build in old style HTML, including [framesets] to speed up the GUI of the administration.
Its not accessable by SEO etc. so thats not the issue here, it was all based on speed and minimizing reload at the time.
Now we would like to transform these applications and have begun to investigate HTML5 for the purpose.
Ofcause there is AJAX and db-storage etc. to speed up the interface with the new standards, but our question is really:
is IFRAMES and FRAMESETS going to be removed from the HTML5 standard or will it be "allowed" but "less appriciated" ?
Does anyone know whats going to happend?
The frameset and frame elements are obsolete in HTML5.
See http://www.w3.org/TR/html5/obsolete.html#non-conforming-features
The iframe element is valid.
Note that HTML5 still requires browsers to support frames and framesets as per Oded's link, but they are not valid for authors to use on web pages.
Yes, framesets will work, they are part of the current HTML5 spec.
So is iFrame.
As for your question on will they be deprecated or removed all together?
Frames and framesets should not be used in HTML5 as they have been obsoleted.
when validating a site using w3c validator it tells me the embed tag is not valid markup. So i take it out and it works on safari/chrome but not firefox(3.5.x) but validates fine. Is there something in the object tag i must add in order for firefox to display flash.
A List Apart has a great article on that topic: Flash Satay: Embedding Flash While Supporting Standards.
Read that to understand the general difficulties with embedding flash and to read about different approaches to embed it in valid HTML. And then go and use SWFobject to embed Flash as that is the best way to do it while having both standards support and browser compiliance.
In addition to that you may use the normal Flash Satay method to embed it for people without JavaScript.
embed has never been part of the HTML spec and object should be used. It's been so long since I've touched flash, I hesitate to say more than that which I know.
You should use swfobject. It's valid, although I think I've had the validator trip up on it before (the w3 validator has been known to trip up on stuff like this on occasion).