Mobile detection - Meta tag and max-device-width vs. php user agent?
- by nimmbl
Which form of mobile detection should I use and why?
<meta name="viewport" content="width=320,initial-scale=1,maximum-scale=1.0,user-scalable=no" />
<link media="only screen and (max-device-width: 480px) and (min-device-width: 320px)" href="css/mobile.css" type= "text/css" rel="stylesheet">
<link media="handheld, only screen and (max-device-width: 319px)" href="css/mobile_simple.css" type="text/css" rel="stylesheet" />
Or
include('mobile_device_detect.php');
$mobile = mobile_device_detect();
And why on earth would this:
<?php if(strpos($_SERVER['HTTP_USER_AGENT'], 'iPhone') !== false) { ?>
<meta name="viewport" content="width=320,initial-scale=1,maximum-scale=1.0,user-scalable=no" />
<link media="screen" href="css/mobile.css" type= "text/css" rel="stylesheet">
<?php } else { ?>
<link media="screen" href="css/mobile_simple.css" type= "text/css" rel="stylesheet">
<?php } ?>
ignore this css?
body {
background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#000));
}