Book Review: “Pro HTML5 Programming”

In order to gen up on the latest developments, and benefits, of HTML5 I purchased a recently published book on the topic; Pro HTML5 Programming (2nd Edition). The authors have done a terrific job – having revised the previous edition, which received a lot of positive reviews on Amazon.com, and providing sufficient examples, descriptions, and commentaries on each particular HTML5 element and API which made each chapter very easy to digest. Having recently finished Pro HTML5 Programming I can say with certainty that I feel a lot more confident knowing where, when and how to best integrate HTML5 into the projects I manage, which was exactly what I was looking for.

The HTML5 specification is still incomplete so buying a book on the topic means that you probably won’t be using it as a reference guide in several months. However, having said that, if you want to learn HTML5 you have to start somewhere, preferably somewhere where the content was written very recently, and somewhere where this particular issue is discussed openly by the authors and addressed where relevant. Thankfully the second edition of Pro HTML5 Programming was released in December 2011 and the authors constantly refer back to the evolving state of HTML5 so you never feel like you’re reading dated information.

JavaScript is given quite a bit of attention, and is something you can’t really avoid when building rich HTML5 applications, so you’ll need to be reasonably familiar with his particular scripting language to understand a lot of the content covered. Reference is made to CSS3 and although it’s only done so sparingly and I wouldn’t say this is a book that would necessary advance your CSS3 skills as much as it will your HTML5 and JavaScript skills.

I wanted to write a blog about this book as I found it very informative and would highly recommend it if you’re just starting out with HTML5.

Chapter Overview

Here is an abbreviated run-down on the chapters, with reference made to marked highlights.

1. Overview of HTML5

An informative and interesting history of the HTML specification as well as the reasoning behind the generation of the HTML5 specification; security, interoperability, accessibility, plug-in free paradigm etc. and a high level overview of the HTML5 semantic markup elements.

2. Using the Canvas API

The HTML5 element for drawing graphics via scripting whether it be images, charts, graphics, animation etc. The chapter starts off with an overview then takes the reader through a number of steps, primarily using JavaScript, to draw two reasonably detailed canvas graphics, with the latter responding to mouse events to update the canvas.

3. Scalable Vector Graphics

The distinction between canvas rastor graphics (i.e. PNG, JPEG, etc) and SVG’s vector graphics (i.e. mathematically drawn geometric shapes) is clarified from the start. And it’s nice to know that SVGs can be indexed by Google because they are not part of an image. Again an example is used to illustrate how to draw an SVG graphic with emphasis placed on the interactive application of SVG elements, and how the SVG element embeds directly into the HTML DOM thus providing DOM runtime editing. Reference is made to SVG-edit (a free web-based SVG editor), which I would highly recommend looking at.

4. Working with Audio and Video

Starts with an informative history of the audio and video codecs, knowledge that is intrinsic to correct implementation of the plug-in free HTML5 audio and video elements, and makes a very strong point that you not only have to know which browsers support these elements, but which codecs are supported as well. A reference table is provided for the big 5 browsers (as it stands right now). The available audio and video element attributes are also covered, with sufficient examples provided.

5. Using the Geolocation API

How the Geolocation API works, and caveats such as the requirements for permission to access and retrieve the latitude and longitude for a given request, how these coordinates are retrieved, i.e. GPS, Wi-Fi, cellular triangulation, IP address, etc., and accuracy limitations to be aware of are all covered before any code is presented. JavaScript examples are provided for retrieving one-shot, or repeated, position requests. Of interest was the additional coordinate information the API returns such as accuracy and where supported; altitude, altitudeAccuracy, heading, speed. Also knowing there is a handler for location errors shows the thought invested in this particular API.

6. Using the Communication API

Secure cross-origin communication (i.e. sending a message from http://www.mywebsite.com to http://www.yourwebsite.com) using Cross Document Messaging and XMLHttpRequest Level 2 are explained and illustrated via two examples that cover the new HTML5 postMessage API and updated XMLHttpRequest object respectively. All related topics, such as the concept of an origin, security considerations, new XMLHttpRequest Level 2 improvements etc. are covered

7. Using the WebSocket API

Full-duplex communication over the web, via a single socket, is made possible via the HTML5 WebSocket API. The book outlines the benefits of this new API, i.e. reduced network traffic and latency, so you can understand why it’s introduction to the HTML specification is something to take note of. This isn’t exactly a beginner’s topic so to address this the authors provide plenty of examples, illustrations and JavaScript code samples (as well as server-side Python code) to clarify what’s involved.

8. Using the Forms API

HTML form elements, undoubtedly one of the more frequently used HTML elements, is expanded on in HTML5. The authors touch on each new form element type; tel, email, url, search, range, number, and what this means for mobile and non-mobile browsers as well as the pitfalls to avoid. The new progress element is covered as are the elements; color, datetime, time, date, week, month etc. – reference is made to their limited support at present. Other form-based elements are covered; validation, autocomplete, required, min, max etc. so the reader is exposed to a comprehensive look at forms in HTML5.

9. Working with the HTML5 Drag-and-Drop

The two main underlying components of drag-and-drop; (1) mouse drag events and (2) data-transfer, are addressed in a very digestible manner. As with previous chapters the topics covered within are broken down into their simplest form and explained quite clearly with illustrations and examples. Although this is a simple concept at it’s core there are a number of idiosyncrasies that need addressing (dragenter/dragleave event firing order) as well as some less-obvious features (dragging between applications and browsers) that the HTML5 drag-and-dropping funcationality offers – again the authors do an excellent job at addressing this.

10. Working with the Web Workers API

Background processing is made possible via Web Workers. Both Inline and Shared Web Workers are discussed and working examples provided for both. Important limitations, such as web workers not having access to the web page and DOM API, are also covered.

11. Using the Web Storage API

HTML5′s Web Storage API makes it possible to store data across web requests, something currently made possible with cookies but with far fewer limitations. How data is stored and retrieved, differences between the two storage objects; localStorage and sessionStorage, and related events, properties and methods for both are addressed. Key differences between the two objects is explored so that readers can avoid implementing the wrong one at design/build time. The Web SQL database API is covered later in the chapter, also surprising is that it’s not implemented by IE or Firefox … yet(?).

12. Creating HTML5 Offline Web Applications

As the chapter title suggests the authors address how to implement an offline web application, why you may want to consider going offline (providing several examples of where it would be useful) and how you go about it. Several pages are dedicated to the ApplicationCache API as it relates to this particular topic.

13. The Future of HTML5

The future of browser support for HTML5 and future revisions of the HTML5 specification are discussed in addition to new APIs that may appear for WebGL, additional device support (webcams, microphones, storage devices etc), Audio Data API, touchscreen device events, peer-to-peer networking – which are all quite interesting topics in light of what has been made possible so far.

Final Thoughts

After finishing this book I’d say it’s more focused at the developer with experience just beyond the beginner’s range. In particular those developers who have had a decent level of exposure to HTML4, JavaScript and the more popular browsers used today.

Each chapter provides a concise overview and history of the particular HTML5 element/API discussed before starting in on how it’s implemented with illustrations and/or code examples provided where necessary to better clarify how it’s used. This is my ideal way of learning new topics and although I could have skipped the history component I didn’t mind it’s inclusion given how abbreviated and informative I found it – that and spending time reading a few extra history paragraphs within a several hundred page book wasn’t going to hurt me.

When ASP.NET was first released back in 2002 I found learning this new framework, after having built ASP solutions for several years, quite a step up. It wasn’t a particularly difficult but it wasn’t as easy to learn, or as simple to implement, as ColdFusion or Perl. I felt the same way when reading through Pro HTML5 Programming, with HTML4 being likened to ASP. The new HTML5 elements and APIs expose so much functionality that there is a much greater learning curve once you start to move away from the more simpler markup elements. Pro HTML5 Programming does a great job in educating the reader and adding to their awareness of how, when and why to implement HTML5.