Acredito muito em <canvas> por ser uma tecnologia que já está no mercado a bastante tempo e boa parte dos browsers já aceita. O único browser que dá problema, vamos lá, adivinhem…. sim, é o Internet Explorer, nas versões  6, 7 e 8 porém eles tem o objeto deles (do famoso padrão Microsoft “me deu na telha criar isso”), chamado shape, esse objeto não é igual ao canvas, tem menos métodos, mas dá pra criar algo nele.

Mas existem frameworks, como o explorer canvas, que traduzem um código javascript que é feito em canvas, pra shape, ou seja, na teoria o Internet Explorer não é um problema pra desenvolvermos em canvas. Na teoria, já na prática alguns métodos não funcionam, como degradê radial e escrever texto em canvas também dá problemas.

Mas, ainda assim, graças ao mercado de mobile e tablets que não tem suporte ainda direito a flash, o uso de canvas pra interfaces de navegação ou até mesmo jogos. No site Canvas Demos dá pra ver dezenas de aplicações em canvas que se pode se comparar muito facilmente com sites feitos em flash. Porém são mais acessíveis, muitas vezes até pro IE6.

Vamos programar um pouco:

HTML

Só adicionar no seu html

	<canvas id="canvas" width="300" height="300">
		Seu browser não suporta canvas
	</canvas>

Javascript

// função que move um objeto em circulos calculando x e y
var fx = function(centro_x, raio, incremento){ 
    return (centro_x + raio*Math.cos(incremento/20)) 
}
var fy = function(centro_y, raio, incremento){ 
    return (centro_y + raio*Math.sin(incremento/20)) 
}

// Contexto trata-se do estado objeto canvas
var contexto;

// O incremento é o que faz o objeto girar;
// se você calcular fx() com 0
// e depois calcular fx() com 1, 2, 3... etc
// a funcao retornará uma posição de X em forma de círculo
// e a mesma coisa com fy();
var incremento = 1; 

var Canvas = {
	// iniciando o objeto
	_init:function(){
		// Instanciando o contexto do canvas 
		// numa variavel global
		contexto = document.getElementById('canvas').getContext("2d");
		// aqui eu peço pra funçao que vai posicionar 
		// o canvas ser chamada a cada 30 milisegundos
		return setInterval(Canvas._preencher, 30);
	},
	_preencher:function(){
		// apagando o que tinha no canvas
		// não é possível desenhar um objeto no canvas 
		// e depois mover ele pra isso é necessário 
		// apagar o conteudo do canvas
		// e desenhar tudo novamente 

		contexto.clearRect(0,0,300,300);

		/* CRIANDO UM QUADRADO COM DEGRADÊ */
		// inicia o desenho
		contexto.beginPath();
		// cria um degradê
		var my_gradient = contexto.createLinearGradient(300, 0, 0, 300);
		// adiciona a cor de inicio
		my_gradient.addColorStop(0, '#ff5');
		// adiciona a cor final
		my_gradient.addColorStop(1, "#f60");
		// adiciona o degradê ao estilo do contexto
		contexto.fillStyle = my_gradient;
		// cria um quadrado 300x300 na posicao 0x0
		contexto.fillRect(0, 0, 300, 300);			
		// fecha o desenho
		contexto.closePath();
		
		
		// CALCULANDO X E Y DO OBJETO
		x = fx(150, 100, incremento);
		y = fy(150, 100, incremento);

		// acionando o incremento
		incremento++;		

		// o incremento não precisa ser maior 
		// do que PI * 2 * Numero de vezes 
		// que vc quer pra dar uma volta
		// assim fica mais facil e rapido pro js
		// trabalhar com 0 a 63
		// do que 0 a infinito
		if( incremento == Math.PI * 2 * 20 ) incremento = 0
		
		// CRIANDO O CIRCULO
		// redefinindo o estilo do canvas pra pretro
		contexto.fillStyle = "#000000";
		// inicia um novo desenho
		contexto.beginPath();
		//  criando o circulo
		contexto.arc(x, y, 10, 0, Math.PI * 2, true); 
		// preenchendo a cor dele
		contexto.fill();
		// fecha o desenho
		contexto.closePath();
	}
}	
// iniciando nosso js
window.onload = Canvas._init;

Resultado

E depois disso dá pra brincar, vejam outros exemplos que eu fiz, deu pra usar o explorer canvas, ou seja, é acessível pra todos os browsers, desde ie6 até iphone:

Com sombras

Estilo Vitrine

Quem se interessar, deixei todos os exemplos disponíveis pra download.