こんにちは、マーシーです。
トレンドブログライフは順調ですか？
12月はアフィリエイトでも稼げる時期と言われていますから。
稼げている人もまだまだの人も
年末年始に向けてまだまだネタは豊富ですので、
ガンガン攻めていきたいところですね！
今日僕は本業の方の日直当番でして、
休日ではありますが、会社の日直室で1日を過ごしていました。
ほぼ電話番のような感じで大した仕事も無い（笑）ので
愛用しているMacBook Airを持参し、
トレンドブログを書こうかな〜と（日直ちゃうの？）
皆さんもそうだと思いますが、
ブログを書くのはPCを使用しますよね？
さすがにスマホでは文字を打つだけで一苦労ですから。。。
僕はブラウザにGoogleChromeを使っています。
ということで、PCで記事を書き書き（日直ちゃんとせ〜よ。。）
30分ほどでブログも完成し、アップも完了！
僕はアップ完了したブログをスマホでも確認しますが（これ大事です！）
そこで思ったのが
「いちいちスマホでサイト確認、地味に面倒」
と面倒くさがり感満載のこの気持ち（笑）
そこでPCでスマホ画面のプレビューができないのかな？
と調べてみると、ありましたよー！
その方法を解説していきたいと思います！
GoogleChromeの開発/管理を使おう！
ちなみに先ほども書きましたが、
僕はMacを使っていますので
解説は基本的にMacに準拠していますよ。
まずは画面上のメニューから
「表示」→「開発/管理」→「デベロッパー ツール」
このメニュー、普段はまず使わないです（笑）
ワードプレスはこんなの分からずともできるので
そこが良いところですよね！
、、、と話を戻して、先ほどの
「デベロッパー ツール」をクリックすると
このような画面になります↓
またまたわけの分からない画面が。。。
画面右の文字がやばい（何にも分かりませ〜ん）
でもこれでも稼げるんですよ（ちょっと自慢！）
とりあえず気にせず（笑）
このアイコンをボチリとクリックすると
↓
↓
↓
↓
…あれ？変わってない？
安心してくださいw
この状態でリロードをすると
スマホ用サイトの表示に変わります！
ちなみにプレビュー画面の上部、ここをクリックすると
iPhoneやiPadからGalaxyなどのプレビューもできますよ。
一番下の「Edit…」をクリックすると
それ以外のスマホやタブレットでのプレビューも対応できます。
ちなみに僕が運営しているトレンドブログは
PCとスマホでは広告サイズが変わるように設定しています。
このPC版グーグルクロームを使用した画面プレビューでは
その広告サイズに関してもスマホ表示ではしっかり変わってくれますよ。
結構便利な小技だと思いませんか？
ちなみにショートカットでの
デベロッパーツールの表示は
command ＋ option ＋ i（Mac）
ctrl ＋ shift ＋ i（Windows）
ですよ！
スマホ表示をチェックする重要性
スマホ用表示を重要視する理由は
現在のGoogleの方向性に従うという意味もあります。
Googleは今後はPCサイトよりもスマホサイト
つまりモバイルでの評価を優先し検索結果に反映させる
「モバイルファーストインデックス」を採用するからです。
現時点（2016年12月時点）ではまだスタートはしていませんが、
今後必ず導入されることになるでしょう。
皆さんのトレンドブログもそうだと思いますが、
圧倒的にモバイルからのアクセスの方が多いですよね？
この結果からも言えますが、
スマホサイトを基本軸としてのトレンドブログ作りが
常識となる、いやすでになっていると考えて
ブログ構築をしていった方が賢明です。
ワードプレスのテーマは
PCでもスマホ（モバイル）どちらでも
それに最適なデザインを表示してくれる、
「レスポンシブデザイン」が主流です。
事実、僕はデザインカスタマイズについて
ほとんど分かっていませんが、
PC用・スマホ用どちらも
「いい感じ」でしっかり表示されていますし（笑）
（これからコツコツ覚えていきます・・・）
このようなことからトレンドブログ運営者は
サイトデザインそのものを考えるまえに
まずは「モバイルでのアドセンスの最適な配置」を
検証・実践することに比重を置くことを
先決した方がよい、ということが言えますね。
なので、GoogleChromeでのスマホ表示チェックは
簡単に実践できるので、広告位置のチェックには最適ですね！
では、今日はこの辺で。
最近のコメント