知らなきゃ損！パソコン上でホームページのモバイルでの見え方を爆速でチェックする方法

2015年4月に実施された、モバイルフレンドリーアップデート。
Googleは、2016年5月に再度モバイルフレンドリーアップデートの影響力を高めるアルゴリズムの更新があるとアナウンスしています。

Continuing to make the web more mobile friendly｜Official Google Webmaster Central Blog

このアップデートにより、モバイルでも見やすいページが検索結果でさらに多く表示されるようになります。
モバイルフレンドリーなホームページには特に影響は出ないものの、モバイル対応していないホームページはGoogleの検索結果で順位が下がってしまうおそれがあります。

今回は、パソコンで見ているホームページがモバイル対応しているかどうか、一瞬で分かる方法をご紹介します。
モバイルフレンドリーかを確認するためにその都度URLを転送する、などの手間を省くことができますので、ぜひ習得しておきましょう。

このニュースを読んだあなたにオススメ

SEO（検索エンジン最適化）とは

パソコンで簡単にホームページがモバイル対応しているかを確認する方法

インターネットを閲覧するためのブラウザのひとつ、Google Chrome(以下Chrome)にデフォルトで搭載されている「デベロッパーツール」という機能のひとつを使用します。
ホームページを制作する際によく使用するツールですが、モバイル対応になっているかを確認する際にも非常に便利です。

step1.

まず、Chromeを立ち上げます。
使用しているブラウザがChromeではない場合は、以下のURLからダウンロードしてください。
https://www.google.com/chrome/browser/desktop/

step2.

モバイル対応かどうかをチェックしたいホームページを開きます。
スマートフォン専用のURLがある場合は、そのURLでホームページを開いてください。

step3.

キーボードの「Ctrl + Shift + C(Macの場合はCommand + Shift + C)」を押します。
すると、画面右側にソースコードが表示されます。

step4.

表示されたソースコードの一番上に、2つの長方形が重なったアイコンが表示されています(画像赤枠部分)。
ここをクリックしてください。
すると、スマートフォンでホームページを閲覧した場合の見え方が表示されます。

step5.

画面左側のホームページが表示されている方では、スマートフォンの種類を選択することができます。
ここで「Edit」をクリックすると、確認したいスマートフォンの機種を増やすことができます。
これでチェック完了です。

スマートフォンの表示のままページ遷移をしたり、スクリーンショットを撮影したりなども可能です。
この機能を使用すれば、例えばスマートフォンの画面を使用してなにか解説をしたい場合でも、わざわざスマートフォンで画面を撮影してパソコンに転送する必要はありません。

終了して通常のパソコンでの画面に戻す場合は、ソースコードの右上に表示されている×のアイコンをクリックしてください。