特定のページだけスマホに分岐する方法

質問

特定のページだけスマホに分岐する方法を教えてください。
例えば、メールフォームのみ、スマホだと見にくいので、
http://hoge.com/mail.html のところ スマホから来たユーザーのみ
http://hoge.com/smail.html を読ます方法はないでしょうか？

回答No.2

tkmojo · ベストアンサー

そういう場合には、ユーザーエージェントを判別して振り分けを行います。
利用者の環境によって、別ページ（別ディレクトリ）へ遷移するという事です。

やり方としては主にphpで行う方法、.htaccessで行う方法があります。
phpでやる場合は当然ファイル拡張子を.phpにする必要があります。
javascriptでも出来ます。
ユーザーがjavascriptを切っていると使えませんが、スマホやタブレットでjavascriptを切る事はほぼないと思うので、これも有効です。
やり方は下記を参考に。
http://html5-css3.jp/smartphone/pc-iphone-android-php-javascript-htaccess.html

1の方が言うような同一ファイルで横幅によってレイアウトを変更するようなやり方はレスポンシブデザインと言って流行のやり方ではありますが、デメリットも多く全てのサイトに向いているわけではありません。

レスポンシブのメリットとしては、同一htmlなので更新が1か所で済むのが一番で、あとはよく設計された場合に作業量が少なくて済む所です。
SEOに強いという噂はありますが、Googleの方が「そんなふうにはサイトを差別化しない」と否定しています。

デメリットとしては、スマホサイトを作った場合よりも読み込みが遅い（PC用の画像等を全部読み込むため）、
開発にコストがかかる、などです。
またレスポンシブに対応するにはある程度スキルが必要で、慣れていない方には敷居が高いです。

今からサイト自体を設計するのなら、考慮に入れてもいいですが、
今すでにサイトがあり、1ページだけ振り分けたいという事でしたら
レスポンシブ対応は全くお勧めできません。
その場合は普通に別ファイルを作成して振り分けたほうが、レスポンシブ20分の1くらいの作業量で出来ると思います。

お礼

tkmojoさんありがとうございます。
参考にさせていただきます。

回答No.1

ORUKA1951

本来は、
『HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )』
であり、
『文書の構造をプレゼンテーションと切り離すことで広汎なプラットフォームや多様なメディアでの文書提供コストを低下でき、文書の改訂も容易になる( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4.1 )』
　ですから、
　ひとつのページで、スマホとパソコンのブラウザに対応させるのが筋です。二種類ページを作らなくてすみますし、SEO的にも良いです。
・二種類ページを作成した場合は
　.htaccessやCGIでブラウザを判別して異なるページを表示させたり、HTMLを書き直して出力
　(欠点)日々刻々新機種が登場するのについていけない。判別できなかったときの処理は？

(1案)
　リキッドでデザインして、ウィンドウ幅が狭いときは、余計な物は下に回す。
　さらに、必要なら mediaqueryでスタイルシートを切り替える。
(2案)
　所詮CGIを使うので、フォーム自体をCGIから出力させね。while(<DATA>){print;}
　　ただし判別には上記の問題がある。

(1案)が本来の方法です。とても楽です。

お礼

ORUKA1951さん
ありがとうございます。