Introduction of HTML5 features

HTML is core language of world wide web which play the vital part in web world. HTML was introduce in 1990s. HTML5 is the fifth major revision version public by W3C. Its describes the status of document at the time of its publication.

HTML5 is still a draft:-It is under the discussion of HTML working group.Its is a ubiquitous platform for the web development.

Doctype:-
Doctype for html before HTML5 which was not easy to memorize .

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

while in HTML5 just a sinlge tiny line.

<!DOCTYPE html>

The Figure Element:-For making association of image caption with image. Html5 introduces a new element <figure> which combines with <figcatption>element to easly associate caption with their image.

<figure>
<img src=”path of image here” alt=”title of image” />
<figcaption>
<p>this is image caption display section.</p>
</figcaption>
</figure>

<figure>
<img src=”path of image here” alt=”title of image” />
<figcaption>
<p>this is image caption display section.</p>
</figcaption>
</figure>

<small> Element:- According to HTML5 definition t is a correct wrapper for small print.like footer copyright text , tag line or logo below text .

No Need of Types :- As it was necessary to specify the type attribute for css and javascript but HTML5 does not need to do so.

Older Version HTML:

<link rel=”stylesheet” href=”path of stylesheet.css” type=”text/css” />
<script type=”text/javascript” src=”path of script.js”></script>

New Version HTML5:
<link rel=”stylesheet” href=”path of stylesheet.css” />
<script src=”path of script.js”></script>

Email Inputs:-If we simply write a type of “email” attribute of  form input
. It automatically work as a validation in browser window. It will only allow to enter a valid email address structure .

For more information see example below:-
<!DOCTYPE html>

<html lang=”en”>

<head>
<meta charset=”utf-8″>
<title>untitled</title>
</head>
<body>
<form action=”” method=”get”>
<label for=”email”>Email:</label>
<input id=”email” name=”email” type=”email” />

<button type=”submit”> Submit Form </button>

</form>
</body>
</html>

HTML and Internet Explore:- Internet Explore require some more work to be done before understanding the new HTML5. By default it understand all
element as display :inline css style.So to ensure all element of HTML5 render correctly as block level .It is necessary to add like this.

header, footer, article, section, nav, menu, hgroup {
display: block;
}

Unfortunately, Internet explorer still ignore these styling . To fix this
issue we use

document.createElement(“article”);
document.createElement(“footer”);
document.createElement(“header”);
document.createElement(“hgroup”);
document.createElement(“nav”);
document.createElement(“menu”);

This script also fix some of the printing issues

<!–[if IE]>
<script
src=”http://html5shim.googlecode.com/svn/trunk/html5.js”></script>
<![endif]–>

hgroup:- If in a site header we have the name of the site and the tagline
below it we use h1 and h2 tag .It create problem in terms of hierarchy
problem while next coming h1 and h2.

hgroup element(<hgroup></hgroup>):-It group these heading element
together ,without affecting the flow of document.

example :-
<header>
<hgroup>
<h1> Recall Fan Page </h1>
<h2> Only for people who want the memory of a lifetime.
</h2>
</hgroup>
</header>

Now, enjoy New HTML5 version .I will be back soon with more HTML5
element ,keep visiting.

 

Leave a Reply to This Post

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

*

You may also like

Latest From 360 KLP Blog

Posted In: Tour and Travel

No matter, where you go, but reaching your destination on time is important. If not you reach your destination on time, you will have to face the issues according to the purpose you go for that destination. For example, if you are going to ai...

Posted In: Clothing

It is true that, most of us do not find time to wash our clothes as we are so busy in office and home. As far the cafes, hotels, salons and other offices are concerned, they need to definitely hire the laundry service to wash the clothes, as ...