PC（パソコン）でブログのモバイル表示を確認する方法

ブログ運営

2020.07.05

記事に広告(アフィリエイト広告)が含まれています。

PC（パソコン）でブログのモバイル表示を確認する方法

ブログ初心者は初めてのことばかりでわからないことだらけ。

ネットを調べて、本を読んでは設定方法、対策方法を確認しながらの日々。

ふと、思いました。困ったこと、悩んだこと、疑問に思ったことを記事として書いておこうと。

あとで、またわからなくなった時に、調べなおさなくてよいように。

また、同じようなブログ初心者の一助となるように。

ということで、WordPressを利用したブログ運用についてメモとして残しておきたいと思います

「悩んだこと」「これは使える」などなど記事にしていきます。

本日は、ブログのモバイル端末での表示確認について。

ブログを書いたあと、モバイル端末で表示がくずれていないかチェックしていますか？

何も知らない、私は自分のスマホでチェックしていました。

でも、スマホでチェックするとアナリィティクスにログに残るし・・・。
※残らないように設定すれば良いのですが、PCほど簡単ではありません。
※PCはアドオンの追加のみでアナリティクスから自分のアクセスを除外できます。

また、「いちいちスマホで見るのも面倒だな」と思っていました。

実は、「Chrome」で簡単にチェックできるんです。

ネットを調べれば、わかると思いますがメモとして残しておきたいと思います。

そもそも、「多少のお金をかけて、自分で確認したくない！」

というかたは「ココナラ」に登録して、誰かにお願いしてしまうのも一つです。

※会員登録無料

はじめに
デベロッパーツール起動
色んな端末の表示結果
Rotate（横向きのチェック）
その他
まとめ

はじめに

まずは、簡単に流れを説明します。

１．「Chrome」をインストールする。
２．モバイル表示させたいサイトを「Chrome」で開く。
３．「F12」キーを押す。※デベロッパーツールを起動
４．見たいモバイル端末を選択し表示。
５．「F5」キーで画面を更新。
６．表示画面をチェック
７．チェックを終了したらデベロッパーツールを閉じる。

たったこれだけです。

デベロッパーツールは、上記以外にも色々なことができます。

自分のブログのHTMLとCSSコードをテストで書き換えて表示をチェックする。

他のウェブサイトのコードがどのように書かれているのかチェックする。

などなど他にもたくさんあります。

まだまだ使えこなせそうにないですが、いずれ使いこなしてブログで紹介できればと考えています。

本日は、簡単に使える「モバイル端末の表示チェック」について説明します。

スマホなどのモバイル端末での表示を簡単にできます。

ブログ作業の効率アップにつながるはずです。

Chromeをインストールしていないかたは下記からインストールできます。