HTML 5 – Introduction

This is my first post on HTML 5 of a long series of short but good tutorials on HTML 5 which I would keep on posting as I move on. This series of tutorials can have any audience who have a little background about HTML. If you have any queries then you can comment and I would try to help out as soon as I get time.

HTML 5 is very hot topic these days. Everyone is talking about HTML5, so why is HTML5 so famous all of a sudden? Instead of going through the history of HTML5 lets skip to why its important to switch to HTML 5 and what is HTML 5.

What is HTML 5?

HTML 5 is a new version of HTML (Hyper Text Markup Language). In order to move on to HTML5 let me give a little background of what is HTML?

What is HTML?

HTML is Hyper Text Markup Language which is understood by all the browsers and which are responsible to render or display what we see on any web page.

Most of the browsers support HTML 4.01 which is also known as HTML 4 (HTML version 4), its a version before HTML 5. In order to learn more about HTML you can refer to any good online tutorial site.

An example of how HTML code or file looks like.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
   <head><!--This is a content which is used for special purposes like setting title of the page, setting meta data properties of the page. --></head>
   <body>
      <p>This is a content which is displayed into the web page.</p>
   </body>
</html>

Now, lets continue about what all is in HTML5.

HTML 5 – Whats new in HTML?

HTML 5 is a new set of standards for HTML. HTML 5 standards specification is not yet complete its an ongoing process. W3C (World Wide Web Consortium) is an organization which sets standards for the web, so it keep on updating HTML 5 standards. These set of standards are adopted by various browsers in the market i.e. they implement these standards into the browser for supporting HTML5.

Note: HTML5 is not supported by older browsers. It can be made compatible with older browsers by adding some third party JS (JavaScript) libraries.

HTML 5 new features:

  1. Addition of new semantic elements.
  2. Support for audio, video APIs.
  3. Addition of Drawing APIs
  4. Geo-Locations APIs.
  5. Offline application support.
  6. Local Database support.
  7. and many more..

Why HTML 5?

HTML 5 was created with a vision to support all the browsers with minimal development effort for basic necessities which are common these days in every web application i.e. now the developers don’t need to re-invent the wheel.

Major reasons why we should move with HTML 5 are:

  1. Its the future of web.
  2. It provides backward compatibility using various libraries.
  3. Supported on most of the mobile devices as well.
  4. Provides with rich set of APIs and elements which are not provided in earlier version of HTML.
  5. Also, it can be used in APP development as well.

This article was to just give up a head start on what is HTML5. Lets see how a sample HTML5 code looks like.

<!DOCTYPE html>
<html>
   <head><!--This is a content which is used for special purposes like setting title of the page, setting meta data properties of the page. --></head>
  <body>
    <p>This is a content which is displayed into the web page.</p>
  </body>
</html>

If you see the above code its pretty much similar with HTML 4 sample code with the only difference in DOCTYPE. Don’t worry about that it tells the standard which the html follows. As you can see the example is almost similar. This is because HTML5 is backwards compatible. In the future posts we would discuss in more details about the features in HTML5. This is just done to keep this post simple and interesting.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s