In addition to the canvas, the HTML5 specification has also introduced two exciting additions to the CSS3 specification—Transitions and Animations.

Transitions enable developers to create simple animations that can change DOM element styles over a defined period of time. For example, if you mouse over a button and you want it to gradually fade to a different color within one second, you could use a CSS3 transition.

Animations enable developers to create more complex animations by defining specified key frames which can be thought of as a series of linked transitions. For example, if you wanted to animate a DIV element by moving it up, then left, then down, then back to its original position, you could use a CSS3 animation and define a key frame for each point along the path.

So, here's where people get hung up. When should you use canvas and when should you use CSS3 for animations? If you're a seasoned developer, I'm sure you know that the correct answer is "it depends". As a general rule of thumb, it's good practice to use CSS3 transitions and animations if you're animating DOM nodes, or if the animations are simple and well defined. If, on the other hand, you're animating something more complex such as a physics simulator or an online game, it would probably make more sense to use canvas.