What is HTML5 Canvas?
Don Cowan
The Canvas feature of HTML5 is one of the most exciting new developments in web based capabilities in many years. Here are some key aspects:
HTML5 - Canvas is a part of the latest revision and improvement of the previous version (HTML4, released in the late 1990's) markup language for displaying web pages on the Internet.
Canvas Tag - The <canvas> tag joins the other HTML tags (there are around 100 now) as a way to include single or multiple Canvas areas on a web page.
Bit Map Display - The Canvas area you define with a <canvas> tag is a bit map display. You can manipulate individual pixels to draw objects, images, animations and video.
Javascript Control - The Javascript language is used to control what is seen on the Canvas. The Javascript application code is placed between the <head></head> and <script></script> tags of the web page.
Browser Based - The computing needed to create a Canvas display is done within the browser. In other words, it's client based, not server based. The means that creating a Canvas application is simpler than one requiring server based programming. It also means that the computing power needed to generate the Canvas display is not concentrated in single servers. Each user's browser handles its own work.
Animation - Canvas applications can generate animations. This is accomplished using callbacks from the browser. The Canvas application designates one of its functions to be called from the browser at specified time intervals. During each of these callbacks, the application draws a new Canvas display, moving objects slightly. When viewed as a continuous flow of Canvas displays, an animation is generated.
Audio/Video - Audio and video can be incorporated into your Canvas applications. Moving objects can create sounds and video images can be melded into other application objects. This is done without the use of any audio or video plugins.
Gaming - Game developers have all to tools necessary to create compelling HTML5 Canvas games.
Fun - Putting aside the technical aspects of Canvas ... it can be described as just plain fun. An HTML5 Canvas is a place where as a developer you can express your creative energies and as a user you can have expanded and enjoyable experiences.
For a more details look at HTML5 Canvas, watch for my upcoming book: HTML5 Canvas for Dummies.
Reader Comments (1)
The Canvas options are yes indeed a really great addon!