ブラウザサイズとモバイル化について教えて下さい。

質問

スマホでアクセスすると、スマホに適した状態で表示されるサイトがあります。
（私のサイトではありません。スマホ化する際に参考にしたいサイトです。）
このサイトにPCからChromeを使ってアクセスして、ブラウザサイズを小さくしてもスマホ表示になりません。
PC用とスマホ用、２つの異なるサイトを用意していることが要因かと思うのですが、URLは同一です。
このサイトにPCからアクセスした場合、どのような方法でスマホ用の表示で閲覧することができますでしょうか？
ブラウザの種類や設定によっては、PCでアクセスしても、ブラウザサイズを小さくすればスマホ用表示のデータを表示させることができるのでしょうか？

回答No.3

asciiz · ベストアンサー

Chromeをお使いなら、スマホのエミュレートができます。

PC版サイトが表示されてる状態から、右上三線メニューボタン→その他のツール(L)→デベロッパーツール(D) を選択。

出てきたDeveloper Tool ウインドウツールバーの虫眼鏡の隣、鏡みたいなアイコンをクリックすると、スマホモードになります。(はい、実はこれがスマホアイコンでした)

「Device」のドロップダウンリストから、たとえば「Apple iPhone6」などを選択すると、User Agent 文字列を変更し、iPhone6の画面サイズになります。
ただ、この時点ではサイズに合わせて縮小されるだけかもしれません、Reloadボタン(またはF5キー)を押すと、改めてスマホUserAgentでのアクセスをするので、スマホ版が表示されると思います。
(PC版/スマホ版切り替えに User Agent 判定をしているならば、ですが。)

画面の縦横サイズを具体的に入力することも可能です。
その数字枠の右に回転矢印ボタンがありますが、それが縦横入れ替えボタンです。
これでスマホ横向き状態で見るときのエミュレートも可能です。

--

元に戻すときは、先ほどのスマホアイコンをクリックしてスマホモードを終了するか、Developer Tool ウインドウを消すことでも、スマホモード解除になります。

お礼

回答ありがとうございます。早速試してみます。

回答No.2

t_ohta

たぶんUserAgentを見て出し分けを行っているのではないかと思われます。
ブラウザの拡張機能等でUserAgentを変える事が出来るものがありますので、そういったものを試されてはどうでしょうか。

回答No.1

AsarKingChang

画面のサイズではなく、
機種を判別してサイトを構成しているサイトなので、
サイズがどうの？は無関係です。

モバイルならモバイル用サイトをCGIなどで送り出しているか、
HTML内で、モバイル用の表示にCSSなどを使って構成しているか？です。

ただサイズをいじっても、モバイル用になるわけではありません。