After my trials with an adapted CSS for handheld devices, Beni started designing a special handheld-only theme for Flux CMS. As you still had to download approx. 50kb of data with the CSS-only approach, we decided to only show the title, date, a comment counter (if there are any) and some navigational items to the overview pages in mobile mode. This brought the initial size down to approx. 4kb. We also changed other XSLT stylesheets for a better experience on mobile devices. So, head over to http://blog.bitflux.ch/mo/ to see the full glory (If you want to leave the mobile mode, click on the link on the bottom called “Leave Mobile Mode”. The reason for this will be explained in the next paragraph). There are still some rough edges here and there and we could do some more CSS magic to make it look nicer, but it already fulfills its job perfectly as it is right now.
To make the mobile experience more enjoyable, we also added some “handy” features. If you go to a “normal” page of this blog with a mobile phone or a PDA (or opera in Small Screen Rendering Mode), you should see a link on top called “Mobile Mode”, which brings you to http://blog.bitflux.ch/mo/, meaning you don’t have to remember the mobile URL at all. The first hit still downloads the full page, but here comes the next feature into play, the remembering-that-you-are-a-handheld feature. Modern mobile browser do handle cookies correctly (at least, the K750i, the P800 and my Palm do, Silvan’s Nokia and Beni’s something-japanese phone didn’t) and therefore we set a cookie, if you go to the mobile mode. Next time you visit us with that device, we can deliver the correct page right away (and this is also the reason, why you explicitly have to click “Leave Mobile Mode”, if you want to see the “real” page again).
You may ask, why not just doing user agent sniffing or let people just bookmark the mobile URL.
User agent sniffing is way to expensive (and sometimes also unreliable) just for the little amount of mobile traffic we expect. There’s a great collection of handheld user agent strings and their capabilities called WURFL, but the XML file is already huge and you’d have to look for each and every request, if it’s a handheld browser and then show the correct page. WURFL is not useless nevertheless, as it also can tell you, what that model is able to render and what not. But we don’t use this right now and just deliver the same page to everyone. Furthermore there are PHP scripts available, which make accessing that large XML document quite easy and relatively fast .
The “why-not-just-bookmark” argument has its flaw, if you’re following a link from eg. a mobile feed reader or another webpage, which usually point to the “normal” version of the page. But if you already have the cookie set for that webpage, you’ll directly see the mobile version, without having to type in the “mobile” URL or accidentally downloading the full page.
Enjoy reading Bitflux Blog on the go. And of course, Freeflux accounts will get that feature during the next update as well.
Tags: mobile, k750