Thursday, August 04, 2011

More on HTML5 for Mobile Application Developers

We’ve already explored some HTML5 features such as media playback, offline mobile data support, and 2D graphics capabilities.  Let’s now explore two additional advantages.


HTML5’s geo-location application programming interface (API), is to me one of the most interesting features.  It enables mobile web sites to access a mobile device’s GPS technology.  The W3C geolocation API specification was published in September, 2010.  (

Google Latitude for the iPhone is one example of a pure HTML5 web application using these features (It’s also available on iPad and Android-powered devices).  Latitude lets users share where they are and see where their friends are on a map.  Read more at and

Some other application scenarios for using HTML5 geolocation are:
  1. Finding points of interest in the user’s area
  2. Showing the user’s location on a map
  3. Alerts when points of interest are in the user’s vicinity
  4. Turn-by-turn route navigation

There are more than a dozen new input types and new features that can be used in HTML5 web forms. One of the features enables developers to create and display a placeholder in an input field. What is a placeholder?  It is a hint as to what input is expected and what the format should be.  When you highlight the field, the placeholder disappears and allows the input. 

Another feature is the addition of form validation.

There are many new data inputs supported in HTML5:
  1. Search – To prompt users to enter text they want to search for.
  2. Email – For entering a single email address or a list of email addresses.
  3. Color – For choosing color through a color well control.
  4. Number Slider – Turns the input field into a numeric slider.
  5. Web Addresses - Now fields requiring a web address can provide a custom keyboard on iPhones made for entering URLs.
  6. Numbers - You can now specify minimum and maximun numbers allowed in a particular field, plus what "steps" or increments you allow (i.e. 0, 2, 4, 6 or 0, 5, 10, 15).
  7. Native Date Picker Control - This eliminates the need to use javascript libraries to pick dates and times.
  8. HTML5 Form Validator - Now you can validate data in a field from within HTML5.  Invalid data will launch an error message from within HTML5, not an external javascript.
  9. HTML5 Required Fields - Now HTML5 can be configured to produce an error message if a required field is not completed.  No longer is it necessary to use an external javascript.
I have worked on many, many custom mobile applications that are used for inspections, assessments, surveys and field data collection.  Ensuring accurate and valid data input is critical.  We developed a lot of custom code to ensure accurate and valid data in the past.  These advances in HTML5 will make developing these kinds of applications faster and easier.

Previously published articles on HTML5

What Can HTML5 Offer Mobile Developers?
HTML5 - What I am Learning
Projections for and Demonstrations of HTML5

Upcoming Events

Field Mobility 2011 - October 25 - 27, 2011
Enterprise Mobility Exchange - November 2 - 3, 2011

Whitepapers of Note

The Business Benefits of Mobile Adoption with SAP Systems
ClickSoftware Mobility Suite and Sybase Mobility Solution
Mobile Adoption Among Gas and Electric Utilities
Mobile Adoption in Life Sciences
Mobile Adoption in Oil and Gas
Networked Field Services

Recorded Webinars of Note

3 Critical Considerations for Embracing Mobile CRM
The Future of Enterprise Mobility
Healthrageous Mobility Case Study
The Latest m-Business Trends and How the Onslaught of Mobile Devices Affects Development Strategies
The Real-Time Mobile Enterprise:  The Benefits of Rapid, Easy Access
Syclo and SAP Deliver Mobile Apps on Sybase Unwired Platform

Kevin Benedict, Independent Mobile and M2M Industry Analyst, SAP Mentor Volunteer
Follow me on Twitter @krbenedict
Full Disclosure: I am an independent mobility analyst, consultant and blogger. I work with and have worked with many of the companies mentioned in my articles.