サイトの確認方法について教えて下さい。

Question

お世話になります。
Webサイト制作におけるサイト確認方法について
良い方法を教えていただけませんでしょうか。

今までレスポンシブサイトを主に制作してきたのですが、
何気にクロームやIEを使ってブラウザを伸縮させて確認
していました。

ふと、ユーザーエージェントで表示を振り分けるタイプ（？）
もしくはデバイスがスマホかPCを自動的に振り分けるタイプの場合は
どうしたらよいかと気になりました。

同じURLでスマホ版が用意されているサイトを見る場合、
クロームやIEで確認しても、PCサイトを縮めただけの
表示になるためスマホサイトを確認できません。

クロームの設定が間違えているのでしょうか？
それともやはり都度々スマホを見ながらチェックしながら
制作していらっしゃるのでしょうか？

技術者の皆様はどのようにチェックされていらっしゃるのか
教えていただきたく質問させて頂きました。

よろしくお願い致します。

Answer 1

最終的には実機を使用することになると思いますが、UserAgent による振り分け確認程度であれば、Chrome の開発ツールを使用するケースが多いと思います。
簡易的ですが代表的なスマホの画面サイズと UA による振り分けの確認が可能です。

Comments

[lingwood]

te2ji　様
お世話になります。
ご回答ありがとうございます。

UAによる振り分けの確認ができるのですか？

クロームの設定が悪いのでしょうか・・・
上述の通り同じURLでもPCサイトとスマホサイトが
あってPCサイトを縮めただけの表示しかされなくて
困っています。

すみません、その辺りご教授いただけませんでしょうか？
宜しくお願い致します。

[退会済みユーザー]

開発ツール（F12で開く）を使用して下さい。

[kei344]

http://ocadweb.com/web/googlechromedevelopertools

[退会済みユーザー]

フォーローありがとうございます!
F12 は Windows 機 だけでしたね＾＾；

[lingwood]

te2ji　様
ありがとうございます。

kei344　様
ありがとうございます。

分かりました。
デベロッパーツールでiphoneなどに設定しても
UAで振り分けられている場合、表示が変わらなかったんですが、
リロードしていなかったからみたいでした！！！！

今までずっと変わらない、変わらないと思ってやってきたのが
何だったのかと思うほど間抜けでした・・・

こうして質問させて頂かなかったら気がつかなったと思います。
本当にありがとうございます。

Answer 2

ユーザーエージェントで表示を振り分けるタイプ

User Agent を任意に変えて、応答がどう変わるかを調べたいなら Fiddler を使ってはいかがでしょう？

Fiddler のお勧め
http://surferonwww.info/BlogEngine/post/2011/05/25/Recommendation-of-Fiddler.aspx

以下の記事にありますように、Composer タブでサーバーに対するリクエストを作成して発行することができ、User Agent も任意に変えることができます。

「Fiddler ユーザーの集い」フォローアップ (2/2)
https://blogs.msdn.microsoft.com/osamum/2013/07/03/fiddler-22/

Comments

[lingwood]

SurferOnWww 　様

お世話になります。
だいぶ以前になりますが、
当該回答をいただいておりましたこと、
気がつかず大変失礼いたしました。

ありがとうございます。

大変丁寧にご回答いただいたにも関わらず、
本当にすみません。

またありがたく試行させていただきたく思います。

またの際にも何卒よろしくお願い致します。