Ryan Tyrrell  Ryan Tyrrell

HTML5: Are We There Yet?

Home > Blog > HTML5: Are We There Yet?

HTML5 is the fifth major update to the language that drives web pages. With a promise of making the complicated business of cross-platform development a walk in the park, has it delivered?

What defines a cutting edge web app seem to change almost daily. What was recently impossible to create using web based languages like HTML, CSS and JavaScript, is now trivial for even a novice developer.

Plans to evolve HTML5 were announced back in 2004, but it wasn’t until around 2010 that we really started to pay attention. With HTML5 came the promise of simple audio, video and image manipulation, as well as features to allow animations, data storage and custom font usage across all web browsers. This promised to solve the major problem that arose when Apple announced that browser plugins, like Adobe’s Flash, wouldn’t be supported on iPhone or iPad. The theory is that by using HTML5, we can create one product that runs across all popular mobile, tablet and desktop devices. For a studio focused on games and interactivity, that’s the development Holy Grail.

So has HTML5 delivered on that promise? Let’s tackle the gotchas first.

As the specifications for HTML updates are written by developers, for developers, these take a long time to test, approve and implement. Browser updates don’t exactly come thick and fast. Over the past 3-4 years, browsers have adopted HTML5 features at different speeds, even adding features that were not yet signed off as part of an agreed specification. Because of this, getting good at developing using HTML5 is an ongoing process of building knowledge through trying and testing.

We were early adopters here at fish in a bottle. Our objective was to use HTML5 to create games and apps that worked on as many devices and browsers as possible, while future-proofing for those that would implement HTML5 standards down the line, like Smart TVs. This was never going to be an easy challenge.

Browser nuances in audio and video limitations, feature implementation and performance ability meant we often needed to re-code something multiple times in order to make it work. Even sometimes degrading the experience on more capable devices to account for the weakest, lowest common denominator. A lot of time would be spent getting our products to look right across an array of screen sizes, along with a huge amount of time invested in figuring out the different ways browsers had implemented the HTML5 specification.

Today that’s much improved. Many browsers have streamlined their approach to HTML5 and developing with it has become more straight forward. With the latest Android based browsers not differing too much from the latest iOS browsers, and major updates to Chrome, Firefox and Internet Explorer, each new HTML5 project becomes more straight forward.

The key to using HTML5 successfully is to identify and plan for the weakest device/browser combination for every feature of your application. That applies to games, websites and apps. Maybe an iPhone running iOS5 gives the weakest audio performance, or Internet Explorer 9 gives the weakest animation performance. By understanding that and tailoring the product to play to its strengths and fallback comfortably on its weaknesses we can ensure the best performance possible across every device we’re targeting.

starwarshtml5Our Star Wars: Master The Force game for Disney runs across all popular devices, operating systems and browsers. 

Of course, with all of this comes the need to have a testing lab with access to all of the devices, operating systems and browsers we support. That’s an ongoing challenge in itself, but services like BrowserStack and specialist third party testing agencies make it possible. But then HTML5 has recently truly broken free of browsers and can now also be used to write desktop software as well as mobile specific software, and even to control robots!

Middleware frameworks such as Cordova and PhoneGap now enable us to write mobile apps using HTML5 and deploy them across all major mobile and tablet devices. That means we can create one product using one framework and deliver it over a mind boggling variety of devices. This makes HTML5 an outstandingly versatile and cost effective solution for mobile application development. That’s the approach we took with the Science Museum app we recently launched.

informationagehtc

Using Cordova we were able to make the Science Museum’s Information Age app available on a vast number of mobile and tablet devices.

The march of HTML5 seems unstoppable. The Nintendo WII-U now supports HTML5 and Node-Webkit software allows for desktop applications to be built solely using HTML5 technologies. Games like A Wizard’s Lizard and Game Dev Tycoon are on Valve’s Steam gaming platform. Both were built using HTML5.

Yet HTML5 perhaps has one last major hurdle to overcome. Commercialisation.

HTML5 commercial opportunities are sparse and there is still no de-facto way for HTML5 developers to monetise their applications, especially games. The Google chrome web store has a few HTML5 games and apps available for purchase, however there’s a lack of big hitters. There’s no doubt that HTML5 is a harder platform to monetise than platforms such as Adobe’s Flash. However, this will change. With the viability of HTML5 as a platform specific development technology, there are commercial opportunities to be had. That’s definitely supported by a rise in the number of games and applications built using HTML5.

Our clients, including the BBC, Disney and Nickelodeon, are investing heavily in HTML5 to maximise access to their games. We’re also working with startups including fast moving ventures like Avenue Imperial to deliver native app quality experiences within browsers.

We’re not completely there yet, but there’s no doubt that the smart money is still firmly on HTML5 as the cross-platform technology of the future.

__

Ryan Tyrrell

About Ryan Tyrrell

Ryan is a the studio technical lead at fish in a bottle, he specialises in web technologies and works across apps, web platforms and games.