For the Firefox 4 launch party in London, England we wanted to show off to the audience why it is such a big thing that we are moving leaps and bounds in the browser market. Here are the slides and notes explaining just how much fun we can have as developers these days if we use browsers to their capacity.

The slides

Detailed notes

Currently there is a lot of confusion what HTML5 is – a lot of companies abuse the term for marketing of all kind of products and some of the demos showcasing HTML 5 don’t use it at all.

Today I will promise not to try to sell you any operating system or hardware with it, I won’t show any comparisons between browsers (how many Goldfish they can show at the same time) and I promise not to go native (although that is the newest fad – calling HTML5 native).

What HTML5 means to a large degree is that the web is the platform – more than ever. We used the web with web services and for storage for years but now we move towards a world where we deliver both data and the applications on it.

The browser is the platform and is everything we need to help our end users fulfil the tasks they set out to do. Instead of having software packages for everything we just go to a web app and use this one. The browser offers us APIs and is fast enough nowadays to deliver great experiences. Webmail, collaborative document editing and image manipulation is just a first step in this direction.

The information how to do all that is available for you for free. A lot of HTML5 resources are out there on the web with full documentation and examples of what can be done. The openness of web development makes it unnecessary to go to expensive corporate training courses or buy any software – all you need is a text editor and a browser.

People are the key. If you look around you, you will find that the leading lights in the HTML5 world are not from one company or were known for years. Instead a lot of them come out of the woodwork totally unexpected which shows that this is much more about enthusiasm than about corporate backing.

We have so many new toys as developers! If I had had all the technologies we can play with across browsers in the past, I am sure my career would have been twice as fast.

Native HTML5 video and audio allows you to manipulate video in any which way and make it talk to the rest of the document. For example:

• You can rotate and zoom Video
• You can sync page content and video content
• You can overlay videos over animated maps
• You can analyse and manipulate video with Canvas to inject content

The latter is very interesting as Canvas and SVG (which is not HTML5 but a “friends” technology) allows you to go very rich in the interface. Using Canvas and SVG you can also enhance data in the page to create beautiful visualisations.

Another thing HTML5 offers are richer forms for the web including datepickers, sliders and autocomplete controls with in-built validation. This should safe us a lot of client side validation code that always gets out of sync and is hard to localise.

Other technologies do very much add to what HTML5 gives us:

Offline storage and local storage allows us to build applications that recognise the user’s connection state and keep them working whilst the connection is down.

CSS3 is the natural progression of CSS and means that we don’t have to create gradients and rounded corners as graphics but can make them easy to change and maintain in our code itself.

WebGL allows us to create 3D interfaces and animations in the browser. Google’s Body Browser is a great example of how rich that can get.

All this becomes very powerful when you mix and match the technologies. You can clip, transform and run filters like blur over video content, you can simulate green screen in video+canvas, apply shape detection to video content or even detect nudity in photos.

Give this technology to creative people and give them some time and beautiful things can happen. One example is Nike’s better world which looks and acts like a Flash interface but it clean HTML5. Other, ongoing examples of great use of HTML5 technology can be found at the Mozilla demo gallery.

Don’t think this is not you! We need everyone to play with HTML5 to make it work and be used. So if you have a cool HTML5 demo, please send it to us so we can pimp it for you!

The future of the web is a team effort and can and should not be in the hands of a chosen few following a corporate agenda, so please help us and join in! HTML5 is a debate and the more voices coming from different angles, the better the solution will be.