What Should Customer Experience Professionals Do About HTML5?

The increasing popularity of Apple’s iPhone and iPad – neither of which supports Adobe Flash and Microsoft Silverlight – has piqued interest in HTML5 as an open source solution for creating Rich Internet Applications (RIAs).  Steve Jobs’ recent attack on Flash as being unfit for the iPhone calls into question the long-term value of player-based application platforms. But can HTML5 really replace Flash and Silverlight? 

To understand the user experience pros and cons of HTML5, Rich Gans – one of our Researchers serving customer experience professionals – talked to designers and developers at Cynergy Systems, EffectiveUI, Roundarch, and Yahoo! who are building complex online functionality. We have just published the results of this research in a report entitled “HTML 5: Is There Any Truth To The Hype?”

The truth is that while HTML5 is promising and can help improve experiences for text-based content, it is not yet a viable alternative to player-based technologies for designing rich, highly functional user experiences. 

The downside to using HTML5 today is that it:

  • Could lead to inconsistent experiences across today’s browsers
  • Will require that users download a browser that supports the technology
  • Compromises performance for graphics-heavy experiences

 

 However, there are a few places where HTML5 can help improve user experiences today, including: 

  • Experiences for people with disabilities
  • Apps that are solely intended for Apple devices
  • Producing text-heavy sites that require text resizing

 

The net of this is that, for now, HTML5 is not a viable platform for delivering the next generation RIAs that will power the future of online customer experience. Forrester recommends using HTML5 as a way to enhance text-based content experiences while looking to more established technologies like Flash and Silverlight to build highly functional applications.

Comments

I read the research, but

I read the research, but don't think I'm in agreement. The part that I found striking was the apparent linking of "consistent experiences" with legacy browser support. Specifically IE6 was mentioned and even Microsoft has mercifully ended support of IE6. HTML5 sites work pretty seemlessly for me on Firefox, Chrome, Safari (inlcuding on the iPad) and even Microsoft has pledged support for it in IE9. So this point seems curious at best, anachronistic at worst. And while you seem to crush HTML5 for needing the latest browser updates, you give Silverlight and Flash a pass when they require plug-ins and frequent updates to operate. It seems incongrous. Frankly, I've never loaded Silverlight on any of my browsers and as such that RIA doesn't work for me at all.

I was also a little puzzled by the question about video support. To my understanding (which technically I admit is substantially limited), HTML5 was never meant to be a video rendering engine, but that it would serve up video via the H.264 CODEC. Are you saying that H.264 running inside HTML5 site provides inconsistent video playback?

Lastly, I want to touch on the point about performance. Perhaps Flash isn't a burden on desktops or notebooks because of the graphic acceleration cards, but in mobile devices computing resources are severely constrained and therefore RIA engines like Flash cause performance and stability issues. I'm not trying to parrot Steve Jobs/John Gruber talking points here, but it's an issue. Do you have any benchmark data on both desktop and mobile devices to show the relative performance impacts you reference?

Thanks,

Glenn

I'll Try to Clarify Some of the Points

Glenn,

I read through your comments, and thought I could answer some of the points that you raised. To give a little background, I have been working in the interactive industry for approximately 13 years and have been working with both Flash, HTML/Web Standards, Java Processing, and (more recently) Objective-C. I value the benefits of all the platforms, and will switch without prejudice to meet the needs of a project's requirements and objectives.

With regards to consistent experiences, the article does state that this is how it is "today." IE browsers currently make up just under 60% of the browsers used on the internet today. Since IE 9 is still is not yet released this poses as a large problem with regards to the general ubiquity for HTML5.

While Silverlight typically requires a manual download on Macs and older Windows machines, Flash (with the marketing efforts of Macromedia and now Adobe) will typically come preinstalled on a machine. Google has recently pledged to natively include the Flash Player in it's Chrome browser with automatic background upgrades. Flash also uses express installation features as well as auto-upgrading on Windows platforms. Users are also more willing to click accept for a plug-in upgrade than they are to switch out browsers all together (one of the primary reasons for IE6's persistance). The above items have had a huge impact on Flash's ubiquity, and can continue to play a big part going forward if things remain the same on this front.

H.264 is not supported by Firefox so this will cause problems going forward when it comes to consistent video support. The reason for this lack of support is that H.264 isn't an open standard; they have elected (for now) to move forward with OGG. This inconsistency could still require a Flash fall-back for anyone using an older browser, or a browser that doesn't support H.264.

The last item regarding Flash having performance and stability issues is a common misperception. Multimedia (specifically graphic-heavy multimedia) will inherently require more processing power to run effectively. This can be seen and tested even when running graphic-heavy HTML5/CSS 3/JavaScript interfaces and animations. Frame rates for the latter are significantly lower than their plug-in counterparts. That being said, the onus will be on developers to learn how to tap into and optimize for mobile devices. When Flash is compared to HTML5, Silverlight and other tools designed for RIAs the processing power is comprable.

I've provided a link here to benchmarking results on the subject for reference: http://themaninblue.com/writing/perspective/2010/03/22/

I don't believe that this is an Apple/Adobe or Flash/Standards issue, but try my best to take a pragmatic perspective on the subject. Hopefully, I've been able to answer some of the points mentioned.

Respectfully,
Patrick

Thanks for the feedback

Glenn/Patrick,

Thank you for your comments on this blog post and thank you Patrick for answering Glenn’s questions before I had a chance.
Just to add a couple additional points to Patrick’s response:

1. With regards to consistent experiences, it is true that IE browsers currently make up just under 60% of the browsers used on the Internet, with IE 6 holding onto a little under 18% of the total browser market share as can be seen by the data found at Net Market Share. The persistence of IE6 is heavily seen in Enterprise environments where firms have customized enterprise applications that may fail or require additional resources to make it work with upgraded browsers. In addition, none of the major browsers have a consistent level of support for HTML 5, with the current versions of Internet Explorer falling far behind the rest of the browser players. All of this combined creates challenges when trying to create a consistent experience today.

2. Requiring users download player updates is much less intrusive than forcing them to download a completely new browser. As Patrick mentioned many of these updates either run in the background or simply require clicking a button when presented with the upgrade pop-up box. On the other hand, switching browsers requires users to re-learn where everything is found. For example, it was easy to find your favorites in IE 6 (just look under the “Favorites” menu), but was not as easy to find when upgrading to IE 7 (gold star = favorites, who knew). Obviously all the browsers want to create a unique look and feel that they envision will provide the best experience for users, but this still requires a bit of learning on the part of the users, creating a potentially frustrating experience.

3. In terms of performance, developers who were interviewed for this report they told me that, in their experience, HTML 5 animations and transitions did not perform well on machines with lower processing power, forcing them to design applications with other technologies. That isn’t to say that HTML 5 won’t catch up eventually, but as it stands today, it underperforms against Flash and Silverlight when applications require sophisticated graphics.

Will HTML 5 ever be a viable solution for designing Rich Internet Applications? Only time will tell. But for now, it’s certainly not the best choice out there.

Thanks again for the feedback and I hope this helps add some clarification.

Rich

Thoughts

Some things to consider in your arguments:
1. Rendering differences are typically down to poor standards support and differences in rendering engines. These are far better now than a few years ago. Also when talking about RIAs you should take into consideration that a canvas would have almost no differences in drawing, as you are doing it pixel perfect your self.

2. The IE argument is only slightly valid for a few reasons:
You can use Google's chrome frame plugin to bypass IE's rendering engine.
You can use framworks to use features of IE such as VML to re-produce some features of HTML5 not yet implemented.
When using an RIA it's a lot more acceptable to have minimum requirements. For example requiring Flash Player 10+ in order to use Spark in Flex4.

3. Performance is at the mercy of the browser manufactures. A good example of this is Apple's Safari that out performs other browsers on the system by a long way. This is much better than relying on one vendor (Adobe) to improve performance. Just look at how bad the performance of Flash on the mac has been recently, let alone mobile.

I feel you also need to understand the difference between using HTML5 for a web page, and HTML5 for an RIA. With the canvas tag you could recreate your own rendering engine.

You should also be aware of frameworks like Capuchino, Sprout core and Google Web Toolkit that take away the pain of browser diferences.

All of the RIAs I have written in Flex could easily have been done using these frameworks, and they are still very very young compared to a mature product like Flex.

Please do more research before coming to such damming conclusions.