A quick introduction to HTML5

By December 9, 2011 No Comments

The internet needs an upgrade. HTML is the dominant language for structuring web pages, but it is over 10 years since the last version was released, and the web is now a very different place. Back then, the average internet connection was barely fast enough to watch a video, and mobile phone users were quite happy with using their device to make phone calls. Today, internet speed and computing power, storage and graphics have improved exponentially, and everyone expects their mobile devices to do everything their computer can on the web.

HTML5 is not actually a new version of HTML, but a family of new technologies, including CSS3, a few additions to HTML and several powerful new features known as APIs. HTML5 is still in the early phases of a rather lengthy development process, and it may not be finalised until 2022. For some it appears that it is just too early to start worrying about something that is so far away. However, the reality is that many features of HTML5 are already supported by the popular modern browsers. It also has many tools which can be used to create rich, interactive, dynamic websites.

Please note the demos may not work in all browsers. Try upgrading to the latest version if you have any problems.

More for Mobiles

Over the last few years, mobile devices have made huge leaps in power and in popularity. While computer users have a choice of which browser and plugins to install, this is often decided by the manufacturers of mobile devices. This leads to issues such as the hugely popular plugin Flash not being supported by the iPhone. HTML5 brings a consistent standard which every manufacturer can use, which allows for greater compatibility and richer content on the mobile web.

Advanced Graphics, 3D and Effects

Canvas and SVG are two very useful new features which allow developers to create programmable graphics. This means that they can make complex games and apps without the use of other programs. It is even possible to create interactive 3D graphics using WebGL or CSS3.

Here are a couple of games and other clever demos of what can be done with SVG and Canvas.

Audio and Video Support

Audio and video can now be placed directly onto a page without the need for any plugins, which lets you make things like this interactive music video.

Improved Interactivity

Every API brings a powerful new features to HTML5. For example, Geolocation allows a website to find out where the user is. It offers exciting new possibilities for games, as it offers www levels of interaction between games and the real world. There are many other potential applications of this technology, such as targeted advertising or social networking.

Drag and drop allows people to drag and drop almost anything on the web, just like on their computer. There are several other APIs, most of which deal with more technical issues adding improved functionality.

This page uses Geolocation to give you the weather where you are.

Greater Efficiency and Performance

There are several new features which allow websites to load and run faster. Websites and apps are now able to utilize more of the user’s computing power. Also coming with HTML5 are Web Workers, which allow your browser to deal with Javascript processes separately, which can prevent many browser problems.

Site performance is very important as it makes your users happier. Less strain on the computer means less energy use, which is important for anything that uses a battery. Research from big internet companies has shown that even small increases in loading times have a direct relationship to their revenue per user. Moreover, Google has recently included site speed in its search algorithm, meaning that faster sites get ranked higher on their search results and will therefore get more visitors.

Do More Offline

A very practical addition is the new offline storage capability. This allows users of mobile devices to store pages, apps and other data for when they have no internet access. This has a multitude of applications, such as allowing offline use of web apps, and storing interesting or useful articles for when you need them.

Backward Compatibility

Unfortunately, every aspect of HTML5 has different levels of support from the various browsers. This was always going to be a problem, so many features are designed to be compatible with older browsers. There are also many programs out there to help with this. It is even possible to design websites to provide alternatives to fall back on, without the user having to do anything.

This is just a selection of the many changes and useful new features coming with HTML5. It will also make many old features easier to implement. It is the biggest step forward for the web in many years, and it promises to make things faster, more reliable, and more powerful. While it may be a few years before it is fully supported by everyone, we can’t wait to get started.