パソコン(PC)画面でスマホ表示を確認する早技!2アクションでOK

こんにちは!色付けマイスターのMASAです。

ブログを作っている方の多くはパソコンを使って記事作成やサイトを作っているのではないかと思うのですが

最近ではスマホユーザーが7割超えとも言われていますので、スマホからどの様に見えているのか?は気になりますよね。

この記事では、PC画面でスマホ表示を確認する早技をお伝えしています。

Chrome(クローム)を使う方法なのですが、2アクションで済んでしまいます!

 

「Chrome」(クローム)とはGoogleが開発しているウェブブラウザのこと。

ウェブブラウザは、他にもInternetExplorerSafariなどがあります。

私も、これを知るまではいちいち自分のブログのURLをスマホからアクセスして確認していたものです…。

PCで操作をしながら、サクッとスマホ表示も確認してみましょう!

 

PC 画面でスマホ表示を確認する方法

1:Chromeで表示させたい画面を開いておく

今回は私のHPを開いてみました↓

2:この状態で「F12」(ファンクションキー)を押す

すると下記の様な画面が右側に表示されます。

 

Macをお使いの方はキーボードの「Fn 」キーを押すとファンクションキー選択できるようになります。

※詳しくはこちらをご参考ください

 

3:右側に出てきた画面にあるスマホマークの様なボタンをクリックします

※このマーク

 

4:すると、左側にスマホサイズの少し細くなった画面が表示されます

※細くならなかった場合には、左画面の「Responsive」をクリックして「iPhone」など、スマホの機種を選択してみてください

 

5:通常の画面サイズに戻す場合には、再度F12を押せば戻ります

ピヨ
ピヨ
これで表示を見ながら手直しができるね!

 

いかがですか?めちゃめちゃ簡単にスマホ表示が確認できますよね!

最近は自動的に「レスポンシブ表示(閲覧者の画面サイズに自動的に合わせてくれるデザイン)」をしてくれるブログのテーマも多いのですが、気がつかないところでスマホでの表示が乱れている・・・ということもありますので、やはり一度きちんと自分の目で表示を確認するのは大事です。

ちなみに、今回ご紹介したスマホの表示方法はChromeでの方法ですが、ちゃんと他のウェブブラウザでも表示できる方法があります。

インターネットエクスプローラー(IE)での切り替え方法はこちらの記事がとてもわかりやすかったです。

 

これからはスマホユーザーが益々増える一方だと思いますので、スマホユーザーの方がストレスにならないページ作成というのは必須条件になりそうですね!

アフィリ先生
アフィリ先生
ブログも見やすさは大事!!

 

・ブログを始めてみたいけど何からどうやったらいいのかわからない
・ブログアフィリエイトをやってるけどなかなか成果が出ない
・どうやってブログのキーワードを選んでいいかわからない

その様な方は、ぜひ私の無料メルマガをご覧になってみてください。

メルマガ登録のプレゼントとして、ブログ初心者の方がどうやってブログを作っていって収益化していくのか?を0から学べるガイドブックを差し上げています。

▼初心者でもブログでの稼ぎ方を0からしっかり学べる無料レッスンです▼