Click here to Skip to main content
Click here to Skip to main content

Tagged as

HTML5 Adoption Strategies

, 4 Sep 2011
Rate this:
Please Sign up or sign in to vote.
HTML5 Adoption Strategies

Introduction

HTML5 Adoption StrategiesOne of the questions that I got in the session that I delivered today was how to adopt HTML5 today? Since this was a very good question, I decided to share what I think about it.

Why Do We Need Adoption Strategies?

You might ask yourself why you need an adoption strategy for HTML5? The answer is simple. HTML5 includes many specifications that evolve in different rates. Therefore, the specification support in browsers is complicated to implement for the browser vendors. There are stable specifications such as Geolocation which are implemented by all the major browsers and there are less stable specifications like Web Sockets that aren’t. So, if you want to use an HTML5 specification in your web application, how can you do that without breaking your application in some of the browsers? The answer to this question is to ask yourself whether you really need the feature. If you really need it, then you can use adoption strategies in order to implement the feature.

Adoption Strategies

Here is a list of strategies that you can apply in order to adopt HTML5:

  • Lowest common denominator – This strategy is the simplest and it’s what I call the ostrich strategy (let's not implement HTML5 at all…). Applying this strategy is to look for the features that are implemented in all the browsers (or all the major browsers) and use them. This, of course, leave you with small amount of HTML5 specifications (or with none if you target very old browsers).
  • Vertical slices – In this strategy, you decide that you only target a specific HTML5 functionality and therefore “lose” browsers that don’t implement it. If you do that for public internet applications, it might harm your application’s credibility (since it won’t work for all the other browsers). This strategy is more appropriate for targeting mobile devices that is a growing market with less browsers to support and high HTML5 browser adoption.
  • Using Polyfills – Polyfills are JavaScript “hacks” that help to integrate HTML5 features into older browsers. For example, using Modernizr which “adds” the HTML5 semantic elements (header, footer and etc.) to the DOM can help to implement these elements inside your web application and get a consistent UX across older browsers.
  • Using fallbacks strategies – Some elements and APIs can’t be achieved with Polyfills (for example the Video/Audio element). In this case, you can use the HTML5 feature but you create a fallback if it isn’t exists. For example, adding a Video element can have a fallback into Flash/Silverlight if the Video tag isn’t supported in the browser.

Summary

When you want to adopt HTML5 today, you need to pay attention not to break your web application in older browsers and also in newer ones. This can be achieved by imposing some strategies such as the strategies that I mentioned in the post. If you have other strategies that you want to share with me, please do so in the comments.


License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Gil Fink
Technical Lead sparXys
Israel Israel
Gil Fink is a web development expert and ASP.Net/IIS Microsoft MVP. He is the founder and owner of sparXys. He is currently consulting for various enterprises and companies, where he helps to develop Web and RIA-based solutions. He conducts lectures and workshops for individuals and enterprises who want to specialize in infrastructure and web development. He is also co-author of several Microsoft Official Courses (MOCs) and training kits, co-author of "Pro Single Page Application Development" book (Apress) and the founder of Front-End.IL Meetup. You can read his publications at his website: http://www.gilfink.net
Follow on   Twitter   Google+   LinkedIn

Comments and Discussions

 
-- There are no messages in this forum --
| Advertise | Privacy | Mobile
Web04 | 2.8.140902.1 | Last Updated 4 Sep 2011
Article Copyright 2011 by Gil Fink
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid