パソコン画面で自身のサイトのスマホ表示を確認する方法

自分のサイトがスマホからどんな感じで表示されているのか、気になりますよね。

近年スマホでウェブを閲覧するユーザー層が増えてきている為、スマホ表示が重要視されています。

そんなスマホ表示の確認方法ですが、実はとても簡単にできるんです。

今回は、「パソコン画面で自身のサイトのスマホ表示を確認する方法」をご紹介します。

2015年から「モバイルフレンドリーアップデート」の開始

その前に、なんでスマホ表示にも気をつける必要があるのかってところです。

実は、Google側も2015年4月に「モバイルフレンドリーアップデート」を開始しました。

Googleがこのような評価基準を設けたので、ウェブで集客を行っていく我々もこれに従わない訳にはいきません。

まさに、郷に入っては郷に従えです。

といった理由で、スマホからの表示にも気をつけないといけません。

それで具体的な方法は、、、。

一番お手軽で簡単なのが、Chromeの拡張機能を使用する方法です。

「Window Resizer」という拡張機能を導入すると簡単にスマホ表示の確認が可能です。

この拡張機能を使うことで、各デバイスのサイズごとに画面サイズが変化させることができます。

導入後は、ツールバーにアイコンが表示されるので、そちらをクリックするだけです。

直感的に使用することが出来ますが、もしも迷った場合は「Window Resizer　使い方」で検索してください。

GoogleChromeには、デベロッパーツールという開発者向けのツールが搭載されています。

ウェブサイトを開いた状態で「右クリック」＞検証をクリックで、デベロッパーツールを起動できます。

起動した状態で、Windowsの場合「Ctrl＋Shift＋M」、Macの場合「command＋Shift＋M」をクリックするとスマホ表示にすることが可能です。

デベロッパーツールはツールは、テキストだけで解説するのが難しいので、「デベロッパーツール使い方」、「デベロッパーツールスマホ表示」で検索してみてください。

今回は、「パソコン画面で自身のサイトのスマホ表示を確認する方法」をご紹介しました。

これでスマホ表示を簡単に確認することができますね。

参考にしてみてください。