PC、スマートフォン、タブレット、振り分け

==================================================
iPhone3G　　480×320px
iPhone4　　960×640px
iPhone5　　1,136×640px

iPad（Retinaディスプレイ） 2048×1536ピクセル
iPad・iPad2　　1024×768ピクセル

iPad miniはRetinaディスプレイではない。
解像度はiPad2と同じ768×1024ピクセル。
iPad2は9.7インチ、iPad miniは7.9インチです。
=====================================================

iPhoneもipadも解像度が上がってしまったため、メディアクエリ（Media Queries）での識別が困難になってきた。
「userAgent」で振り分けることが増えそうだ。
ユーザーエージェント「userAgent」で振り分けるにはJavaScript、php、.htaccessを使う方法がある。
php、.htaccessはサーバが対応している必要がある。

1.JavaScriptで振り分ける

※document.writeでCSSのリンクをデバイスごとに振り分ける。
以下はiPhone,iPad,Androiには「style_ip.css」を読み込ませ、PCには「style_pc.css」を読み込ませている。

<script type="text/javascript"> 
var ua = navigator.userAgent;
if(ua.indexOf('iPhone') != -1 || ua.indexOf('iPad') != -1 || ua.indexOf('Android') != -1){
//iPhone & iPad 
document.write('<link rel="stylesheet" href="style_ip.css">');
}else{
//PC
document.write('<link rel="stylesheet" href="style_pc.css">');
}
</script>

※navigator.userAgentとindexOf(”)を使う。以下はiPhone、ipod、Androidは”test”ディレクトリへ異動させている。

<script type="text/javascript">
if ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0) {
location.href = '/test/';
}
</script>

その他

2.PHPで振り分ける

3.htaccessで振り分ける

htaccessを使ったページ移動はブラウザにストレスを与えず、リダイレクトでPCページに戻ってしまうようなエラーも防げるそうだ。

〜参考にさせていただきました。〜
http://wakana.me/?p=43
http://html5-css3.jp/smartphone/pc-iphone-android-php-javascript-htaccess.html