What are new features introduced in HTML5?
HTML5 is a markup language used for structuring and presenting content on the World Wide Web. It is the fifth and current version of the HTML standard.
It was published in October 2014 by the World Wide Web Consortium (W3C) to improve the language with support for the latest multimedia, while keeping it easily readable by humans—and consistently understood by computers and devices such as web browsers, parsers, etc. HTML5 is intended to subsume not only HTML 4, but also XHTML 1.
HTML5 introduced a lot of new semantic, graphic, multimedia elements; element attributes; new APIs, some elements were removed. Here is the list of most significant changes.
General differences of HTML5 and HTML4
1. Simplified and clear syntax
The syntax in HTML5 is more clear and simple as compared to HTML4. One example of this is the DOCTYPE element. In HTML4 the DOCTYPE declaration was too messy and lengthy and used to refer an external source. However in HTML5 DOCTYPE element has been made extremely simple:
2. Multimedia elements
HTML5 contains built in support for integrated multimedia files into web page via video and audio tags. Previously, in HTML4, the multimedia content was integrated in web pages via third party plugins such as Silverlight and Flash.
3. Accessing user geographical location
Previously in HTML4, it was a complicated task to get the geographical locations of the visitors visiting the site. On the other hand, in HTML5 is extremely easy to get the user location. HTML5’s JS GeoLocation API can be leveraged to identify the location of the user accessing the website.
4. Client side storage
5. Client server communication
In HTML4 the communication between the client and server was done through streaming and long polling, since there are no web sockets available in HTML4. On the contrary, HTML5 contains Web Sockets that allow full duplex communication between clients and servers.
Here is only a part of new elements that have been introduced:
sectionrepresents a generic document or application section. It can be used together with the h1, h2, h3, h4, h5, and h6 elements to indicate the document structure.
articlerepresents an independent piece of content of a document, such as a blog entry or newspaper article.
asiderepresents a piece of content that is only slightly related to the rest of the page.
hgrouprepresents the header of a section.
headerrepresents a group of introductory or navigational aids.
footerrepresents a footer for a section and can contain information about the author, copyright information, etc.
navrepresents a section of the document intended for navigation.
figurerepresents a piece of self-contained flow content, typically referenced as a single unit from the main flow of the document.
audiofor multimedia content. Both provide an API so application authors can script their own user interface, but there is also a way to trigger a user interface provided by the user agent. Source elements are used together with these elements if there are multiple streams available of different types.
embedis used for plugin content.
markrepresents a run of text in one document marked or highlighted for reference purposes, due to its relevance in another context.
progressrepresents a completion of a task, such as downloading or when performing a series of expensive operations.
meterrepresents a measurement, such as disk usage.
timerepresents a date and/or time.
canvasis used for rendering dynamic bitmap graphics on the fly, such as graphs or games.
type attribute now has the following new values:
meta element has a
charset attribute now as this was already widely supported and provides a nice way to specify the character encoding for the document.
autofocus attribute can be specified on the input (except when the
type attribute is
button elements. It provides a declarative way to focus a form control during page load.
placeholder attribute can be specified on the
textarea elements. It represents a hint intended to aid the user with data entry.
required attribute applies to
input (except when the type attribute is
image or some button type such as
textarea. It indicates that the user has to fill in a value in order to submit the form.
script element has a new attribute called async that influences script loading and execution.
dropzone attributes can be used together with the new drag & drop API.
These only some of the new attributes in HTML5.
There are also many changes to existing elements and attributes. It is important to note, that due to ability to propose and contribute new features to new specification of third-parties, there are some features which are not approved by WC3 consortium, or might be declared/removed from final specification in future.
- HTML5 was introduces to replace HTML4 and XHTML 1. It was published in October 2014.
- HTML5 introduced a lot of new semantic, graphic, multimedia elements; element attributes; new APIs, some elements were removed.
- Semantic markup was one of the main focuses of the new specification.
- Major new features and APIs: multimedia elements such as
audio, GeoLocation API, Web Storage API, Web Sockets API, JS Web Worker API, Canvas, Drag-n-Drop.
- It is important to note, that due to ability to propose and contribute new features to new specification of third-parties, there are some features which are not approved by WC3 consortium, or might be declared/removed from final specification in future.