[ACCEPTED]-Redirect mobile devices to alternate version of my site-mobile-website

Accepted answer
Score: 26

You could use a device description database 11 (such as WURFL) which will recognise the client 10 device from the request headers. You can 9 then query that database to decide if the 8 device can handle your site (e.g. support 7 javascript, or is the screen big enough) before 6 deciding whether to redirect them to a different 5 site.

You don't mention your environment, but 4 WURFL supplies APIs for Java and PHP, and 3 maybe others as well. If there's no supplied 2 API, you can still use WURFL, but you'll 1 have to parse and process the XML data yourself.

Score: 8

media="handheld" doesn't work 5 with modern smartphones like the iphone 4 which pretend to be a desktop browser (uses 3 the screen media type).

http://detectmobilebrowser.com/ Free & open 2 source, has a comprehensive mobile user-agent 1 checker available in many languages - javascript, php, asp.net, ruby, etc.

Score: 7

If you are looking to redirect to a mobile 5 site using JavaScript, I noticed that WURFL 4 also has a solution for that will allow 3 you to do server side detection with JavaScript.

<script type='text/javascript' src="//wurfl.io/wurfl.js"></script>

you 2 will be left with a JSON object that looks 1 like:

{
     "complete_device_name":"Apple iPhone 6",
     "is_mobile":true,
     "form_factor":"Smartphone"
}

You can then use this:

if (WURFL.is_mobile === true) {
    window.location.replace("http://stackoverflow.com");
}
Score: 2

I don't think there is a good/elegant way 3 to detect if user has his javascript activated.

IMO, the 2 best is to list the user agent : here is a User-Agent 1 list, which seems quite complete (in French, sadly).

Score: 2

Just put this in your header:

<script type="text/javascript">
 <!--
  if (screen.width <= 700) {
  window.location = "http://www.mobile-site.com";
  }
 //-->
</script>

Just about 6 everyone's computer screens are above the 5 threshhold of 700px but this vaule can be 4 changed. There isnt a phone or tablet out 3 there that is above 700px (at least I dont 2 know of any) so all mobile divices will 1 redirect to your mobile site.

Score: 2

An alternative to WURFL is Mobile Detect, a PHP class for 2 detecting:

  • Tablet
  • Mobile
  • iOs
  • Android
  • Browsers
  • And much more

So in case WURFL doesn't do what you 1 need, you can always check this out.

Score: 0

Agreeing with Skaffman, another device database 1 is DeviceAtlas. You have to pay for this one though.

Score: 0

Simple:

<link rel="alternate" media="handheld" href="WEBSITE HERE">

put that in the head section.

0

Score: 0

If the device doesn't support JS, it's better 20 to consider a Server-side solution, and 19 WURFL API can help towards that direction.

Sometimes 18 we want to avoid issue with this kind of 17 approach (such as a reverse proxy caches 16 pages and don't let redirect to the mobile 15 version) or we need a quick solution knowing 14 that nowadays almost all recent devices 13 support JS.

For this reason, I wrote a JS 12 script called "redirection_mobile.js" that 11 detects the User Agent of the browser and 10 redirects to the mobile version of your 9 site if you're accessing it from a mobile 8 device.

In some case you want to redirect 7 from a mobile device to a desktop version 6 (like with a link "Go to the main site"), the 5 script will handle that and once you finish 4 your session, you'll access to the mobile 3 version again.

You can find the source code 2 on github here http://github.com/sebarmeli/JS-Redirection-Mobile-Site and you can read more details 1 in one of my article here:

http://blog.sebarmeli.com/2010/11/02/how-to-redirect-your-site-to-a-mobile-version-through-javascript/

Score: 0

here is the working solution

RewriteEngine On
RewriteBase /

#http://stackoverflow.com/questions/3680463/mobile-redirect-using-htaccess
# Check if mobile=1 is set and set cookie 'mobile' equal to 1
RewriteCond %{QUERY_STRING} (^|&)mobile=1(&|$)
RewriteRule ^ - [CO=mobile:1:%{HTTP_HOST}]

# Check if mobile=0 is set and set cookie 'mobile' equal to 0
RewriteCond %{QUERY_STRING} (^|&)mobile=0(&|$)
RewriteRule ^ - [CO=mobile:0:%{HTTP_HOST}]

# cookie can't be set and read in the same request so check
RewriteCond %{QUERY_STRING} (^|&)mobile=0(&|$)
RewriteRule ^ - [S=1]

# Check if this looks like a mobile device
RewriteCond %{HTTP:x-wap-profile} !^$ [OR]
RewriteCond %{HTTP_USER_AGENT} "android|blackberry|ipad|iphone|ipod|iemobile|opera mobile|palmos|webos|googlebot-mobile" [NC,OR]
RewriteCond %{HTTP:Profile}       !^$
RewriteCond %{QUERY_STRING} !^mobile=0(?:&|$)
# Check if we're not already on the mobile site
RewriteCond %{HTTP_HOST}          !^m\.
# Check to make sure we haven't set the cookie before
RewriteCond %{HTTP:Cookie}        !\mobile=0(;|$)
# Now redirect to the mobile site
RewriteRule ^ http://m.yourdomain.com%{REQUEST_URI} [R,L]

# Go back to full site
RewriteCond %{HTTP_HOST} ^m\.
RewriteCond %{QUERY_STRING} (?:^|&)mobile=0(?:&|$)
RewriteRule ^ http://yourdomain.com%{REQUEST_URI} [R,L]

RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [NC,L]

RewriteRule ^.*$ index.php [NC,L]

0

More Related questions