Why Flash and HTML5 need each other
While there are people who would like to see Flash banished from browsers in favour of HTML5, Flash is not ready to be replaced.
Internet gambling company bet365 has found there is no one suite of technologies that can reliably serve rich web content to the multitude of computers and mobile devices used online today.
Rather than HTML5 and its associated web technologies being a silver bullet — capable of underpinning sites and apps for machines of different sizes, running different browsers and supporting different web software — the company has found it is just one of several technologies needed to support the zoo of internet-connected devices.
bet365 offers a website, as well as mobile apps for iOS and Android built by creating a native code wrapper around its website. The site dynamically adjusts its layout and underlying technologies based on the capabilities of the connecting device. The advantage of building mobile apps using a wrapper around the site is that it requires less coding than building apps for each platform in native code.
A key reason that bet365 doesn't want to completely abandon Flash in favour of HTML5 to run animations, video and audio is a lack of desktop support. Internet Explorer 8 and earlier are still used by just under one third of desktop web users, but these browsers don't support the HTML5 <audio> or <video> tags.
"I think it's fair to say that the saturation of Flash on the desktop is still higher than the number of people who can receive HTML5 globally. We still have customers on IE6," said Alan Reed, head of the systems team at bet365.
Serving the site to mobile is different story. While about half of bet365 customers access its services using a mobile device, many such devices don't support Flash; indeed, Adobe has stopped Flash development on mobile. To better serve the mobile market, bet365 has begun offering video and audio in HTML5 <video> and <audio> tags, removing the need for a Flash plug-in. It is also using the JavaScript inside the HTML5 <canvas> tag to run graphical animations of what's happening in sports games.
"Mobile has given us a different set of challenges, where you're looking at pretty much a no-Flash world on mobile and tablet — whereas we've been using Flash as our standard bearer and way of delivering that richness on the desktop," Reed said.
Given the widely varying capabilities of browsers and desktop and mobile devices connecting to the web today, Reed said it was becoming increasingly complicated to serve their varying needs.
"It's a huge challenge because it seems to be every day somebody, somewhere brings out a new device and we're trying to get global coverage," he said.
bet365 uses client-side software to detect the capabilities of the browser and the device connecting to its services. Specifically, it uses the Modernizr JavaScript library as a framework and suite of standard tests to detect standard browser features, but also builds on top of this framework custom feature-detection tests that decide whether to enable higher-level features — such as its Match Live graphical animations or advanced scrolling. Server side detection of multimedia stream formats supported by devices is also carried out, using .Net functions to analyse strings in the User-Agent header.
"We'll look to detect by device, by browser, by screen size, and by geography as well, as sometimes in a different territory we will serve a different site," Reed said.
And supporting mobile and non-PC devices doesn't just mean Android and iOS; bet365 tries to scale back its website to a very simple configuration so punters can still place a bet on a "low-end Nokia phone" or a games console web browser.
"We had to be very careful of what we drop and what we can't have and the design has to cater for that," Reed said. "We're very concerned to tailor the content to what the user can see. If you can't support something in your browser, you won't see it. It's about graceful degradation of service."
When will Flash go bye-bye?
There are also areas where the HTML5 spec still has some way to go to catch up with Flash's capabilties, Reed said, for instance when animating vector graphics using JavaScript and a HTML5 <canvas> tag rather than Flash.
"Flash does vectors very well. HTML5 still has some way to go. You'll get some visual degradation [using HTML5] and also you have to write a lot of code. It takes a lot of JavaScript to do the same thing," Reed said.
Eventually, Reed thinks a tipping point will be reached where HTML5 support vastly outweighs Flash, but doesn't see Flash support going away for some time.
"Once our customers say 'We've more devices that can do one than the other' that will probably be the day but I don't know when that day is," he said.