光と空

日常での出来事や思った事、感じた事を綴っていきます。

【はてなブログ】自分のブログがスマホでどう映っているのかPCで確認する方法。

おはようございますtakaです。

あ~、流石にスマホを持たねばアカンなぁ。

ガラケーでは時代に追い付いて行けないなとは思っていたんですけど。

PCのネット料金でさえ高くて、それにスマホもプラスとなると月々の通信料金はかなりだろうと予想は出来る。

今年はスマホを購入しようと思ってます、稲刈り後になろうかと思うが。

それでね、自分のようにまだガラケーの人もいるのかもしれない。

けどブログとか書いていて、PCはあってもスマホで自分の記事はどう映っているんだろうと気になる方もいるかと思います。

操作としてはすごく簡単なので何かしらの参考になれば幸いです。

※あくまでもグーグルクロームでの設定ですm(__)m

 

f:id:hikaritosora:20190327184833j:plain

 

これが俺のはてなブログでPC画面のトップページ。

本当はPCの方が大きくて全画面映るから楽に見れるんだけどね・・・そうなればいつでもどこでも電話の受けかけも出来て、ネットも見れるスマホには敵いません。

自分のブログの検索流入としてはスマホが約7割くらいです、それほどスマホの時代です。

そこでこのPC画面のトップページ(一つの記事ページでもいいけど)で、PCキーボードの上にありますが「F12」キーを押して下さい。

 

f:id:hikaritosora:20190327185523j:plain

 

そうしますとPC画面ではこのように表示されます。

今やはてなブログの利用者はレスポンシブデザイン(PCの画面表示をそのままスマホに表示する)を利用されている方も多いかと。

そうなれば、この記事はここで終わりになりますが(笑)

ここに表示されているのはレスポンシブデザインとなります、最初からそれに設定していれば何も悩む事はない。

けど、俺はレスポンシブにはあえてしていません「スマホ用のHTML」設定としていますから。

となれば、これだけでは確認も出来ません、そこで左上の赤い円の所、ここをクリックする、つまりは「再読み込み」という形になります。

そして青い円で囲った場所でこの画像では「iPhoneX」となっています。

この青い円の所をクリックすると他には「iPhone6.7.8」とか選択できる項目が出てきます。

それぞれのスマホの機種でどのように表示されるのか、それに照らし合わせて確認も出来るかと思います。

 

f:id:hikaritosora:20190327190937j:plain

 

で、再読み込みすると、スマホではこのように表示されていますよと確認が出来るんですね!

PCでも自分のようにガラケーだったとして、いざスマホではどう映っているんだろうかと確認したい場合は、これも参考になるかと思います。

つまりまとめるならば、自分のブログを表示させてキーボードの「F12」キーを押せば「スマホ画面として確認出来ますよ」となります。

これってザックリした表示なんでしょうけどね、やっぱり本物のスマホで直に確認出来るのが一番良いですわな。

今日は簡単にこれで終わります、ブログを見て頂きありがとうございました。

へばね~。

 

© 2020 光と空