自分のサイトがスマホからどのような表示されているのか、気になりますよね。
近年スマホでウェブを閲覧するユーザー層が増えてきている為、スマホ表示が重要視されています。
そんなスマホ表示の確認方法ですが、実はとても簡単にできるんです。
今回は、「パソコンから自社サイトのスマホ表示を確認する方法」をご紹介します。
2015年から「モバイル フレンドリーアップデート」の開始
その前に、なぜスマホ表示にも気をつける必要があるのか、についてです。（もはや説明不要かと思いますが、念の為）
Google側も2015年4月に「モバイル フレンドリーアップデート」を開始しました。
Googleがこのような評価基準を設けた為、ウェブで集客を行っていく我々もこれに従わない訳にはいきません。
郷に入っては郷に従えです。
そういった理由で、スマホからの表示にも気をつけないといけません。
Chrome拡張機能「Window Resizer」を使用
一番お手軽で簡単なのが、Chromeの拡張機能を使用する方法です。
「Window Resizer」という拡張機能を導入すると簡単にスマホ表示の確認が可能です。
この拡張機能を使うことで、各デバイスのサイズごとに画面サイズが変化させることができます。
導入後は、ツールバーにアイコンが表示されるので、そちらをクリックするだけです。
直感的に使用することが出来ますが、もしも迷った場合は「Window Resizer 使い方」で検索してください。
「デベロッパーツール」を使用
GoogleChromeには、デベロッパーツールという開発者向けのツールが搭載されています。
ウェブサイトを開いた状態で「右クリック」 ＞ 検証をクリックで、デベロッパーツールを起動できます。
起動した状態で、
- Windowsの場合「Ctrl＋Shift＋M」、
- Macの場合「command＋Shift＋M」
をクリックするとスマホ表示にすることが可能です。
デベロッパーツールはツールは、テキストだけで解説するのが難しいので、
- 「デベロッパーツール 使い方」、
- 「デベロッパーツール スマホ表示」
で検索してみてください。
編集後記
今回は、「パソコンから自社サイトのスマホ表示を確認する方法」をご紹介しました。
これでスマホ表示を簡単に確認することができますね。
表示を確認できても、調整できなければ意味がないので、そういった意味でも自分で管理や操作ができる必要があります。
ですので、WordPressで自分で管理しましょう。
WordPressについては、以下の記事で解説されています。
また以下のような書籍で解説されています。
