Need a Mobile Web App Template? Mobile Boilerplate 1.0 is Here

Mobile Boilerplate 1.0 has just launched, providing developers with a trusted template for building mobile Web applications. The site provides templates and documentation that can help developers create cross-platform mobile Web applications which work on modern-day smartphones, but also offer fall-back support for older BlackBerry, Symbian and Windows Mobile devices. The project itself is not a standalone framework, but works with jQuery Mobile, Sencha Touch, Phonegap and Appcelerator.

The homepage for the project showcases two hilariously, but accurately, titled lists: “Why It is Awesome” and “Why It is Aweome-er.” Both detail the many features provided by this new toolkit, such as:

  • Cross-platform compatible (Android, iOS, Blackberry, Symbian)
  • CSS class to target IE Mobile 7
  • Home screen icon (Android, iOS, Symbian)
  • Cross browser viewport optimization for Android,iOS,IE,Nokia,Blackberry, Opera
  • Optimized viewport scaling (Android, iOS, Mobile IE, Blackberry, Opera)
  • Option to enable iOS start-screen in full screen mode
  • Better font rendering on IE Mobile
  • Adaptable markup and CSS skeleton
  • CSS stylesheet for low-end devices
  • Mobile sitemap
  • Mobile MIME type support
  • Build tool for mobile
  • Integrates well with PhoneGap and Appcelerator

And then, the “awesome-er” features like:

  • HTML5 offline caching for smartphones
  • Hide URL bar to maximize screen area
  • Button clicks that don’t wait for the default 300ms delayed click event
  • Textarea autogrow
  • Hide Safari browser chrome
  • Mobile bookmark bubble
  • Browser Database Wrapper API
  • Robust optional User Agent Detection in .htaccess
  • Mobile optimized default CSS
  • Media queries polyfill for Windows Mobile
  • Google Analytics for low end mobile devices

Version 1.0 of the toolkit offers two different downloads – the documented version with hints and links and the comment-free version. The project is also available on github here.

Not a Framework & Not a “Build Once, Deploy to 1000+ Devices” Solution

To be clear, the Mobile Boilerplate is not meant to be a “build once, deploy everywhere” solution, but instead offers a set of best front-end (markup, CSS) practices for mobile Web developers to utilize in order to leverage the features of high-end smartphones like those running Android or the iPhone, for example, while still providing some basic support for older Web browsers.

Interested developers can learn more by visiting

And for more inspiration, there’s a thread on Quora listing several good examples of HTML5 mobile websites here.

Facebook Comments