Redirecting the most common mobile browsers (and then some) can be done through a couple of simple Rewrite conditions in your .htaccess file. I think this is beneficial over the multitude of Javascript and CSS hacks out there for a number of reasons, the primary one (as an iPhone user) is speed; who wants to load the whole of a html page, all of its links and css before redirecting to a ‘mobile safe’ page (more load time… more redirects). Most of the how-to’s I found online were concerned with .js hacks… ugh, when you’ve got your own server there really is no excuse. Now:

I need to redirect visitors to my portfolio (which is heavy on images and js, there’s a flash ‘autoviewer’ in there too) to a mobile-safe version, this has lower dimension versions of the same photos in my flash gallery with little of the fuss (read: graphic design). I’m working on the design of that right now. But here’s the crux- the .htaccess required to redirect visitors to a certain folder to a subdomain within that location.

callumalden.com/photography/
magically directs to….
callumalden.com/photography/mobile/

Without loading the /photography/index.php and additional redirect code this is surely the best way to direct mobile users. This bit of code is useful because it also redirects all pages within the ‘photography’ folder to the ‘mobile’ pages. So an attempt at /photography/portraits.php will direct to /mobile/


rewriteengine on
rewritecond %{request_uri} !^/photography/mobile/.*$
RewriteCond %{HTTP_ACCEPT} "text\/vnd\.wap\.wml|application\/vnd\.wap\.xhtml\+xml" [nc,or]
rewritecond %{http_user_agent} "sony|symbian|nokia|samsung|mobile|windows ce|epoc|opera" [nc,or]
rewritecond %{http_user_agent} "mini|nitro|j2me|midp-|cldc-|netfront|mot|up.browser|up.link|audiovox"[nc,or]
rewritecond %{http_user_agent} "blackberry|ericsson,|panasonic|philips|sanyo|sharp|sie-"[nc,or]
rewritecond %{http_user_agent} "portalmmm|blazer|avantgo|danger|palm|series60|palmsource|pocketpc"[nc,or]
rewritecond %{http_user_agent} "smartphone|rover|ipaq|au-mic,|alcatel|ericy|vodafone/|wap1.|wap2.|iphone|android"[nc]
rewriterule photography/$ /photography/mobile/ [l,r=302]


It may just be my server setup, but I had to use the whole address on the bottom line to achieve the redirect, this is the same on all my .htaccess files. Odd, No? Anyway- pretty handy. If you want to test out the redirect, just change something up there like ’sony’ to ’safari’ or whatever your browser happens to be, save and refresh the browser and you can emulate the iPhone experience. Now, off to code some Blackberry/iPhone-savvy html!