.htaccess(Apacheのモジュールmod_rewrite)を利用して、スマートフォンでWebサイトにアクセスされた時に、自動でスマートフォン向けページにリダイレクトする方法を検討してみたので、記録しておくことにします。
前提条件
- 同一ドメイン内にスマートフォン向けページのディレクトリを用意する
- スマートフォン向けページのディレクトリを「/spn」とする
- ユーザーの希望に応じてPC向けサイト・スマートフォン向けサイトを選択して閲覧できるようにする
.htaccessの設定例
RewriteEngine On
RewriteCond % !^/spn/.*$
RewriteCond % (iPhone|iPod|Android.*Mobile|BlackBerry|Windows.Phone) [NC]
RewriteCond % !iPad [NC]
RewriteCond % !viewmode=pc
RewriteRule ^(.*)$ /spn/$1 [R=302,L]/spnディレクトリ以外のURIにiPhone・Android（スマートフォンの場合。タブレットは除く。）でアクセスした場合で、Cookieのキー「viewmode」に値「pc」がセットされていない時、/spn以下にリダイレクトを実施するという設定です（Cookieに関しては後述）。
なお、User-Agent文字列に「iPad」が含まれない場合という条件も含めています。これに関しては、ASCII.jpの「実践！iPhone＆Androidサイト制作ガイド ― 第8回 JavaScriptで振り分けてスマホサイト完成！」（もしくは、書籍「iPhone+Android スマートフォンサイト制作入門 (WEB PROFESSIONAL)」）を参照してください。
（2015年1月27日追記）Googleのウェブマスター向けモバイルガイドには、HTTP ステータス コード 301 または 302 のどちらを用いても問題ありませんが、可能な限り 302 を使用することをおすすめします。
と記述があります。
PC向けサイト・スマートフォン向けサイトの切り替え方法
Yahoo!などで採用されているように、画面表示をPC向け・スマートフォン向け相互に切り替えてそれを維持する方法として、Cookieの利用を採用しました。具体的には、下記のようなJavaScript（jQuery、及びjQuery Cookieを利用）・HTMLで実現しています。
JavaScript
Cookieの設定を行う「changeView」関数を定義します。PC向けサイトの閲覧を希望したユーザーには、キー「viewmode」に値「pc」をセットします。再度スマートフォン向けサイトの閲覧を希望した場合は、値を空にすることとします。
<script>
function changeView() {
$.cookie("viewmode", "pc", { path: "/" });
}
</script>HTML
リンクをクリックした際、Cookieの設定を行う関数を呼び出しています。スマートフォンサイトの場合は下記のような記述になります。
<ul>
<li><a href="/index.html" onclick="changeView()">PC用ページ</a></li>
<li>スマートフォン用ページ</li>
</ul>検討課題
- 単純にUser-Agentの文字列にiPhone・Androidが含まれる場合のみリダイレクトでよいのか？ iPhone・Android以外のデバイス、Androidを採用したタブレット端末の場合はどうするのか？
→（2011年5月10日追記）Android端末に関して、新たに記事「User-Agent文字列を利用したAndroid搭載携帯端末（スマートフォン）とタブレットの区別について」を投稿しました。 - mod_rewriteのRフラグの利用について。301・302どちらに設定するのがベターなのか。→（2015年1月27日追記）前述の通り、302が推奨されています。
- 振り分けの是非。
参考サイト
追記
2012年1月11日
Windows Phoneに対応させました（実機は所有していないため検証はできておりません）。
2012年2月18日
"Windows Phone"に含まれるスペースが原因で500エラーが出るとの報告を頂きましたので、コードを修正させて頂きました。ご迷惑をおかけいたしましたことお詫びいたします。
2015年1月27日
Apache（.htaccess）・nginx・JavaScriptをはじめ、各種言語でデバイス判定を行うコードを配布する「Detect Mobile Browsers - Open source mobile phone detection」があります。様々な機種に対応するコードがダウンロードできます。