HTML5 Graphics : Canvas Basics Part - I

   
     We are hearing more about HTML 5 now-a-days. It is the future of web development. Even though it is still in progress it is supported by many browsers such as Chrome, Firefox, Opera, Safari, IE (current versions).

HTML 5 logo by W3C

What exactly is it ? What's so special about that?

 HTML 5 will be the new standard  for HTML.It has many interesting features which will make our work more easier and better.

Some of those are:

• It has many structural element tags like <article>,<header>,<footer>,<section>,<aside> and more...
• It has many elements for multimedia like <audio>,<video>,<source>,<embed> and more...
• It supports local storage,web applications.
• It has element canvas which is used for drawing graphics.

But  we will be concentrating on the canvas element which is very useful for drawing 2D/3D graphics usually we use script language such as JavaScript.

What is Canvas ?

'Canvas' has been the 'Talk of the town' since day 1 of the announcement of the new html standard As you have just read , it is a element introduced in HTML 5 for better graphic interface. It is only a container for graphics,which defines specific area in th web page for us to draw graphics . It uses many methods for drawing shapes such as beginPath( ), moveTo( ), closePath( ) and more for drawing fundamental paths like circles ,rectangles,boxes,gradients, images, patterns, text etc....

We will be discussing those fundamental methods for drawing paths in the next article..

Next Articles:

• HTML5 Canvas Basics Part - 2
• HTML5 Canvas Basics part - 3