New elements in HTML5 and canvas 2D API

Anže Rozman (2010) New elements in HTML5 and canvas 2D API. EngD thesis.

PDF Download (2561Kb)

Abstract

The new version of the HTML standard introduces a number of new elements and attributes that reflect typical usage on modern websites and help us code our websites. Some of them are semantic replacements for common uses of generic block and inline elements. Other elements provide new functionality through a standardized interface. Although HTML5 is currently under development, most main browsers at least partially support its new functionality. In the first part of my diploma thesis I present the main innovations of HyperText Markup Language. I have tested all of them in practice as software solutions that Web developers can use or adapt for reuse in their solutions. In the main part I introduce a new HTML canvas element in detail. Canvas element is one of the most interesting and useful innovations of HTML5. HTML 5 defines the canvas element as a resolution-dependent bitmap canvas which can be used for rendering graphs, game graphics, or other visual images on the fly. A canvas is a rectangle on your page where you can use JavaScript to draw anything you want. Besides, this canvas allows the integration of video and audio content and can make animations. I have included examples of pixel manipulation of video content. The main product is an animated interactive panoramic map of Bohinj. I compared canvas 2D API with other computer 2D graphics technologies such as SVG. In the end I describe web computer 3D graphics technology WebGL, which is also based on the HTML5 canvas element. I also describe other current 3D web graphics technologies and compare them with each other.

Actions (login required)