特定のページだけスマホに分岐する方法を教えてください。
例えば、メールフォームのみ、スマホだと見にくいので、
http://hoge.com/mail.html のところ スマホから来たユーザーのみ
http://hoge.com/smail.html を読ます方法はないでしょうか?
No.2ベストアンサー
- 回答日時:
そういう場合には、ユーザーエージェントを判別して振り分けを行います。
利用者の環境によって、別ページ(別ディレクトリ)へ遷移するという事です。
やり方としては主にphpで行う方法、.htaccessで行う方法があります。
phpでやる場合は当然ファイル拡張子を.phpにする必要があります。
javascriptでも出来ます。
ユーザーがjavascriptを切っていると使えませんが、スマホやタブレットでjavascriptを切る事はほぼないと思うので、これも有効です。
やり方は下記を参考に。
http://html5-css3.jp/smartphone/pc-iphone-androi …
1の方が言うような同一ファイルで横幅によってレイアウトを変更するようなやり方はレスポンシブデザインと言って流行のやり方ではありますが、デメリットも多く全てのサイトに向いているわけではありません。
レスポンシブのメリットとしては、同一htmlなので更新が1か所で済むのが一番で、あとはよく設計された場合に作業量が少なくて済む所です。
SEOに強いという噂はありますが、Googleの方が「そんなふうにはサイトを差別化しない」と否定しています。
デメリットとしては、スマホサイトを作った場合よりも読み込みが遅い(PC用の画像等を全部読み込むため)、
開発にコストがかかる、などです。
またレスポンシブに対応するにはある程度スキルが必要で、慣れていない方には敷居が高いです。
今からサイト自体を設計するのなら、考慮に入れてもいいですが、
今すでにサイトがあり、1ページだけ振り分けたいという事でしたら
レスポンシブ対応は全くお勧めできません。
その場合は普通に別ファイルを作成して振り分けたほうが、レスポンシブ20分の1くらいの作業量で出来ると思います。
No.1
- 回答日時:
本来は、
『HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )』
であり、
『文書の構造をプレゼンテーションと切り離すことで広汎なプラットフォームや多様なメディアでの文書提供コストを低下でき、文書の改訂も容易になる( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )』
ですから、
ひとつのページで、スマホとパソコンのブラウザに対応させるのが筋です。二種類ページを作らなくてすみますし、SEO的にも良いです。
・二種類ページを作成した場合は
.htaccessやCGIでブラウザを判別して異なるページを表示させたり、HTMLを書き直して出力
(欠点)日々刻々新機種が登場するのについていけない。判別できなかったときの処理は?
(1案)
リキッドでデザインして、ウィンドウ幅が狭いときは、余計な物は下に回す。
さらに、必要なら mediaqueryでスタイルシートを切り替える。
(2案)
所詮CGIを使うので、フォーム自体をCGIから出力させね。while(<DATA>){print;}
ただし判別には上記の問題がある。
(1案)が本来の方法です。とても楽です。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- WordPress(ワードプレス) ワードプレスのパーマリンク設定について 1 2023/02/11 19:08
- HTML・CSS 全部のアクセスを指定したページに転送させたい 2 2022/06/28 16:33
- JavaScript JavaScriptで「〇以上▲まで」の書き方 1 2022/07/20 14:44
- au(KDDI) 特定の画面を見るとスマホが固まります ご覧頂き有難うございます。 特定のページを見るとスマホが固まり 1 2023/08/21 19:29
- ホームページ作成・プログラミング ログインしないとみることができないWebページの作成方法 3 2023/07/29 13:33
- 大学受験 資格試験などの勉強で過去問題集の解説を理解する時、分からない用語を調べてどうするのが良いですか? 問 3 2023/06/18 17:18
- JavaScript スマホ上で、左右スワイプで次のページに移動させたいです 2 2022/11/11 17:04
- Android(アンドロイド) 相手のスマホから、相手の居場所を特定する方法。 6 2022/09/09 07:38
- Windows 10 バッチファイルの記述法とルールについてアドバイスをお願いいたします。 1 2022/04/13 10:50
- HTML・CSS スマホでHTMLファイルを開いてリンク先へ移動させたいです 2 2023/03/04 18:06
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ホームページを作っているので...
-
レスポンシブデザインとは? ...
-
HPビルダーのフレームページ...
-
スマホ横幅が720px だけ 横が...
-
Excelで、社外秘(閲覧のみ)と...
-
HTMLからフォルダを開きたい
-
HTMLページが勝手にダウンロー...
-
ホームページでファイルをダウ...
-
VBA URLDownloadToFileについて
-
iPadの標準ブラウザでローカルH...
-
Webサイトから、txtファイルを...
-
どのページもすべて同じURLなの...
-
form action="#"
-
HTMLで別PCのフォルダを開く
-
ページの途中にリンクするとそ...
-
URLDownloadToFile でダウンロ...
-
リンク先に日本語フォルダがあ...
-
htmlの謎
-
htmlファイルの表示が真っ白
-
XREA使用で作成したHTMLファイ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ホームページを作っているので...
-
ホームページ、iPadやiPhoneで...
-
スマホでPCサイト見たらスマホ...
-
ブラウザ切り替え
-
スマホだけメニューが開く設定...
-
ガラケーサイトの一般的な画面...
-
ホームページ制作、SPサイトの...
-
Safariで、ボタンが丸くなるの...
-
リンクの下線は消すのが普通?
-
趣味でhtmlを勉強するのに適し...
-
平均的なウィンドウサイズとは?
-
画面は固定と可変のどちらがい...
-
スマートフォン制作の画像サイ...
-
HPビルダーのフレームページ...
-
レスポンシブ 横1080px高解像度...
-
PC・ガラケー・スマホの振り分け
-
厳しいご意見を下さい!
-
(Webデザイン)ボタンのレイアウ...
-
PCとスマホで列の数を使い分け...
-
WEB閲覧中のPCの解像度を...
おすすめ情報