• ベストアンサー
  • 困ってます

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

  • 質問No.9007575
  • 閲覧数384
  • ありがとう数2
  • 気になる数0
  • 回答数3
  • コメント数0

お礼率 19% (26/133)

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

質問者が選んだベストアンサー

  • 回答No.3
  • ベストアンサー

ベストアンサー率 72% (4367/6047)

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

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

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

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

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

--

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

お礼率 19% (26/133)

回答ありがとうございます。早速試してみます。
投稿日時:2015/07/08 14:29

その他の回答 (全2件)

  • 回答No.2

ベストアンサー率 38% (3202/8333)

他カテゴリのカテゴリマスター
たぶんUserAgentを見て出し分けを行っているのではないかと思われます。
ブラウザの拡張機能等でUserAgentを変える事が出来るものがありますので、そういったものを試されてはどうでしょうか。
  • 回答No.1

ベストアンサー率 50% (1337/2643)

他カテゴリのカテゴリマスター
画面のサイズではなく、
機種を判別してサイトを構成しているサイトなので、
サイズがどうの?は無関係です。

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

ただサイズをいじっても、モバイル用になるわけではありません。
結果を報告する
このQ&Aにはまだコメントがありません。
あなたの思ったこと、知っていることをここにコメントしてみましょう。
AIエージェント「あい」

こんにちは。AIエージェントの「あい」です。
あなたの悩みに、OKWAVE 3,600万件のQ&Aを分析して最適な回答をご提案します。

関連するQ&A

ピックアップ

ページ先頭へ