a Mobile Web Blog

Create your own device detection algorithm in Drupal using Wurfl and Mobile Tools

While going through the Mobile Tools issue queue today, I noticed some questions on the device detection mechanism in Mobile Tools and how some desktop browsers are wrongly detected as mobile devices.

To be honest I don't use the Mobile Tools built in device detection mechanism myself.... The simple reason is that Mobile Tools has a set of rules that try to discover the nature of the accessing device by looking at the user agent string. Have a quick look at the code (line 496: function _mobile_tools_is_mobile_device()) to see how the device detection works.

You will understand that the effort in keeping up with new devices and browsers is not an easy task, and these rules become inaccurate or outdated. It is sufficient and recommended for testing and quick prototyping during mobile development... But I would not recommend using it for production sites!

Sugestio: recommendations as a service for Drupal

Making your website more personal has long been a wish for many developers. If you can predict what your visitors will like, you could give this content a more prominent position and potentially increase participation (clicks, sales, uploads, comments, ...) on your website.

Powering mobile apps by Drupal

The interest in creating mobile apps or mobile websites with Drupal is increasing enormously. With the launch of the new Windows Phone today, the new Symbian^3 and the BlackBerry 6 family of devices, the already enormous popular Android and iPhone duo got some new brothers and sisters. It is clear that there will be an enormous need for mobile developers and platforms that can drive these developments.

To illustrate the interest of the Drupal community in Mobile, just have a ook at a recent blogpost by Dries where he polled the community about possible wishes and needs in order to make Drupal a better platform to drive mobile apps.

While a number of solutions are being created as we speak I just wanted to point to two specific efforts that, instead of creating Drupal code to better communicate with mobile apps, write libraries for mobile platforms to better communicate with Drupal:

  • Drupal iOS SDK is an iPhone library for Objective-C developers
  • Titanium API Group tries to collect snippets of code for the Titanium Framework that can power both Android and iPhone platforms. Hopefully some more formal Titanium libraries will emerge from this effort...

Styling form buttons on the iphone: -webkit-appearance

Techniques for styling "form buttons" are well known to themers, and certainly to themers who develop for smarthphones that understand some CSS3, things become very easy.

However, recently we ran into some issues with iPhones that show a glare if we theme our buttons...

<input type="submit" name="submit" value="submit" id="submit" />
 
<script type="text/css">
#submit {
  color: #fff;
  width: 135px;
  height: 30px;
  border: none;
  background: #E00 ;
  -webkit-border-radius: 5px;
}
</style>

Rethinking the mobile web

This presentation is a very well crafted set of slides explaining some basic concepts of creating mobile websites, and more specific to make your desktop site adaptable.

It discusses lot of techniques that I use to make mobile websites performant... However some design choices we get from clients not always allow the very lightweight approach ( => example slide shows on mobile devices).

Mobile Web testing... What's in my toolkit

When you are developing mobile websites, it is very important to have a rich Toolset that helps you in evaluating your mobile creations. This is not only for yourself, but also to reassure the client that you have the development under completely under control.

Screensizes and browser capabilities can change the look and feel of your site drastically... So better prepare!

Using Virtual Hosts on the Android Emulator

We know that it is a very good practice to use Virtual Hosts on your local machine to develop websites locally. Using paths like http://localhost/site1 are not only bad looking, it gives problems when you reference files, images, ... relative to your domain. It also helps you get better organised.

There are some steps to undertake in your systems hosts file and in your apache server in order to get these virtual hosts running. Just google or Bing for a tutorial.

Device detection in apache

As maintainter of the Drupal Mobile Tools module I often get the question how device detection works when caching is enabled (e.g. with Boost).

Several solutions are emerging. Two of them worth looking at:

- http://www.projectronin.com/blog/?p=10
- http://www.idelfuschini.it/en/apache-mobile-filter-v2x.html

Both are doing device detection in apache.

HOW TO: Optimize Your Mobile Site Across Multiple Platforms

Mashable has written a simple and short write up on creating a mobile website:

http://mashable.com/2010/07/13/mobile-web-optimization/

It is short, but contains some links to good resources on developing mobile website.

Life after OSMOBI. The future of Mobile Drupal

Drupal users who have followed my blog will probably already know about OSMOBI, the online service to make your Drupal, Joomla! and Wordpress site Mobile. OSMOBI has been the brainchild of Siruna, a Belgian startup focussing on creating solutions to make mobile websites. Examples of mobile websites that are still running on Siruna technology are http://m.stubru.be and http://m.uitinvlaanderen.be. Examples of OSMOBI sites are not existing anymore since the service stopped at the end of June.

The Siruna technology, including OSMOBI focussed on mobilizing your existing Drupal sites and by the end of april 2010 more then 1200 Joomla! and Drupal sites used the free OSMOBI service to create their mobile website.

To get a feel on how OSMOBI worked, have a look at the screencasts that are still online:
http://www.youtube.com/user/SirunaOsmobi

Although the huge adoption of OSMOBI and the increasing need for Mobile websites, the service did not survive due to insufficient funding... This left more then 1000 developers stranded without any mobile sollution. So the natural question I have got was "what's next?".