The New HTML5 Standards

HTML5 is a large specification. So large, it has been broken into smaller specifications, some of which are not so small.

We know the bounds of the old HTML or xhtml specifications. It was the markup world that we use to code our pages. The new specification is much larger and different in character than previous specifications.

Smoke brush

Browser Consistency

One of the biggest problems with specifications for HTML and its companion CSS, has been the missing or vague descriptions concerning details of how browsers should interpret and implement the standards. This resulted in each producer doing their best to figure out how their browser should behave for each property or tag. WHATWG did us all an enormous service by starting down the path of a new specification in a way that mandated the producers of browser should no longer have to guess about what was intended by the specification. As a result, we are already seeing more consistency among the browsers, despite the standards still being in working draft status.

Change in Focus from Pages to Applications

New tag and property syntax abound, while some older little used or less desirable features have been removed. We are not going to discuss those changes here. They are not the big new thing for HTML5. As you read through the various specification components you begin to see the spec is not just about displaying pages. It's about expanding into the world of internet applications. The new specification includes Application Programming Interfaces (APIs), opening up the ability of JavaScript to do more than play in a sandbox containing very little sand. As applications move to browsers that behave in a consistent manner, some of the differences between devices start to melt away. There are also new accommodations for mobile platforms that make developing cross-platform browser applications much more viable under the new specifications.

CSS3

CSS naturally needs to change to accommodate the changes in HTML. But it too is growing. There are many new features available that allow the developer more control over presentation while lightening the overall page weight by reducing the number of images and graphics that need to be downloaded.

Web Open Fonts

Previously, if you wanted to use fonts on your page that were not guaranteed to be present in every browser, you had to embed that text in an image. The problem here of course was that images are rather large and the search engines did not make an effort to read the text in those images. Now however, you can use custom fonts by downloading them with your page. While this may not solve the problem of page size for everyone, it does provide the ability to use a wider variety of fonts to present your textual content.

Browser History API

This is a big help for AJAX applications that download new content to pages that are otherwise alike. While these are effectively new pages the user should be able to navigate to and from, the use of this partial load meant the URL in the browser history did not change. There was no ability to go back to the previous page, because as far as the browser was concerned, you were still there. The History API gives the authors the ability to perform this swap AND tell the browser that this is a new page, allowing the back button to return the user to the previous version.

Web Storage

Up until web storage, the only way a page could store data on the browser's machine was to use cookies, with were limited in size an often not terribly secure. Web storage defines a more secure storage area for faster access to larger amounts of key-value paired data. The data does not have to be downloaded over and over. Only the site that owns the data can access it.

Audio and Video API

The benefits of this new component are a little complex to discuss in a short paragraph. The principle benefit is that browsers will now have native support for media features that were previously available only through plug-ins like Flash. The new APIs are still in early stages of development, but they promise to allow programmatic access to information about these media types as well as developer control over the behavior of the media in the user's browser.

Page Visibility API

Have you ever had your browser restart only to have multiple videos that you had previously viewed all start up again? What about the times that you load a new page, start scrolling down, only to hear some advertiser's video talking at you from off screen? This is all unnecessary data streaming from the web server to your machine. The Page Visibility API gives the developer the ability to determine which part of the page is currently rendered onscreen, and take action accordingly.

Web Workers API

The more technically inclined will be excited about this one. It allows spawning of thread-like processes that run in the background of the browser environment. Larger workloads can be offloaded there and the result picked up when they are available.

Web Sockets API

This is another one for technicians who understand the power of sockets and what they can do. This allows access to sockets connections from a web application. Developers can use the protocol layers below the HTTP protocol for faster access to data and devices, as well as the power to work outside of the HTTP limitations.

Canvas 2D API

With this API we can do things that before we could only do with images, animated images, and Flash-like plug-ins. There are a lot of good examples on the internet if you look for them.

SVG API

Scalable Vector Graphics are about the ability to draw, stretch, flip, layer, morph, and manipulate shapes in 2 dimensional space. This takes drawing on the screen beyond the Canvas 2D API and potentially into the territory of applications like Fireworks and Photoshop.

Other Topics In Progress

There are more topics proposed and/or in working draft form. Some are more mature than others. Below are a few of the better known topics. A list of all the W3C standards and drafts can be found at http://www.w3.org/TR/ .

File API
Geospatial
Offline Applications
WebG/L (Canvas 3D)
Web Notifications