パソコンでスマートフォン(スマホ)表示の確認

スマートフォン(以後スマホ)を持っていないけど、スマホでどのようにサイトが表示されるのかを確認したい場合や、スマホからサイトを見るのが面倒な場合などに役立ちます。

お使いのブラウザがChromeの方は、1分ほどで設定が完了します。

Chromeのダウンロードはこちらからどうぞ。

Google Chromeのダウンロードとインストール

ダウンロードページに移動したら、「Google Chromeを無料ダウンロード」をクリックします。

下の画像になるので、Google Chromeを既定のブラウザに設定する場合はチェックをそのままに、したくない場合はチェックをはずします。

使用統計情報と障害レポートをGoogleに自動送信する場合はチェックを入れ、したくない場合はそのままにする。

利用規約を読んで、「同意してインストール」をクリックします。

インストールが終わると、自動的に起動してデスクトップ画面にショートカットが作成されます。

IEからインポートするかどうかなどの設定ができたら、拡張機能を追加します。

Chrome UA Spooferのダウンロード

Chrome UA Spoofer

ブラウザの×ボタン(閉じるボタン)の下にある「レンチマーク」もしくは「三のようなマーク」をクリックして、「設定」を選択します。

設定画面になったら、左側の「拡張機能」をクリックします。
拡張機能画面になったら、下のほうにある「他の拡張機能を見る」をクリックします。

すると、Chromeウェブストアに移動するので、左上の検索ボックスに「Chrome UA Spoofer」と入力してエンターを押します。
検索結果が表示されるので、その中から「User-Agent Switcher for Chrome」をダウンロードします。

「+無料」ボタンをクリックすると「確認しています」に変わり、新しい拡張機能の確認ウィンドウが開きます。
「User-Agent Switcher for Chrome」を追加しますか? 次の権限に・・・と出るので、問題なければ「追加」をクリックします。


すると、×ボタンの下に仮面のアイコンが表示されます。
これで、拡張機能の追加は完了です。

画像にも書いてあるとおり、この拡張機能を使用するには、アイコンをクリックします。

Chrome UA Spooferの使い方

仮面アイコンをクリックしたら、下の画像のようにウィンドウが開きます。
iOSをクリックして、iPhone4を選択したら、ブラウザのサイズを調節して完了です。
これで、レスポンシブウェブデザインの確認ができます。

パソコン画面に戻すときは、仮面アイコンクリック後に、ChromeをクリックしてDefaultを選択したら元に戻ります。
スポンサーリンク
スポンサーリンク