Most Popular Scripts | HTML5 | Tutorials & Reference

The canvas element is a drawable region defined in HTML code with height and width attributes. JavaScript code can access the canvas through a full set of drawing functions allowing for dynamically generated graphics. The canvas element was introduced in HTML5. You can read more about the element at the following locations:

Welcome! In this tutorial, we're going to create a breakout clone that you can play in your browser, using javascript and the element.

Among the set of goodies in the HTML 5 specification is Canvas which is a way to programmatically draw using JavaScript. We’ll explore the ins and outs of Canvas in this article, demonstrating what is possible with examples and links.

This article takes you through the basics of implementing a 2D canvas context, and using the basic canvas functions, including lines, shape primitives, images, text, and more. You are assumed to have mastered JavaScript basics already.

Collection of SVG tutorials aimed at someone creating SVG content and contains critical information for beginners.

The goal of this tutorial is to write a browser based "to-do list" application that works on the iPhone, Android and Palm Pre in six steps. The application should even work when the device has no network connection.

The gist of Offline Web Applications is to provide a manifest file that states which files should be downloaded for offline usage, which fallback certain files should have and other options. It is currently supported by Firefox 3.5+, Google Chrome and Safari.

HTML 5 is introducing several new features to the web such as multi-threaded JavaScript, cross document messaging and local storage. In case you are looking for an overview of what HTML 5 promises, visit HTML 5. Today, we will look more closely at the offline application caching feature of HTML 5.

The nice thing about contentEditable is that it maintains original markup and is in effect live editing of text in the currently formatted text. So if unlike wwEditable which used a textbox to copy content and had to figure out what CSS attributes to copy to make the text look right and then handle markup conversion issues, the text you type into a contentEditable block is live HTML.

Firefox3 supports the “contentEditable” property. Setting this attribute to “true” allows you to make parts of a document editable. This attribute was already supported by IE6/7/8, Safari, Chrome and Opera. So now we can start using it in our applications.

The contentEditable property (and the similar document.designMode) are meant to enable WYSIWYG editing. One of the cool parts about contentEditable is that it can apply to specific elements.

This project is an attempt to create a well maintained, informative and categorized cheat sheet to highlight HTML5 as well as other client side and related security issues and ways to avoid them. The project is meant to target web developers as well as security researchers and especially browser vendors since many of the problems we found are based on faulty or quirky implementations. Focus is on completeness, comprehensibility and timeliness as well as continuity - benefits many other related cheat sheets don't exactly provide.

One-page printable pocket book on some of HTML5's new tags and attributes.

The mapping of HTML5 structural elements to id and class names for use with s

In this video quick tip, we’ll review how to work with HTML 5 video in your own projects. Because older browsers and Internet Explorer do not understand the element, we must also find a way to serve a Flash file to viewers who are utilizing those browsers.

The element is brand new in HTML 5 and allows you to, get this, play a movie in your website! The data of this element is supposed to be video but it might also have audio or images associated with it.

This is an old video put up by a Google Employee called Brad Neuberg as an educational Introduction to HTML5. This is for the people who don’t find time to keep up with HTML5 developments by reading up articles.

In this tutorial, I will start with a .mov file and encode that into what we need to serve our HTML5 video.

Tutorial from WebMonkey.com that explains how to embed audio and video in HTML5 pages. Currently, the only way to reliably embed video on a web page so that all users can see it regardless of browser or operating system, is with Flash. This requires the Adobe Flash plugin and a combination of the and tags.

A slideshare.net presentation on how to process and publish video on the HTML5 format. It includes the different state of standardisation, using the javascript API, skinning the player, etc.