Mobile Applications V HTML5
Developing for mobile has long been seen as a fragmented activity. “I want to take my brand or product onto the mobile channel, whilst maintaining the richness that the PC internet has allowed me”. “How do I do this?” “Oh, it’s not that easy. I have to develop for each mobile platform?” “There are so many”. “How much will this cost?” “Is a Mobile Internet site the way to go?” “Maybe I will leave it for now.”
With the launch of’ Smartphone’ mobile phones (55 million handsets in Q1 2010 worldwide), in particular Apples iPhone and more recently Googles Android , we have seen a huge move towards development of mobile applications. The main driver for this huge ‘gold rush’ has been well documented by many. People with these types of phones are willing to browse the internet, download applications and spend money via mobile transactions, valuable consumer behaviours to a brand.
For brand and product owners the rich experience such devices allow has tempted them to invest in mobile application development. But doesn’t it feel like we have gone back 15 years, asking consumers to install packaged software?
With the addition of HTML 5 standards, we have an environment that offers a single development opportunity whilst allowing for a rich consumer experience. This is now a realistic rival to application development, albeit, very early days. The development costs will be lower, the potential market size will be much bigger and it will be much easier for people to find your site by using any search engine.
Pros and Cons of mobile application V mobile web (using HTML 5)
What is HTML5?
HTML 5 is an extension of existing web markup language standards. The main building block of any website is its markup language. The markup language is what structures the information on the page e.g. indicating that one block of text is a heading and another block is a paragraph or a list.
HTML 4 and xHTML are the most commonly-used markup languages today, and they share a common set of elements for marking your web-based documents. Using the elements correctly means that you’re applying concrete semantics to your documents, giving them the best chance of being understood by the widest variety of browsers.
However, HTML 4 and xHTML don’t have a particularly wide variety of elements available, which leads to a limited ability to semantically describe the content of your page effectively. The semantic interpretation of HTML 4 has always been a subject of debate among web standards experts. Thankfully, HTML 5 offers a significantly expanded palette of semantically meaningful markup elements.
What does this mean for mobile development?
The current norm for web based applications is the coexistence of HTML4 compliant pages with propriatory plugins such as Flash, JavaFX and Silverlight. These Plug ins have filled a gap that up until now browsers such as Internet Explorer, Firefox, Opera and Chrome were unable to fulfil. This was native support of rich Multimedia experiences in a web page, whether it be a Flash game, embedded video players, audio players and interactive web pages. Relying on 3rd party plugins to provide these experiences doesn’t fit with the model of openness and standard compliancy that has pushed the development of the net and browsers to this point.
The W3C created the HTML 5 specification. It outlines a number of open standards that will allow developers to create rich web based applications, games and interactive experiences that most new browsers will comply with. Not relying on 3rd party plug-ins means that most of the features are native, and thus faster performing.
An overview of some of the important new features are now explained;
Video/Audio: Instead of Flash being the standard plug-in for playing video online, there will be native video support across browsers that comply with the HTML5 specification. Embedding a video in a page will be as simple as using a video tag, followed by whether you can see the video controls, and then a reference to the source video. There will be no need to provide Flash objects in the page.
Similar to the new native Video Player, audio support will now be supported natively. So if you want to embed an audio player within your page you need only add the appropriate tag and reference your audio file. If you want to style your audio player you can do so using the age old method of Stylesheets and HTML. The same applies for video player. Previously adding video and audio required knowledge of flash or an appropriate plug-in, especially for styling the controls or adding video/audio control features.
Canvas: The use of the Canvas attribute in a page will allow the browser to render 2D graphics to a page, something that previously relied on 3rd party plugins such as Flash to provide. This will allow for game development, and also pages that use rich graphical experiences that don’t run within a separately sandboxed Flash app. As it will be based on the open standards that have thus far powered the web, all code will be free to use, reference and learn from. This will Lead to greater innovation and sharing of ideas.
Geolocation: Mobile Devices are increasingly coming shipped with GPS as standard.The only phones likely to support the HTML5 standards are going to be smart phones. To this end the iPhone4 is currently leading the way in HTML5 compliancy.
Geolocation essentially allows a web page to access the devices geolocation details if they are allowed (Privacy is a definite issue in this regard, and it’s likely all devices will not allow pages to automatically acquire access to your location without prior authorization). The benefits of this within a web page are limitless. Location based services are going to become a lot more useful and contextual web pages will change the way a lot of web pages deliver their material, especially if you are dealing with commerce/transaction based websites.
Storage: One of the more popular buzz words at the moment is the concept of cloud based computing. What this means is the removal of most of the computing from your device and allowing the mysterious cloud to mange most of your devices computing needs. In additon all your data will be accessible across a range of channels you might use in your daily life, and all from the same source. Google already implement this concept across their Chrome browser and Mobile Devices. Google Gears is a 3rd party implementation of the new HTML5 storage concept. It essentialy allows your local device to synchronise files between the local file system and the cloud. For example imagine you are working on a document, to open it you will use your browser. The file will be on a web page somewhere, something like Google docs. When you start working on your file it will be copied locally. So in the event of a disconnect from the internet (cloud), your file will continue to work and you will have no issue saving and editing it. Once you gain contact with the cloud connection will be re-established and your browser will automatically synch between your online and local storage. This allows for instant backup, and also if you need to manage the same document from another device, such as your mobile device, all you need do is access it through the HTML5 compliant browser.
Additional storage features allow for Databases to be saved locally, ideal for a game that may need to use a light database version to store information without doing round trips to a server on each user action.
HTML5 storage will be a sandboxed storage separate from your OS file system, providing for better security.
Offline Web Applications: Coupled with the storage feature, this essentially means that if you are using something like a browser based word processor it won’t suddenly break if you lose connectivity to the internet. The use of local storage and the ability for a browser to cache the contents of the web application allow for continued use until such time as the connection is re-established. In essence we have persistence.
All of these new features are designed to be device independent. There will still be implementation headaches such as device adaptation, or compliancy, but the bones of the needs for the webs next big evolution are there. Currently most browsers are unable to support all of the HTML5 standards, but within the next few years compliancy will increase, and the new features and abilities will be available to all.
There are many more features, within HTML5 not documented here, they tend to be more orientated towards the more technical web developer side of things. These include Workers, which will allow web applications to utilise threads (implement multiple tasks at the same time.). There are also markup features that allow for element grouping, better control of text etc.
Limitations today:
Despite this move towards a full rich browser experience, there are limitations today. Below is a summary these;
Device support:
For a full implementation of HTML5 the mobile browser needs to support the full specification of the HTML 5 standard. Today, the iPhone 4 is one of the most advanced mobile devices to do this. However, it still does not fully support the full standard. Using html5test.com returned a value of 195 out of 300 for HTML 5 support. At time of writing we were not aware of another browser on a mobile device that could match the iPhone 4.
Processor limitations:
To support complex in browser applications e.g. multi threaded, multi functions with implementation of the 3D specification may be too challenging in the mobile environment at present. Currently it is unclear of the impact on the mobile devices performance. The ideal place to get to would be optimal experiences that work in both a PC and mobile browser. Due to the limited range of devices that support the HTML standard, we are not at the point of being able to judge this. We do though doubt we have enough capability on the mobile devices today.
Bespoke derivatives:
Specific mobile components pushing away from a common platform implementation of the standard will affect the uptake of HTML 5. We do not want to add additional fragmentation to mobile.
The future:
Having seen large high profile brands and companies developing demo apps using HTML 5 in the mobile channel, we are pretty excited about what this will mean and what we will be able to do. Google, Youtube and Facebook have all stated the future lies in the browser, not mobile applications.
We acknowledge that we would all like a Flash equivalent experience within mobile. We believe HTML5 will allow type of rich and engaging experience, although it will take a few years for the device ranges to start supporting the HTML5 standard.