HTML5 enabled browsers are now ubiquitous on desktops, laptops and in cell-phones, the majority of which have hardware accelerated support for CSS3 and canvas rendering. It follows that the browser is now a viable target for deploying games, without the need for 3rd party plugins.

This presentation will show how to create a 2D isometric city simulation game within the browser. The game renderer is implemented twice - once using the HTML5 canvas element, and once using the DOM and CSS3 to render sprites, to enable a fair comparison of the two approaches, and runs on all desktop browsers, iOS and Android.

The presentation will cover the prerequisite requirements for developing for modern browsers and the limitations of devices on which they run, before diving into concrete examples of rendering (DOM vs canvas), browser compatibility, user input acquisition (eg. iOS gestures), and finally look the tools are available to profile and debug a game.