Archive for April, 2011

HTML5 takes on the cloud.

April 28, 2011

Thanks to Microsoft not only do I have to fix my friends and family PC (well actually Windows) issues, but they now keep asking me about the cloud. So in retaliation I’m going to write about the total opposite: how you can get web applications to run offline using HTML5.

There have been a number of open and proprietary technologies that have allowed applications to be delivered and updated through the web but to operate locally. Some of these have been dependant on plug-ins e.g. flash, Silverlight or platform specific such as Microsoft HTA.

HTML5 now brings with it features that not only allow you to run applications offline but also to store data and content with it too. Of course you may be thinking with 3G, 4G and Wifi we have ubiquitous broadband anytime anywhere, but you only have to take a stroll out of the city to realise we are not quite there.  In fact the success of mobile apps has highlighted the need for local offline applications.

First an application can check whether it is online or offline by checking the navigator.online property (it is a simple Boolean). There are also events to notify an application of a change in status so an application can behave as desired in either it’s online or offline state.

HTML5 allows you to define a “Manifest” , essentially this simply lists the files (pages, images, scripts etc…) an application wants the browser to store (cache) locally so that they can be read when offline. There are also events and processing that can be programmed to control how and when the cached pages are refreshed, this includes the ability to show progress bars whilst a large application is being downloaded to the cache.

There aren’t many applications that don’t rely on stored data. HTML5 WebStorage specification provides new API’s for persisting data as simple key value pairs. There are two options here: sessionStorage or localStorage. The key difference between the two is how long the data is kept for. Simply, if your application just needs data whilst it is currently running (and not after the browser is closed) then use sessionStorage , otherwise if your application needs data that can be used after browser re-starts use localStorage. Although this sounds similar to cookies, these API’s are far more efficient and can store far more data than cookies. Both options provide getItem, setItem and removeItem methods for retrieving, storing and removing values. There are also events that can be trapped and processed by an application when data changes. For me the WebStorage specification is one of the most exciting as I have previously blogged the need for “client side session management” to improve performance and efficiency of web applications.

In many applications this simple storage of data will not be enough and users will want much more the capabilities of a database that can be queried and sorted. Here the IndexDB specification comes to the rescue. This specification deserves a blog post in it’s own right, so for now I’m going to leave it as HTML5’s answer to having a local database capability.

So HTML5 brings a host of features to make rich, dynamic applications with local storage work offline a reality. But we are still a way off from this being a ubiquitous solution as standards/specifications gets finalised and desktop browser’s play catchup with enabling these new features. However the time is right for your organisations to re-evaluate the technologies  used for offline applications as HTML5 is a serious contender for the future that is inevitably going to require a cross platform approach to both online and offline.

http://www.w3.org/TR/IndexedDB/

http://dev.w3.org/html5/webstorage/

http://www.w3.org/TR/2011/WD-html5-20110113/offline.html#offline

HTML5 What’s in it?

April 21, 2011

In my blog about HTML5 confusion I never really answered the question on everyone’s lips “Exactly what is in HTML5 ?”. And guess what I’m going to skip the issue again and just follow the categorisation of features as per the W3C as they have very pretty logo’s for each category and mainly because it’s important to know what can be done with HTML5.

The W3C have identified 8 categories of new functionality / capabilities offered by ” HTML5” which can be found here, they are:

Semantics
Create “smarter” documents for users and machine readers
RDFa, Microdata, Microformats, richer semantics/structure

Offline and & Storage
Ability for web applications to store data locally and run offline.
Application caching, session and local storage, Indexed DB

Device Access
Allow applications to access device features such as GPS
Geolocation API, more to follow including gesture events

Connectivity
More/better communication options between server & browser
Websockets, Server pushed messages, Cross document msgs

Multimedia
Add and control sound and video on your sites
Audio/Video elemts and API’s

Graphics and Effects
Draw and animate 2/3D rich graphics
SVG, Canvas, WebGL, CSS 3D

Performance & Integration
Asynchronous communication and processing
WebWorkers (threading in browser), XMLHttpRequest L2

CSS3
Improved styles, transforms, effects and fonts
CSS3, WebFonts (Web Open Fonts Format – WOFF)

Whilst the graphics and simple descriptions are quite cool what concerns me is again the ambiguity:

  • HTML5 is more than HTML (its CSS as well, but what about Javascript?)
  • XMLHttpRequest is performance and integration whereas it is actually this feature that created “web 2.0” by enabling asynchronous communication between browser and server, the cornerstone of Ajax.
  • In the categories above where does the Forms validation improvements fit in? (probably in semantics, but I feel this should have it’s own category)

There’s clearly a tremendous amount of really excellent work going into HTML5, it has sound principles and gaining strong momentum – especially in the mobile world. However this has to be balanced with the fact there is still lots of work to do, ambiguities to be ironed out and getting all involved parties and bystanders to sing off the same hym sheet should all not be underestimated.

The finalisation of the specification (when it becomes “candidate recommendation”) is expected sometime in 2012 by the spec’s main editor, Google’s Ian Hickson. However to be a W3C Recommendation status requires “two 100% complete and fully interoperable implementations” and this Hickson believes will happen around 2022 or even later.

However the bandwagon and gravy-train for HTML5 has already started rolling and is gaining momentum, I would say only the foolish will not hop on board. IMHO it is only a matter of when not IF for HTML5. Question is what will you do?

http://www.w3.org/html/logo/

HTML5 prepare for specification spaghetti?

April 14, 2011

For those that have been tracking HTML5 for a while I’m sure life is crystal clear, for those that have not well lets just say you may need some help navigating your way through over 900 pages of documentation which is duplicated by two separate standards organisation and further confused by media journalists and industry analysts.

First a quick step back into history: 1991 Tim Berners Lee publishes “HTML Tags” basically the first publication documenting HTML. However it was not until 1995 with the publication HTML 2.0 that a standard was born by a working group in the Internet Engineering Task Force (IETF). Fast forward again and W3C took over HTML in 1996 but it was not until 2000 HTML became an international standard (ISO/IEC 15445:2000). In 1999 the W3C issued HTML 4.01.

In 2004 a working group consisting of individuals Apple, Opera and Mozilla formed the Web Hypertext Application Technology Working Group (WHATWG) to look at the evolution of HTML. The WHATWG believed that much more evolution was required and their views were in contrast to what the W3C was doing with Xforms in 2003. The WHATWG set out on their own to define HTML’s destiny. However in 2006 the W3C took an interest in participating in their work and both groups have been working together since.

Simple right? So they are both working together on HTML5 specification and are going to publish a spec soon? The answer to this question is not so easy, so we have to break up the question.

Yes they are both working together. However the specification(s) being worked on by the WHATWG cover broader technical ground than the specification for HTML5 being proposed by the W3C (e.g. Canvas 2D, Microdata, Cross document messaging). In addition to this the HTML specification developed by the WHATWG is a subset of their “Web Application” specification which covers additional topics (e.g. WebWorkers, WebStorage, WebSockets…).

Essentially the W3C have divided out some of the work that the WHATWG are doing as separate specifications/standards. The good news is that we are told they are both working from the same source. The relationship of the various documents are neatly summarised in the FAQ’s of the WHATWG website (see link below).

All clear now? At the start of this article I alluded to other parties adding to the confusion, mainly the Press and Analysts. Some of this stems from the various sub specs created by the WHATWG and W3C, but also by the grouping of the evolution of other separate but related technologies like CSS and Javascript. In an attempt to help their clients clarify the situation technology analyst Gartner describes this superset of standards with the catch-all term “Modern Web Technologies”, however I am yet to find a single definition of all the standards their terminology encompasses.

As I sifted through sites and wiki’s everything was going so well until the W3C launched their HTML 5 logo programme saying that it was for : “general-purpose visual identity for a broad set of open web technologies, including HTML5,CSS, SVG, WOFF, and others”… doh ! Back to the drawing board then.

Oh well ignoring all that noise, there’s only the small matter of reading through over 900 pages of specification(s) .

http://www.w3.org/TR/2011/WD-html5-20110113/

http://www.whatwg.org/specs/web-apps/current-work/complete.html

http://en.wikipedia.org/wiki/HTML_5

http://wiki.whatwg.org/wiki/FAQ#What_are_the_various_versions_of_the_spec.3F