Windows

Microsoft Edgeでスマホサイトの表示

スポンサーリンク

PCでスマホサイトの表示

パソコンのWebブラウザーのMicrosoft Edgeで、ウェブサイトをスマホで見るような画面表示するやり方です。

インターネットのウェブサイトで、パソコンで見る場合とスマホで見る場合で表示が異なる場合あります。
パソコンでもスマホで見るような画面に表示したい場合です。

例えば、Yahoo! JAPANのウェブサイトのページです。
Microsoft Edgeで表示すると、パソコンでの表示画面はこんな感じです。
パソコン Microsoft Edge スマホ 画面 表示

Microsoft Edgeのユーザーエージェントを変更してスマホで見るような画面に表示すると、こんな感じです。
パソコン Microsoft Edge スマホ 画面 表示

操作手順

使用するWebブラウザーによってやり方が若干違います。
・「新しいMicrosoft Edge」でスマホ画面表示する手順
・「旧バージョンのMicrosoft Edge」でスマホ画面表示する手順

※IE11でスマホサイトの表示する場合は、こちらのブログ記事です。

IEでスマホサイトの画面表示
PCでスマホサイトの表示 パソコンのWebブラウザーのIE11(Internet Explorer 11)で、ウェブサイトをスマホで見るような画面表示するやり方です。 インターネットのウェブサイトで、パソコンで見る場合とスマホで見る場合...

新しいMicrosoft Edgeでスマホ画面表示する手順

新しいMicrosoft Edgeでスマホ画面表示する手順です。

(※旧バージョンのMicrosoft Edgeの場合は、このページのさらに下にスクロールしたところにあります)
新しいMicrosoft Edge

1.新しいMicrosoft Edge画面上で、開発者ツールを表示するショートカットキーの「F12」キー、または(キーボードで「Ctrl」+「Shift」+「i」キー)
マウスで開発者ツールを表示する場合は画面上で右クリックして、表示したメニューの「開発者ツールで調査する」をクリックします。
パソコン 新しいMicrosoft Edge スマホ 画面 表示

2.画面右側で「モニターのようなアイコン」ボタンをクリック
パソコン Microsoft Edge スマホ 画面 表示

3.次に、新しいMicrosoft Edgeの「更新」ボタンをクリックして、表示を更新すると、スマホ(モバイル)ページの表示になります。
パソコン Microsoft Edge スマホ 画面 表示

4.Yahooのページが、スマホで見るような表示になりました。
パソコン Microsoft Edge スマホ 画面 表示

5.「Responsive▼」で、表示するスマホの機種を変更できます。
パソコン Microsoft Edge スマホ 画面 表示

旧バージョンのMicrosoft Edgeでスマホ画面表示する手順

旧バージョンのMicrosoft Edgeでユーザーエージェントの変更してスマホ画面表示する手順です。

例として、ユーザーエージェントをアンドロイドスマホに変更する手順です。
旧バージョン Microsoft Edge

1.まず、スマホサイト表示したいページを表示しておきます。
※ページ移動すると、せっかく変更したユーザーエージェントが戻ってしまうため。

2.Microsoft Edge画面右上の「・・・」をクリック。表示したメニューの「開発者ツール」をクリック。
(または、Microsoft Edge画面上で「F12」キー)
旧バージョン Microsoft Edge ユーザーエージェント 変更 スマホサイト 画面 表示
3.Microsoft Edge画面右に開発者ツール画面が表示されるので、開発者ツール画面のメニューで「エミュレーション」をクリック。
旧バージョン Microsoft Edge ユーザーエージェント 変更 スマホサイト 画面 表示

4.エミュレーションの画面で「ユーザーエージェント文字列」を変更します。
旧バージョン Microsoft Edge ユーザーエージェント 変更 スマホサイト 画面 表示

5.エミュレーションの画面で「ユーザーエージェント文字列」を「カスタム」に選択。
次に「カスタムユーザーエージェント文字列」をアンドロイドスマホのユーザーエージェント文字列にします。
アンドロイドスマホのユーザーエージェント文字列は、Googleで検索すると見つかります。「アンドロイド ユーザーエージェント」のキーワードで検索してください。
例えば、auのUser Agent情報のページで分かります。
AQUOS sense2 SHV43の機種のユーザーエージェントは、
Mozilla/5.0 (Linux; Android 8.1.0; SHV43 Build/SA105) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.91 Mobile Safari/537.36
このユーザーエージェント文字列をコピーします。
旧バージョン Microsoft Edge ユーザーエージェント 変更 スマホサイト 画面 表示

6.「カスタムユーザーエージェント文字列」の入力欄に コピーしたユーザーエージェント文字列を Ctrl+Vで貼り付けて、「Enter」キーで画面が更新されます。
旧バージョン Microsoft Edge ユーザーエージェント 変更 スマホサイト 画面 表示

コメント

タイトルとURLをコピーしました