Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I have some special coding that only works for HTML5 browsers (simple geolocation stuff). I want to redirect iPhone and Android users to the m.example.com version of my website. How is the best way to do this?

share|improve this question
add comment

2 Answers

you can use UserAgent detection, or you can use the jQuery.support(). Since you are looking for specific functionality, you can combine the two to get what you want.

UserAgent might actually be your best bet. Do this with a .htaccess file to cut down on your http requests, and possibly flashing your main site before redirection in the case of slow connection or slow javascript performance.

You can see the (mostly) exhaustive list of mobile user agents on the wikipedia page. As you can see there are similarities between manufacturers and versions that you could look for in a regular expression.

share|improve this answer
3  
Doing this is the back-end is highly preferable over doing it with JS, especially as bandwidth on mobile devices is very narrow. the .htaccess method is the best bet, followed by a PHP/ASP/whatever backend method –  Mark Henderson Jul 8 '10 at 23:02
add comment

Your question touch two parts .. redirection and html5 compatibility.

Redirection

I'm using the following .htaccess :

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 ^(.*)$ http://m.example.com/ [L,R=302]

For php you can use this library: http://detectmobilebrowsers.mobi/ ... but i strongly suggest using htaccess for processing time and security.

You can find some additional examples here

http://ohryan.ca/blog/2009/02/18/revisiting-mobile-redirection-using-htaccess-rewrite-rules/

Browser capabilities

As my Android phone have no problem with html5 with geolocation code. You may consider using the Modernizr Javascript Library to detect the capabilities of the client browser visiting your page.

The excellent HTML5 boilerplate template is using modernizr out of the box to support this kind of needs.

My opinion is : I suggest to use the htaccess method for everything except recent phones and browsers supported by modernizr and let Android and iPhone users be checked by Modernizr for html5 feature support and redirect the "rest" on your "without geolocation" version.

Modernizr example :

 if (Modernizr.geolocation) {
    // do stuff
 }else{
    // propose mobile version 
 }

Hope this helps

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.