Complete reference tutorial HTML5 for absolute beginners

Today’s topic is,

Complete reference tutorial HTML5 for absolute beginners

Complete reference tutorial HTML5 - PepFryThis is an introductory section on for Complete reference tutorial HTML5 – following which you will see many tutorials coming in w.r.t HTML5 and CSS3 involved as well.
I’ll go on adding up tutorials on this new beauty. There is a lot to grab out of this technology like HTML animations using HTML5 and CSS3, HTML5 responsive websites and applications, HTML5 powered Games etc.

So, to start with – I’m gonna take you through the very basics – Introduction to HTML5. This simple tutorial will help a lot for Newbies/Beginners, who are just starting off with HTML5.

  •  Definition/Description of HTML5
  •  Difference between HTML4 and HTML5
  •  What’s new in HTML5
  •  Working HTML5 example with few new HTML5 standard Tags/Elements

What is HTML5?

HTML5 is the latest standards for Hyper Text Markup Language. Previous standard that is still in practice is HTML4 or what we call XHTML1.0.

Difference between HTML4 and HTML5

These two standards differ mainly with their Doc-type definition.

HTML4 uses the – <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

HTML5 uses the – <!doctype html>

Where:

1. HTML4 Doc-type says – If this particular Doc-type is defined in the HTML Page, then it is going to parse that particular Page in HTML4 standards. While parsing, the Parser/processor will look out for HTML4 Elements/Tags to process further.

If any other Elements related to other Standards/Version like HTML5 – Then, they will be judged as Warnings and Errors. Traditional Browsers like Internet Explorer will be the first one’s to show them off as Errors and Warnings. Other than that, they differ using their own set of New Elements/Tags. and so on.

2. HTML5 Doc-type says – It is an universal doctype. So, if this particular Doc-type is defined in the HTML Page, then it is going to parse that particular Page in HTML5 standards. While parsing, the Parser/processor will look out for both HTML4 and HTML5 Elements/Tags to process further.

What’s New in HTML5?

HTML5 has introduced many Elements/Tags to be used as HTML5 Elements. There are regular Markup Elements, Multimedia Elements and many more. Some of them are listed out for your ease.

This example is a Simple Web Page which will contain some of the Markup Elements used:

Markup Tags/Elements like:

Form Tags/Elements like:

 Multimedia Tags/Elements like:

 Other functionality like:

Below is an Simple Web Page which will contain some of the HTML5 Markup Elements used.

 Further, you can style the markup as you need.

So guys, As I told you – I have used few HTML5 Elements in the above example. I have Commented on every usage of the HTML5 Elements, so that it would be just as easy as I deliver it out of my mouth!!

Hope, this tutorial [Complete reference tutorial HTML5 for beginners] – gave you at-least some information. To start with – you can visit this tutorial – HTML5/CSS3 tutorial.

Any question – please write back to me, I’ll try to answer it asap. Hope to see your positive suggestions as well.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">