phpとmysqlとマーケティングについてのメモ

忘れてしまってもいいいように

PCブラウザでスマホ専用サイトを見る方法(IE編)

スマートフォン専用サイトを作成している際にPC上からスマホ画面を確認する方法です。

※クロームファイヤーフォックスは比較的情報が多かったのでIEについて記事を書きました。

 

1.  IEを起動 (※今回はIE11です)

 

f:id:editors_tbr:20140606105032j:plain

2. F12を押す。

※動作としては [ツール] → [開発者ツール] と同じ挙動です。

f:id:editors_tbr:20140606105024j:plain

 

3. ブラウザの下にナビゲーションが現れます。

f:id:editors_tbr:20140606105313j:plain

 

4. モードからエミュレーションを選択(もしくCTRL+8)してください

下記の画面の入力欄ユーザーエージェントの場所からカスタムを選択し「iPhone」と入力をしてください。

f:id:editors_tbr:20140606110639j:plain

↓ 入力後の画面はこちら

f:id:editors_tbr:20140606110956j:plain

5. これで スマホ用の画面となっているはずです。

開発者ツールスマホ用の画面の確認が終わるまで閉じずにいてください。

 

Yahoo!のトップページが変わりました。

 

f:id:editors_tbr:20140606111520j:plain

 

Yahooは実際のiPhoneから閲覧できるページとこの開発者ツールで閲覧ができるサイトの内容が異なっていますが、ユーザーエージェント判定によりPC専用サイトとスマホ専用サイトを切り替えて表示している場合には今回ご案内した方法で問題無いと思います。