Differences of File in HTML5 and HTML4 - html

I want to know the differences of File API in html5 and previous version.

The main difference is -
HTML5 has File API and HTML4 does not have any File api.

The File API is an independent specification. Support in browsers is irrespective of the version of HTML being used (although might be influenced by Doctype switching between Quirks/Standards modes).
I believe it started out life as part of HTML 5, but is not in the current version of it and will not be included in the final version of it. It was never a part of the HTML 4 specification.

Related

Liferay theme - html5

I am developing a portlet for Liferay (v6.0.5, runs on JBoss). I would like to use HTML5 (canvas to be more specific) in this portlet. How can I find, if the theme I am currently using on the portal does support HTML5?
I know that themes with HTML5 support exist and I have to choose the right one? Or am I wrong and all themes automatically support HTML5?
Thanks for tips!
All the Liferay themes automatically support html5, its the browsers you should be worried about.
There is nothing special to make a theme HTML5 since its just a matter of doctype change (<!DOCTYPE html>) to make the browser know that you are rendering HTML5 stuff. So you can check the doctype in portal-normal.vm and other template files to see if the theme is HTML5.
But for scripting support I doubt if alloy-ui (Liferay's default library) provides any additional HTML5 specific modules for manipulating canvas, file-api etc.

will <frameset> work with HTML5?

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.

What are the best guides to HTML5 & CSS3 support in web browsers?

Do you know about useful resources about HTML5 & CSS3?
UPDATE:
I'm (and i think a lot of people) looking for practical information how and to what extent is it possible to use these unfinished technologies. I found one very useful resource:
http://caniuse.com/
For the gritty details when the metal needs to hit the road, go to the sources to lookup functions, objects, etc and get the latest info on them and their usage.
Implemented standards
Firefox
Mozilla Developer Network for Gecko engine
# https://developer.mozilla.org/en#Documentation
Internet Explorer
HTML, CSS, DOM object model
# http://msdn.microsoft.com/en-us/library/aa737439(v=MSDN.10).aspx
JScript (aka JavaScript)
# http://msdn.microsoft.com/en-us/library/hbxc2t98.aspx
Unsure about Webkit official dev docs (Chrome. Safari) but you can often use the MDC/Gecko docs because they are usually close in standards. (<< Update: Another answer provides Webkit info.)
Standards Sources
Standards also act as a good measuring rod for expected behaviour if you face a bug while developing.
This slide show is about HTML 5 standard technologies and must be viewed in HTML 5 (e..g Google Chrome works well).
HTML 5 (W3C):
http://dev.w3.org/html5/spec/Overview.html
CSS 3 (W3C):
http://www.w3.org/TR/css3-roadmap/
HTML 5 Web Sockets (W3C): http://dev.w3.org/html5/websockets/
WebGL: http://www.khronos.org/webgl/
Web SQL Database: http://dev.w3.org/html5/webdatabase/
Application Cache API for offline apps (W3C): http://dev.w3.org/html5/spec/Overview.html#offline
Web Workers for background processes (W3C): http://dev.w3.org/html5/workers/
Web Sockets for 2-way communication with host (W3C): http://dev.w3.org/html5/websockets/
Drag and Drop (W3C): http://dev.w3.org/html5/spec/Overview.html#dnd
Geolocation to pinpoint yourself (W3C): http://dev.w3.org/geo/api/spec-source.html
Web Storage to store more data in the browser (W3C): http://dev.w3.org/html5/webstorage/
Canvas Tag for on-the-fly visuals: http://dev.w3.org/html5/spec/Overview.html#the-canvas-element
and many more .... There are many parts.
A Strategy to find more info ...
See this great slide show (using an HTML 5 capable browser - it'll get you in the mood) for the overview...
Then look up the spec you want at the W3C.org website or Google its contents using a search terms to target the site like "site:www.w3.org "html 5" YourTerm" for example the Google Canvas tag.
As far as HTML5 goes, I frequently check out:
https://html5doctor.com
Dive Into HTML5
And yes, the HTML5 spec, which I recently visited to find out more about supported input types and form field attributes in HTML5:
https://w3c.github.io/html/
https://w3c.github.io/html/sec-forms.html#sec-forms
As for CSS3, I often find myself at:
http://www.css3.info/
Safari reference material, which may or may not be HTML5/CSS3 specific:
https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariCSSRef/Introduction.html
https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariHTMLRef/Introduction.html
Believe it or not, wikipedia: comparison of layout engines CSS3 and HTML5 is actually pretty good at very detailed comparisons. Modernizr is very coarse grained.
You can also take a look at HTML5 Laboratory which is my own HTML5 experiment site.
As mentioned above, HTML5 Doctor and Dive into HTML5 are two great resources.

How can I use HTML 5?

I want to get ready for HTML 5 and start playing around with it. Do I need to install it or something before using it? How does it work? I'm currently on shared hosting.
HTML5 isn't a server-side technology. All you need to get started is a browser that supports HTML5.
See these pages for HTML5 support in different layout engines:
http://wiki.whatwg.org/wiki/Implementations_in_Web_browsers
http://en.wikipedia.org/wiki/Comparison_of_layout_engines_(HTML5)
You don't "install" HTML5 - did you install XHTML 1.1, or HTML 4.x? (no is the answer I'm looking for). Certain browsers support HTML 5 and some don't.
HTML 5 Browser Support/Engines: Comparison of layout engines (HTML5)
HTML 5 Working Draft:HTML 5 Working Draft
You don't need to install anything. Just a texteditor and a webserver is enough. You only need to hope that the webpage visitors uses a webbrowser which supports HTML5 fully. Right now, there aren't many of them out.
It is the fifth revision of the HTML standard. HTML5 is also a potential candidate for cross-platform mobile applications.On 18 January 2011, the W3C introduced a logo to represent the use of or interest in HTML5.
<!DOCTYPE html> is the doctype of HTML 5, add it on the top of your document.
Even if you didn't add the doctype, HTML 5 tags still work (if supported).
No.
Like all HTML it has nothing to do with hosting (unlike PHP etc).
Just create your own page with HTML5 elements and upload it to your hosting. Then you can view the page in you browser, if the browser supports HTML5 of course.

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

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.