Client Side

All the fancy frizz

HTML5 What is it and why you should care

Written by: Peter Fisher on March 27, 2012
Tagged under: , ,
Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedIn
HTML Hyper Text Markup Language

HTML is the basic building blocks of all web pages

Yesterday (March 26th) I went to a  HTML5 pre conference at Dev Week 2012. The HTML5 workshop was hosted by Jeff Prosise, a well renowned web developer and a expert in web based programming languages such as JavaScript and HTML5. The following is a short summary of some of the things I took away from the conference.

What is HTML5?

Its a mixture of the following:

  • Advances in JavaScript
  • Better HTML semantics
  • A shift in ownership of validation and input device capture from JavaScript to the browser

HTML5 is a series of  standards and API specifications. Each API is at a different point in its development and therefore different browsers support different levels of each specification.  Before you roll your eyes and think this is a major disadvantage, you will be pleased to hear that many of the ‘core‘ features are already available in common browsers.  Also frameworks such are Modernizr are available to poly fill some of the missing functionality into legacy browsers.

Think of  HTML5 as a container of API’s which will greatly improve the user experience.  Some of these API’s will have an affect on multiple systems such as the browser (validation), the file system (File API) and the server (AJAX2).  It’s fair to say that the advances in HTML5 are quite broad reaching.

When will HTML5 be classed as finished?

The short answer is that no one truly knows.  As HTML5 is made from an ever changing set of specifications its fair to say that HTML5 will be in ‘Working Draft‘ status for quite some time and HTML6 is not in the pipeline. There are schools of thought that suggest that HTML6 wont ever happen or at the very least not happen for many many years from now.

What state is HTML5 in now?

HTML5 is classed as a “Working Draft”. This means that many of its features are ready for development/production environments and some advanced features are only compatible with certain browsers.  It also means that the API’s are still up for review and can change.  You can see how well your browser handles HTML5 by going to the html5test site.

What HTML5  features can be used now?

This depends on the app/website that you are developing and who it is targeted at. If you are making a web app which you know is being used on HTML5 specific browsers then there is no reason why you cant delve into the advanced features of  HTML5.  If on the other hand, you are making a app which requires cross browser support then you should look at the base line feature set . These are features that are supported by all the modern browsers.  Use IE9 as a benchmark for what feature you can use. Most of the core features are available to many browsers (IE9+).

These include (but not limited too):

  • Many new markup elements
  • Canvas API
  • Geo Location API
  • Video API
  • Audio API
  • Local Storage API

What browser has the least support for HTML5 and why?

The award goes to Microsoft Internet Explorer Nine and to this day the browser is a thorn in Microsoft’s side. When the browser was in development, Microsoft held a large portion of the browser market share and during development Microsoft decided to go their own way and produce a browser which only implemented some (Less then 50 %)  features and standards of HTML5. Once the browser was ready for production Microsoft found their share of the browser market slipping away to other browsers such as Chrome, Safari and FireFox which adopted more advanced HTML5 features.  Also the nature of the Microsoft machine doesn’t allow them to release software as quickly as other software vendors and thus they are not able to keep up with the pace of HTML5 in the public domain.  However Microsoft are championing HTML5 in their next version of Internet Explorer (IE10). This will be rolled out with the next Windows Operating System (Windows 8).

IE9 will become the next IE6 regarding standard support

How will the browser change?

HTML5 puts more responsibility on the browser to interpret and validate user input with a better form API.  If the input has the type of tel, it will display a number pad  on mobile devices when the input has focus.  Likewise if the input has the type of email a standard email validation rule is applied when the form is requested. Furthermore extra attributes can be given to the input field to define them as required or if they are to be validated against a regular expression. These advances take the pressures of data validation and data capture away from JavaScript. However please make sure any user input is validated and sanitized via the server.

Another browser enhancement comes from the Selectors API which allows the browser to make native DOM element selector calls such as querySelector(pattern) and querySelectorAll(pattern). As these are native calls they are more efficient than jQuery selector calls.

This post doesn’t even scrape the surface of what I learnt from the HTML5 workshop, for one thing I haven’t shown any examples of code or explained any of the API calls.  However as I develop my own HTML5 apps, I hope to write more posts on the subject.

The talk Jeff Prosise gave at DevWeek 2012 was well structured and well explained. If you are interested in hearing more about HTML5 then I highly recommend going to one of his talks

Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedIn

Peter Fisher is a web developer working in Gloucester UK. Founder of the digital agency Websomatic, author of this blog and the HowToCodeWell Youtube channel. Peter has over ten years of web development experience under his belt

Read all about Peter Fisher

Leave a Reply

Your email address will not be published. Required fields are marked *