端末の違いによってページを切り替える方法について

質問

端末の違いによってページを自動的に切り替えるには、htaccessファイルを使った方法があります。

例えば、スマホのiPhoneやAndroidでも沢山の機種が存在しますが、仮に合計50台あったとしたら、htaccessファイルには50行も記述しなければならないのでしょうか？

また、htaccessファイルに記述することの他に、HTMLファイルにはスマホ用とPC用の二つを作成する必要があると思いますが、その場合、スマホ用のHTMLファイルには何か特別なコードを記述する必要があるのでしょうか？

回答No.2

DrFell · ベストアンサー

「レスポンシブ」を検索すれば、幸せになれるかも？

スマホ用ＰＣ用で分けてもいいし、スマホ用を縦用横用とわけＰＣ用も低解像度、高解像度と分けるのもいいんじゃないですか？.htaccessには１行も書き足さずに分岐させる方法もあります。区別するなら、それようのコードは必要です。htmlファイルには１行追加するだけでも対応できる方法もあります。

先の用語に加えて、使用したいワードを加えて検索すれば、でてきますよ。「レスポンシブ　htaccess」とか「レスポンシブ　css」、「レスポンシブ　メディアクエリ」なんて感じです。

デザインに凝らなければ、単純なリキッドレイアウトで済ませることも可能です。fujino00 さんのしたいようにすればいいので、２つを用意するのも一つで済ませるのも有りですよ。

お礼

レスポンシブを検索して、幸せになってせます！！

回答No.1

ORUKA1951

基本的には、CSS2のメディアタイプ、CSS3のmedia Queryを使うべきです。
本来HTMLは、
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )］より
　ですし、そのためにHTMLを使ってページを作成するわけですから、ページをたくさん用意していたら本末転倒です。
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
こうしたテクニックによって、Webページはより複雑化し、限られた環境にしか適応しなくなり、相互運用性問題に悩まされることとなり、障害を持つ人々にアクセス障壁が設けられてしまう。
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［Style Sheets in HTML documents (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )］より

　たった一枚のHTMLを作成して、ユーザー端末側で必要なスタイルシートを利用して表示させることが基本中の基本です。（そのためには、きちんとウェブ標準でHTMLが作成できなければなりません。）

お礼

なぜかjQueryによるスライドショーを展開しているページだけスマホで見ると突然ブラウザが閉じられるので、そのページだけPCとスマホでページを切り替えようと思いました。

しかし、やはりjQueryによるスライドショーを辞めることにします。そうすれば、スマホで見てもブラウザが閉じられることがないので。

それとは別にスマホ用とPC用で見た目を変えることは、今後考えていかなければと思いますので、CSS2のメディアタイプ、CSS3のmedia Queryは勉強していきたいと思います！！

ありがとうございます！！