<canvas> tag, what other pieces of HTML do we need to be aware of?
closed as too broad by MichaelHouse♦ Jul 12 '13 at 19:08
Please edit the question to limit it to a specific problem with enough detail to identify an adequate answer. Avoid asking multiple distinct questions at once. See the How to Ask page for help clarifying this question. If this question can be reworded to fit the rules in the help center, please edit the question.
Just to throw more resources out there, check out RaphaelJS. It's a very nice SVG drawing and animation library that has a nice API. Don't forget to check out the demos.
Overall, I'd recommend
<canvas> tags over straight DOM manipulation (e.g. making each sprite its own
<div> to make hit-testing amazingly simple). It's easy to get DOM manipulation wrong and badly performant, whereas traditional 2d development strategies work well on an HTML canvas.
In addition to some of the game-making frameworks that are out there, you should be aware of the Burst Engine, which is a JS framework for displaying SVG-based animations in an HTML5 Canvas:
So far I've seen people mention the and tags, but there are other DOM things that are vital to JS/HTML game development, including stuff like adding EventListener callbacks to the element for things like the 'mousemove' and 'mousedown' events. For example, this takes the first canvas element it can find and sets it up so that when you click on the canvas, it calls a function you've defined called "shootAtClick":
document.getElementsByTagName("CANVAS").addEventListener('mousedown', shootAtClick, false);
You can see it in action in this example where I've extended the Akihabara engine to accept basic mouse control. (Press Z to begin, use arrow keys to move, click the mouse to shoot in the direction of the cursor.)
Knowledge of what HTML5 components are supported in what browsers.
Though cross browser compatibility is getting better and more uniform as time goes on some of the newer components are still not supported entirely equally.
Web sockets as well may have browser specific differences, but socket.io looks like a promising library that provides a convenient abstraction.
Audio compatibility is a pretty major component that requires different sound files for different browsers: http://html5doctor.com/native-audio-in-the-browser/
Chrome has a couple of significant audio bugs, such as being unable to play short audio files, and playing many simultaneous sounds can crash the entire browser.
The main thing is to understand the browser differences, using libraries to abstract and provide legacy support as needed.
Notice that you're starting to get vague, hand-wavey answers rattling off random technologies that seem neat. That's a warning sign that you haven't asked a question with a particularly legitimate answer.
You might as well ask what C++ stuff you need to write applications. That depends. Tell us more about the project, and you might get a useful answer.
By and on the whole, there's a reason that nearly all web games are still Flash.