For the last couple of days I have been playing around with and getting to know jQuery Mobile. What an awesome tool for adding a mobile version of your website.
I built the mobile version of my company website as a completely separate version, so the data passed to the users could be tailored more for mobile devices. The mobile version now sits in the sub-domain m.interactive-info.co.uk.
Using jQuery Mobile is very simple using the documentation and demonstrations on their own website. In fact their documents are so good I am not going to go into how I built the mobile site.
The mobile detection was the main issue when setting up a mobile specific site. I needed to detect that the user is visiting the site with a smartphone and redirect them off to a nice small screen friendly version of our site. To do the detection I used the regular expression supplied here: detectmobilebrowser.com and put it into my Application.cfm file.
For all my tests, the mobile detection worked great and didn’t get any false positives when visited with a desktop browser.
The next job was to let mobile users specify that they would rather see the full site. To allow them to do this I pass the url variable ?version=full to the homepage. The Application file then writes a client variable to the database to remember their choice, so they can browse around the main website. We also supplied a “Mobile version” link on the main site, so mobile users could get back to the mobile website. It sets a client variable so that visitors that were not detected correctly can stay on their site of choice.
Smartphones are being used more and more these days and people are becoming more lazy when it comes to finding information, so if you don’t want to lose out on a massive market place then check out jQuery Mobile and get mobile version of your website.
