html5

Work on HTML 5 started in 2004 and even after 5 years of work we are no where close to having a final draft. According to the co-editor of HTML 5, Ian Hickson, we might have to wait till 2022 for the final proposed draft of HTML 5. But thats no reason to be discouraged, HTML 5 will be a major improvement over previous markup so changes are likely to come in small increments. Since the release of the first draft in 2008, most major browsers (yes including IE8) implemented some of the features proposed in this draft and it is already generating a lot of interest from developers. Today we will look at 5 of these exciting HTML 5 features and its implementation.

1) Web Workers: Think of it as Hyper-Threading for web browsers. Separate background threads are used to do processing without effecting the performance of a webpage. This can be very useful for web applications which relies on heavy scripts to perform functions (among other things). Firefox 3.5b has the best implementation of this proposed features. Opera and Safari also supports some elements of this feature.

You can try out the in-video motion with Web Workers on Firefox 3.5 or calculate prime numbers with Web Workers, with Safari 4 and FF 3.5

1234                                             Web Workers in action (well its in the background)

 

2) Video Element: My favorite HTML 5 features yet. You can embed video without having to rely on third-party proprietary plug-ins or codec. You can embed video code with the same amount of ease as you now embed an image with the ability to manipulate videos and built-in video controls among other things.

Try it out yourself (works only on FF 3.5).

345                                                 Billy: Burn IE with FIRE! (video rotation)


3) Canvas: Canvas element lets you render graphics and images on the fly. An excellent implementation of this element was done by the developers of Mozilla lab project Bespin. Which is an extensible Web Code Editor using Canvas (among other things). You need to register to try out Bespin. You can see a much simpler implementation of canvas with this drawing board (works with FF 3.5 – Chrome – Opera). All done without having to rely on plug-in, the possibilities are endless.

canvas                                              My Drawing-fu. Photoshop has nothing on me!

4) Application caches: The ability to store web apps like email locally and access it without having to connect to the internet or install an external client like Outlook or Thunderbird. Google gears, which helps you access Gmail offline, is an implementation of HTML 5 specifications for Applications Cache (and much more). If you use Google Gears than you are using already using this feature. You can try out an online demonstration of this feature in the form of sticky notes here, which saves information to your local DB. Works on Safari 4 and Chrome, FF 3.5 is a bit buggy on this demo.

123 
                                                                   My Sticky Art


5) Geolocation: This API defines location information with high-level interface (GPS) associated with the device hosting the API. Sources of location information includes Global Positioning System (GPS) and network signals such as IP address, RFID, WiFi and Bluetooth MAC addresses, and GSM/CDMA cell IDs. Yes, a big brother feature, but it can only be used if the user gives the application permission to use the information. You can try it online here. (FF 3.5b)

tt                                                                  Where is Waldo? 

Conclusion: So do we have to wait till 2022 to enjoy everything that HTML 5 has to offer?

Well, Yes and No.

No, because most popular browser already supports most of the features proposed on the first draft. Opera and FF are notoriously pro-active when it comes to implementing these features first. Google Chrome, though a new comer, has vested interest to implement these features as soon as possible (and have been very impressive so far) because one of the co-editors of HTML 5 is a Google employee and Google depends on the successful & quick implementation of these features for the growth of their online business. IE8 is also being good so far in implementing some of these features considering its past efforts (or lack of).

Yes, because HTML 5 is a major improvement over previous markup. An improvement that is likely to stay on for a long time. There has been a huge internet growth since HTML 4.01, so design – implementation – adoption by developers and co-ordination with all the major online players is no small task. While most of us will get to enjoy the adoption of some of these great features, a total widespread implementation is likely to take few years as the proposed features evolves over time. All these features listed here are not final by any means. They might not even be the same when the final draft rolls out.

Share

Filed under: Web Design & Internet

Follow us on twitter