Posts Tagged ‘HTML5’
bemokoLive has been built ground up with the consideration for user connecting from a variety of devices and the rise of popularity of HTML5.
One day many of the apps you see now in the app-stores will be available as cross platform web apps supported by all devices with user experience and performance comparable to that of the native application. bemoko are making this happen.
So what is new in HTML5?
… and how is that going to elevate the web experience for the end-user?
HTML5 brings a wealth of enhancements that can elevate the standard and experience of web applications. Functions include:
- Video and audio support
- Canvas for enhanced graphics
- Geolocation API
- Local data storage
- Context menus
- Drag & drop
- Data grids – structured editable data sets
- New semantic elements, e.g. <section> and <article>
Offline and Synching Data
A key benefit of native applications (desktop or mobile) is the ability to interact with the application whilst you are offline. The HTML5 offline support allows web applications to achieve this. Google have demonstrated their support for the HTML5 offline support by announcing that they are no longer supporting Google Gears – an early solution for for offline web access – and are backing the HTML5 offline APIs and along with strong support from the major browsers is an indication that this API will mature and become an essential foundation for the web.
Offline storage will be an essential ingredient of any web application that requests information from a user and delivers essential information that a user would want to access anywhere, anytime. For example when a user fills in a forms, or edits some data it is an important aspect of the user experience that the information entered is not lost and causing frustration. With HTML5 changes can be stored locally in the browser and synced with the main server when a connection is re-estabilished. Information applications – such as travel guides – also provide much more value if you can access information quickly and reliably, even if you are in the tube, on a plane, or in a foreign country on an expensive data plan.
Native Media Support
HTML5 brings native media support to the browsers. There has been much fragmentation in the format of video and audio that is required for web delivery. Historically this also came with a lack of control for how the media will be displayed (e.g. embedding in a page) and the requirement for extra plugins. This makes it more costly for service providers to deliver media and makes media experiences less than seamless for the end user. By standardising the media support within a web environment this fragmentation can be brought under control, making video deliverable easily accessible to all and make experience more pleasurable for the user.
There is still the ongoing battle between the Ogg and H.264 video codecs – with H.264 bringing improved video delivery, but in a propriety format. With strong and passionate arguments on either side. H.264 is looking like it will be the victor, but only time will really tell. (blog update : see update below on video support why this is not so certain). Standardisation brings with it significant performance benefits with device manufactures bringing standard video codec processing into hardware instead of software which can lead to over twice as much battery life.
Geolocation API
The Geolocation API already brings with it the possibility for the user to share their location. By design, this is a user choice on a site-by-site basis – choosing to share their location when they feel they’ll benefit and when they trust the service provider. This opens web sites up to the opportunity of location base services, such as finding people or places near by, combined with mapping services this can all help to create a more pleasurable experience with a service provider – saving time and shoe wear.
Canvas, drawing and graphics
The canvas features of HTML5 bring enhanced control over dynamic graphics, providing the opportunity to add a new dimension and interactivity to web sites. This provides a foundation for the popular javascript languages, for example jQuery and Prototype, to deliver ease-of-use tools bringing this creative power to even the novice web designer. It will however take some time (if at all) before the HTML5 canvas functions reaches the capabilities of Flash. Even with Apple’s objections to Flash, Flash will still provide much value to the web experience for some time to come.
HTML5 Apps vs Native Apps
Will HTML5 apps become more like desktops apps? In some respects they will surpass them – the idea of storage of your data in a secure cloud that that is accessible everywhere, backed up for you, accessible across multiple platforms and with an application that is always kept up to date for you will in many cases make the idea of a local installed piece of software seem quite limited. HTML5 will become the defacto standard for delivering cross-platfrom applications. The dedication to HTML5 by the large players, including Google, Apple and Microsoft , is a great example of the big players aligning and demonstrating the importance of getting HTML5 right.
HTML5 mobile apps
All-in-all, life will be become more exciting for the web developer. HTML5 is relevant for web developers today. Although HTML5 is still in draft, many features of HTML5 – such as geolocation and offline support – are already available in leading major browsers. This is especially true for recent mobiles such as the iPhone and Android platforms which all benefit from the improved user experience that HTML5 can bring.
How does this impact cross platform delivery though? Even as HTML5 matures different platforms will need variations on the UI. For example a TV user interface will always be different to a touch screen user interface. The challenge is also made more apparent when you consider that there’ll always be evolution in web capabilities. It’s natural for manufacturers and consumers to demand innovation and continue to push the boundaries.
bemokoLive cracks this problem elegantly and allows you to control the user experience across multiple channels efficiently – delivering to the recent innovations, the standard majority and lagging legacy environments – all from the same source.
Try bemoko now – download here and be up and running in a few minutes.
Further Reading
If you want to read more about why HTML5 is changing the game take a look at the following articles from the industry experts:
- “Rather than use Flash, Apple has adopted HTML5, CSS and JavaScript – all open standards. Apple’s mobile devices all ship with high performance, low power implementations of these open standards. HTML5, the new web standard that has been adopted by Apple, Google and many others, lets web developers create advanced graphics, typography, animations and transitions without relying on third party browser plug-ins” Apple (Steve Jobs) – Thoughts on Flash
- “The new crop of HTML5 web browsers are capable of some pretty amazing things, and several of our engineers decided to take some 20% time to see how far we could push them. The result? An HTML5 port of Id’s Quake II game engine!” Google Web Toolkit blog – Look ma, no plugin!
- “The future of the web is HTML5. Microsoft is deeply engaged in the HTML5 process with the W3C. HTML5 will be very important in advancing rich, interactive web applications and site design. The HTML5 specification describes video support without specifying a particular video format. We think H.264 is an excellent format. In its HTML5 support, IE9 will support playback of H.264 video only.” Microsoft blogs – HTML5 Video
- “But making iPhone apps means going through Apple’s lengthy approval process and dealing with some hardcore development. There’s a way round this, though, by offering something via a mobile browser using HTML5.” NMA
blog update – 2nd May 2010 : video, H.264, Ogg and VP8 support
The article Behind the open codec FUD attack make’s the case that Mozilla is unlikely to adopt H.264 since it cannot afford the $5million license fee. Google’s VP8 format may provide the compromise solution.
… or in other words we can readily synchronise local browser storage with back-send server persistent storage. This is one of the fundamentals of compelling off line web applications.
So a little background. You may know that you can store data in your local browser database with javascript like …
1 2 3 4 5 6 7 8 9 10 11 12 13 | function store() { if (window.localStorage) { var count=window.localStorage.getItem("count"); if (!count) { count=0; } count++ window.localStorage.setItem("count",count); } } window.onload = function() { store(); } |
and you can even see it in action here, if you got a decent browser such as the latest iPhone 3, Firefox 3.5, Safari 4.
But this ain’t much good if you can’t get this data back to the server to do something useful with it, e.g. share with friends, share with your other devices, keep a backup, send a message … I could go on.
So what we really need is a way to easily listen out to storage events and deal with it in one place. Yep, we could create our own Javascript framework to do this and handle getters and setters, but that sounds nasty to me.
Instead we can know use the onstorage attribute on the HTML body tag to hook into a function that will handle all of these call backs based on local stored data.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | function store() { if (window.localStorage) { var count=window.localStorage.getItem("count"); if (!count) { count=0; } count++ window.localStorage.setItem("count",count); } } function handleOnStorage() { myFunctionToSendDataToServer(event.key, event.newValue, event.oldValue); } window.onload = function() { document.body.setAttribute("onstorage", "handleOnStorage();"); store(); } |
Take a look at it in action here in the bemoko mobile test suite. It works on iPhone 3 and Safari 4. You can even see the complete code here.
So, “The market for mobile applications, or apps, will become ‘as big as the internet’, peaking at 10 million apps in 2020″ says GetJar – see BBC – Apps ‘to be as big as internet’ and GetJar forecasts 100,000 mobile apps by end of 2009. With Juniper Research predicting 20 billion app downloads by 2014 this a great outlook for mobile apps. But we shouldn’t be thinking of apps as an alternative to the internet. We really need to be thinking of them as one.
The buzz at the moment is clearly on app stores with the iPhone app store clearly leading the pack. See BBC’s click online summary from last week – Mobile phone applications grow up – for a great picture of the status quo.
We naturally turn to the ongoing debate of apps vs browser – Apps or browser? GetJar vs. Google on the future of mobile services. We needn’t think about either approach being right or wrong, or whether one approach will beat the other, especially when you consider that the user experience and commercials demands can vary wildly in different sectors or demographics. Let’s instead think about how the boundaries between the downloadable app and the web app can become blurred – creating a seemless experience for the end user.
Personally I’m getting pretty excited about the emergence of HTML5 web app stores as the HTML5 browser support arrives. We’re already seeing a taster of this HTML5 support, with the iPhone geolocation support in iPhone 3.0. Many apps currently in the app store realm lend themselves well to a personalised microsite with offline capabilities (such that HTML5 will enable) – take any of the information driven ones as examples, such as Amazon Mobile or Things. Developing in HTML5 brings with it the benefits of delivering to a wider set of devices and reusing existing web dev skills to create the apps. With these benefits in mind, the Open Gardens blog covers brilliantly the challenges that have to be tackled to create an HTML5 viable ecosystem – most importantly, what is the incentive for all the participating players.
We see the likes of (1) Nokia with their WRT widgets having foundations in HTML, CSS and Javascript and (2) Palm using HTML5 for native application – both providing potential alignment with the HTML5 web app store approach.
Now it’s really Google who is going all out for this HTML5 web app approach. With a slew of hot Android devices coming onto the market we can see Google slowly taking a slice of the smartphone. With the Android, Palm WebOs and Safari (iPhone) browsers all based on Webkit and with Webkit promising great HTML5 support things do look bright for HTML web apps.
BTW – to make my bias known – I co-founded bemoko which specialising in the delivery of the web to mobile. We have created a platform that allows existing (normal) web developers to deliver excellent mobile web UX – along with this wave of HTML5 (and widget) dev that is coming.