HTML5 in Apps

HTML5 is definitely the top UX technology to come in the last few years and is set to dominate the space in coming years. I wrote a post a while back about the promise of HTML5. This post is a look into using HTML5 in apps, with a closer look into PhoneGap and Windows 8 Web Apps. Thanks to cross company efforts and a lot of hard work from standards groups, HTML5 is already well adapted. All the major browsers Chrome/IE/Safari/Opera/Firefox support HTML5 and are completing to keep current with the standards. It is also interesting to see that pieces of the standard are being adapted even before the standard is finalized giving a push to the standardization process itself. Google, Apple, Microsoft, Amazon, Netflix etc are the companies that are betting on the success of HTML5. Microsoft’s move towards HTML5, much to the chagrin of a considerable silverlight developer base emphasizes this.

With the success of iPhone and iPad, we have seen the explosion of mobile app marketplace and developer focus shifted to the platform. Though the development environment is relatively primitive on iOS, we saw hundreds of thousands of apps in Apple’s AppStore doing amazing things. If you have a successful company, chances are that you have an iOS strategy. The first generation of apps could target close to 100% of the market by just having a iOS version. Finally after years of apple domination, we are seeing a glimmer of hope for other viable platforms in mobile and tablet markets – Ice-cream sandwich, Amazon Fire, Windows 8. As tablets are reaching an inflection point, there are several strong choices emerging and this would mean that app developers need to worry about being cross platform. Instead of targeting web and iOS, we now need to think about targeting web/iOS/Android(Several flavors – Amazon Fire included)/Windows 8 along with a myriad phone OSes and  of course the desktop. This is where HTML5 steps in as a cross platform app framework.

“PhoneGap is an HTML5 app platform that allows you to author native applications with web technologies and get access to APIs and app stores”.

If you are interested in mobile app development, you should check out PhoneGap. Its is a very easy to use toolkit that allows you to leverage the HTML5 capabilities that are supported most platforms to “write once and run everywhere”. The best thing I like about PhoneGap is its plugin architecture and the community around it. The plugin architecture lets you expose the capabilities traditionally available only in native apps into HTML5 and javascript. There are scores of plugins written and shared by people that will get you started on whatever magic your favorite gizmo can do. Given the power of HTML5 and the plugin architecture, there is little that your app cannot do.

Compared to developing in Objective-C or Java or C#, HTML5 + JavaScript is a breeze. As with any technology, you need to know what you are doing to get the best out of PhoneGap. There are several things to keep in mind.

• PhoneGap is not an excuse to make your app look like a website. Apps still have to look native and preserve the flow of the device they are running on.
• You need to take care to make sure your app UX is snappy. Browsers are getting better but there are still some places where you need to understand how to work around issues. Thankfully there is a big community that can help.
• There are always those rare scenarios where you need native code. Recognize them and make a plugin.

There are several UI frameworks that can give you UI that looks natively mobile – jQTouch/Sencha/Dhtmlx. Look at these demos for to get the picture.

http://www.dhtmlx.com/touch/samples/
http://www.jqtouch.com/preview/demos/main/#home
http://dev.sencha.com/deploy/touch/examples/

This one is my favorite – http://www.jqtouch.com/preview/demos/clock/#home.

Windows 8 has a different take on application development than iOS/Android and most other platforms. Instead of making HTML5 available to apps by embedding a browser control, Windows 8 makes HTML5 a first class citizen and provides a platform for building metro-style apps completely in HTML5 with full access to everything that the OS provides. This is similar to PhoneGap’s approach only supported from grounds up.

The Phone/Tablet market is evolving fast and there will be many players with enough market share for developer to take notice. Be it enterprise apps or games or front end apps for web services, taking a cross platform approach makes more sense than ever.

http://www.phonegap.com/apps has an impressive collection of apps written using PhoneGap.