HTML5 – An Introduction

HTML5 is the fifth version and latest standard from W3C. It is not just confined to a mark up language, infact HTML5 is the combination of HTML5 elements, CSS3 style and JavaScript animations. It has many new features which provide not only media support but also enhance support for creating web applications that can interact with the user, user’s local data, and servers, that was not easily possible in past. Because of its such enrich features it has reduced the need of additional plugins.

Another interesting fact is that it helps the designer to create a responsive design by changing multicolumn layout into single column through its media queries(CSS3). So we can say that HTML5 is capable of producing design which is device independent. It gives the same effect either it’s opened on a desktop, tablet, smart phone or a smart TV.

Lets examine some of its latest features:

More specific elements:  While using previous standards of HTML it was observed that each website has some common objects or elements. For example there is a header, menu, main and aside sections, footer etc. HTML5  elements are more specific, means instead of using divs, we can use elements which are named according to their content. these elements include:

<header>    <nav>    <main>   <aside>  <article>   <section>    <footer>

 

Media elements:    It was a tough job to add a video or audio on your web page. It was done with the addition of plugins. But HTML5 makes you feel free to add any audio/video on your web page using its media elements. These elements are simple and easy to use.

<audio>              to add some sound.

<video>              to add some video.

<track>               for <audio> <video>

<source>            to add the source of audio/video

<embed>            to add a container for external applications

 

Forms: An enhancement in defining input types in html forms is also a new feature of html5. In past we were bound to use some typical types of inputs like text. More specific input types are available in html5.

Email    url   search    rel    autocomplete    datalist   datepicker

 

Local Storage: Html5 is more user friendly as it provides an option to store user’s data locally. While filling some form or writing an email if user goes offline its data is not lost any more. It is an improved form of browser cookies which gives you two ways to save your data. One way for secure data(session storage -stores data until the session is not destroyed) and another one for unsecure data(local storage -stores data for an infinte amount of time even after browser is closed or system is restarted).