HTML5 will be the new standard for HTML. The previous version of HTML, HTML 4.01, came in 1999. The web has changed a lot since then. HTML5 is still a work in progress. However, the major browsers support many of the new HTML5 elements and APIs.
According to the New York Times, “Engineers say the [HTML5] technology will make it possible to write web applications, accessed with a browser, that are as visually rich and lively as the so-called native applications that are now designed to run on a specific device, like an iPad or an Android-based tablet.”
HTML5 features such as Canvas, local storage and Web Workers enable developers to leverage the browser in ways earlier technology did not allow. Opera Software has been viewed as a leader in implementing HTML5 technology in its browser.
HTML5’s local storage capability enables users to work in a browser when a connection drops, and the Web Workers technology makes applications responsive by pushing long-running tasks to the background.
Google’s Chrome browser has some HTML5 capabilities, such as video tags. Thus far, Google Chrome, Apple Safari, Opera and Firefox support HTML5 video. However, Opera and Firefox do not support the proprietary h.264 codec used for video players such as those from YouTube and Vimeo. Meanwhile, Microsoft’s Internet Explorer does not yet support HTML5 video. However, IE users can take advantage of HTML5 video by installing Google’s Chrome Frame open-source plug-in.
Microsoft has begun implementing parts of HTML5 in Internet Explorer 8. The software giant is adding such HTML5 features as local storage, AJAX navigation and mutable DOM prototypes
YouTube and Vimeo has announced support for HTML5 video.
HTML5’s Web Sockets API enables two-way communication with a server so developers can implement games, chatting, remote controls and more.
How Did HTML5 Get Started?
HTML5 is a cooperation between the World Wide Web Consortium (W3C) and the Web Hypertext Application Technology Working Group (WHATWG).
WHATWG was working with web forms and applications, and W3C was working with XHTML 2.0. In 2006, they decided to cooperate and create a new version of HTML.
Some rules for HTML5 were established:
- New features should be based on HTML, CSS, DOM, and JavaScript
- Reduce the need for external plugins (like Flash)
- Better error handling
- More markup to replace scripting
- HTML5 should be device independent
- The development process should be visible to the public
HTML5 – New Features
Some of the most interesting new features in HTML5:
- The <canvas> element for 2D drawing
- The <video> and <audio> elements for media playback
- Support for local storage
- New content-specific elements, like <article>, <footer>, <header>, <nav>, <section>
- New form controls, like calendar, date, time, email, url, search
Browser Support for HTML5
HTML5 is not yet an official standard, and no browsers have full HTML5 support.
But all major browsers (Safari, Chrome, Firefox, Opera, Internet Explorer) continue to add new HTML5 features to their latest versions.
All the major browser vendors—Mozilla, Opera, Microsoft, Apple and Google—are involved in shaping the HTML5 spec and are implementing support for it, despite the spec not being finalized
HTML5 New Semantic/Structural Elements for Your website
HTML5 offers new elements for better structure:
Tag | Description |
---|---|
<article> | Defines an article |
<aside> | Defines content aside from the page content |
<bdi> | Isolates a part of text that might be formatted in a different direction from other text outside it |
<command> | Defines a command button that a user can invoke |
<details> | Defines additional details that the user can view or hide |
<summary> | Defines a visible heading for a <details> element |
<figure> | Specifies self-contained content, like illustrations, diagrams, photos, code listings, etc. |
<figcaption> | Defines a caption for a <figure> element |
<footer> | Defines a footer for a document or section |
<header> | Defines a header for a document or section |
<hgroup> | Groups a set of <h1> to <h6> elements when a heading has multiple levels |
<mark> | Defines marked/highlighted text |
<meter> | Defines a scalar measurement within a known range (a gauge) |
<nav> | Defines navigation links |
<progress> | Represents the progress of a task |
<ruby> | Defines a ruby annotation (for East Asian typography) |
<rt> | Defines an explanation/pronunciation of characters (for East Asian typography) |
<rp> | Defines what to show in browsers that do not support ruby annotations |
<section> | Defines a section in a document |
<time> | Defines a date/time |
<wbr> | Defines a possible line-break |
HTML5 New Media Elements for website
HTML5 offers new elements for media content:
Tag | Description |
---|---|
<audio> | Defines sound content |
<video> | Defines a video or movie |
<source> | Defines multiple media resources for <video> and <audio> |
<embed> | Defines a container for an external application or interactive content (a plug-in) |
<track> | Defines text tracks for <video> and <audio> |
The new <canvas> Element
Tag | Description |
---|---|
<canvas> | Used to draw graphics, on the fly, via scripting (usually JavaScript) |
New Form Elements
HTML5 offers new form elements, for more functionality:
Tag | Description |
---|---|
<datalist> | Specifies a list of pre-defined options for input controls |
<keygen> | Defines a key-pair generator field (for forms) |
<output> | Defines the result of a calculation |
Removed Elements
The following HTML 4.01 elements are removed from HTML5:
- <acronym>
- <applet>
- <basefont>
- <big>
- <center>
- <dir>
- <font>
- <frame>
- <frameset>
- <noframes>
- <strike>
- <tt>
0 Comments.