HTML 5

HTML 5 is a new standard to deliver great UI's. It includes animations,videos,rich GUI's etc

The Page structure is different in HTML 5 with additions of new tags viz: header,nav,article,section,sidebar,footer.

As I kept working on various projects, got to learn a lot of things for HTML 5 some listed below:

SVG and Canvas:
SVG stands for scalable vector graphics. It is light weight and renders faster. SVG is text based graphical language.

Canvas is an area where you can draw graphics.
Using SVG you can draw something and later manipulate, where browser will re-render it. When you use a Canvas, you can only draw but not modify some portion of it. Hence Canvas is much faster, since there is no overhead of remembering something.

Column Layout:
HTML 5 supports the new column layout. You can have huge text divided into 3-5 and more columns.
css style column-count can be used.:

-moz-column-count:5; /* Firefox */
-webkit-column-count:5; /* Safari and Chrome */
column-count:5;

column-rule can be used to draw line between columns:

-moz-column-rule:5px outset #ccffff; /* Firefox */
-webkit-column-rule:5px outset #ccffff; /* Safari and Chrome */
column-rule:6px outset #ff00ff;

Similarly we have column-gap, etc

HTML 5 also supports server sent Events:

Many times there are needs where we need to continuously fetch data from the server. In this case using a pull model is good, but it consumes a lot of network bandwidth and also the server is loaded.

So a PUSH notification kind of solution is much better.

var source = new EventSource("//some jsp/.net file which will raise events");

we can listen to events from server:

source.onmessage = function (event){

//code to handle it

}

The content type of the response sent from the server has to be: 'text/event-stream'

The response can contain:

data://actualdata

retry:1000  //retry in 1 sec

event:success://some message

There are many more HTML 5 features that are very useful like Localstorage, application cache,etc which I'll come to details in another post.