Nowadays people want to offer mobile versions of their websites or web applications to their mobile users. Even though some mobile vendors explicitly state it is not necessary to develop a trimmed down version because they want their users “to experience the real internet”. But in most cases you don’t want your mobile visitors to stop from returning because they went through their data plan to quickly because of all the extra “bulk” on your site. They just want your content.
There have been several scripts floating around for detecting specific mobile devices through javascript but none have succesfully detected them all. Until now, that is. WURFL ( The Wireless Universal Resource File ) is an open source project which collects information about all of the different mobile devices in use. It is constantly being updated, so as long as you keep your WURFL definitions up-to-date you don’t have to worry about your detection scripts not recognising new devices. By querying a WURFL database with your visitor’s User Agent string, you can not only determine whether the device they are using is a mobile device, but whether it has a touch screen, can make phone calls, is a tablet and more.
Installation
It’s pretty easy to install the Tera-WURFL service. You just copy the files to your PHP-enabled webserver, call the installation file ( admin/install.php ) in your browser and start solving the errors. This seems and indeed is pretty messy but you’ll only have to go through the process once.
Usage
After the installation using this service can be as easy as the code below.
<?php
require_once('TeraWurfl.php');
$wurflObj = new TeraWurfl();
$matched = $wurflObj->getDeviceCapabilitiesFromAgent();
if($wurflObj->getDeviceCapability("is_wireless_device")){
// Load or redirect to the mobile version of your website or app
} else {
// Load or redirect to the regular version of your website or app
}
?>
The service offers a lot more functionality but this is the easiest and most straight-forward example for detecting mobile devices.
Please always remember to place an option for users to switch to the full version of your website or web application because even Tera-WURFL can make mistakes and some people ( like me ) just like to view full websites on their mobile devices.
Addendum
I know User Agent sniffing is generally a bad practice. I’m just offering a small insight and some code on how you can target your mobile audience. Please don’t go overboard and make 500 versions of your website for 500 different devices and browsers. If you want to offer mobile visitor’s a slightly different version of your website please take a look at the CSS3 media queries.
Please don’t do this, instead provide a normal link or different sub domain- it’s infuriating especially when visiting a link that then redirects to a mobile homepage thus loosing where you were going. Good mobile browsers cope with normal web pages fine, and sure, offer an optimized version, but don’t redirect people
I’m just offering a solution here. I’m not saying ( although I use it in my example ) you should redirect people. You could serve them other functionality though, like geo-tagging etc. for mobile users.
Dank Luc voor de tip van TeraWurfl, wij maken er inmiddels gebruik van. @Tim, zolang de url niet wisselt en de content van de webpagina maar thematisch gelijk blijft en de lezer kan kiezen voor desktop of mobiel zie ik geen bezwaar.