こんにちは！びたろーです。
初心者ブロガーの皆さんに質問です。
あなたのブログはどんなデバイスで見られているでしょうか？
考えてみたことあります？
ちなみにブログの記事は何を使って書いていますか？
パソコン？タブレット？スマホ？
パソコンで完璧！と思って公開した記事も、スマホで見たらガチャガチャになっていて、見るのもうんざり…という経験はないでしょうか。
せっかくの力作が、スマホで見たら見た目が変わっていて全然読まれていないとしたらショックですよね。
今回の記事では、おろそかにしがちな記事の画面チェックのやり方について紹介します。
やっておいたほうがいいですよ！
記事の書いたらスマホでチェックは必須事項
スマホが普及して10年ほどですが、今やインターネットの利用もスマホ経由が多くなっています。
そんな環境を反映してか、Google検索ではスマートフォン利用に最適化されたサイトが「モバイル端末からの」検索結果で優遇されやすくなっています。
つまり、スマホでも見やすいサイト作りが求められているということです。
パソコンやスマホ、タブレットなどいろいろありますが、見る媒体によってあなたのブログの見た目も変わってきます。
こちらをご覧ください。
パソコンで記事を書いていて、画面表示は特に問題ないと思っていても、スマホで見てみると文章の表示が画面に対してずれて読みづらくなっている場合があります。
WordPressで使っているテーマには、使用している端末に合わせて表示させるデザインを変える“レスポンシブ対応”になっているものが多いので、スマホのことを考えていなくても調整されて表示されます。
パソコンの画面と同じものをスマホの画面内で表示させると、字が小さくなりすぎて読めなくなってしまいますからね。
一方、文字などをパソコンと同じ見た目で表示するとスマホの画面からはみ出てしまい、横にスクロールしながら見なくてはならないのでとても不便になってしまいます。
そうならないように調整してくれるのがレスポンシブというわけですが、この調整のおかげでスマホ画面になると位置がずれてレイアウトが乱れるということが起こります。(上の例もレスポンシブ対応のテーマを使用しています）
なので、記事を公開するとき、した後はスマホでのチェックが必須なのです。
繰り返しになりますが、スマホで見づらいと離脱しちゃいますよ。
パソコン画面でスマホの見え方をチェックする方法
それでは、パソコンのモニター上で行うスマホ表示のチェック方法をご紹介します。
手順はこちら↓
- プレビューの表示
- ブラウザの機能を使ってスマホのプレビューを表示
プレビューの表示
記事の作成途中に文章の長さを確認するには、WordPressのプレビュー機能を使ってプレビューを表示させます。
・WordPressの画面上部のプレビューをクリック。
・プルダウンで出てきた一覧の一番下にある「新しいタブでプレビュー」を選択。
すると記事を編集している画面とは別にプレビューの画面が表示されます。
ブラウザの機能を使ってスマホのプレビューを表示する方法
プレビューが表示した後の手順について説明します。
Google Chromeの場合。
プレビュー画面の余白部分で右クリックしてメニューを表示させ、一番下の「検証」をクリックします。
表示される画面がこちら↓
←次に画面上部にあるこのアイコンをクリックします。
↓スマホのプレビュー画面が表示されます。
画面上部の”サイズ”のところにある▼ボタンをクリックすると、プルダウンでスマホの機種が表示されるので近いものを選ぶといいでしょう。
Google Chromeでの確認方法は以上です。
Microsoft Edgeの場合
プレビュー画面の余白部分で右クリックしてメニューを表示させ、一番下の「開発者ツールで調査する」をクリックします。
表示される画面がこちら↓
←次に画面上部にあるこのアイコンをクリックします。
↓スマホのプレビュー画面が表示されます。
画面上部の”ディメンション”のところにある▼ボタンをクリックすると、プルダウンでスマホの機種が表示されるので近いものを選ぶといいでしょう。
Microsoft Edgeでの確認方法は以上です。
パソコンで記事を作成するときの注意点
スマホで記事を書くことができないわけではありませんが、ほとんどの方は記事を書く時はパソコンを使っているのではないでしょうか。
私もパソコンのキーボードの方が文字入力は早いですし、大きな画面で見ることができるので断然パソコン派です。
外観テーマがレスポンシブ対応になっていれば、スマホ画面に合うように表示してくれるのですが、見た目が大きく変わりますし、意図しないところで改行が入ったりして、見た目が悪くなることがあります。
読者の離脱を避けるためにも、スマホチェックはしっかりしておきたいですね。
ということで、記事作成時の注意事項を説明します。
★パソコンで記事を書くときの注意点★
◆一文の文字数を少な目に
上の画像をご覧いただくとわかると思いますが、パソコンとスマホの画面では表示される１行の文字数が変わります。
パソコンのモニターで見た目バッチリ！バランスもOK！と思っていても実は…
スマホでは１行の文字数が少なくなるため、１つの文を表示する行数が増えます。
そのためパソコンのモニターでは窮屈な感じがなかったとしても、スマホで表示した途端に、行数が増え、見た目に圧迫感を感じることもあります。
ページを見て、圧迫感を感じたら…
そう！読むのが嫌になっちゃいますよね。
ですから、１つの文章の文字数は少な目にしましょう。
◆表を挿入した場合は必ずチェック
案外困るのが表です。
記事中に表を書き込んでいると、スマホ画面にしたときに横が狭められて縦に伸びるようになるため、とても見づらい表になってしまいます。
例えばこれ↓
上の例では、スマホ画面にすると食パンの列が表示されなくなっていました。
このような場合は、表を書き込むのではなく画像として貼り付けておき、クリックすると別ウィンドウで表が表示されるようにしておくと、見やすくなるのでおすすめです。
◆その他の注意点◆
- 文字の大きさは適切か
- おかしな改行になっていないか
あなたのブログが何で見られているか調べる方法
あなたのブログを読者が何で見ているか、知っていますか？
パソコンやスマホ、タブレットなどいろいろありますが、見る媒体によってあなたのブログの見た目も変わってきます。
スマホが普及して久しいですが、今やインターネットの利用もスマホ経由によるものが多くなっています。
そんな環境を反映してか、Googleの検索結果においては、スマートフォン利用に最適化されたサイトが“モバイルでの“検索結果で優遇されやすくなっています。
つまりスマホでも見やすいサイトづくりが求められているということです。
→ Google 検索セントラル ブログ(モバイル ファーストのインデックス登録について)
ブログの記事作成などはもっぱらパソコンという方は、なかなか自分のサイトをスマホでチェックするなんてことはしていないのではないでしょうか。
パソコンに限らず、ページが見づらいと読者の離脱を招きます。
検索結果にも影響をするということなのですぐに対応しましょう。
◆自分のブログを見ている”デバイスは何か”を調べる
あなたのブログはパソコンで見られている？それともスマホやタブレット？
それを調べることができるのはGoogleアナリティクスです。
Googleアナリティクスのメイン画面で「ユーザー」⇒「モバイル」⇒「概要」の順にクリックします。
するとデバイスごとの使用率が表示されます。↓こちら。
これは、このブログについて調べてみた結果です。
mobile（主にスマートフォン）：80.00％
desktop（パソコン）：20.00％
これを見てもわかるようにスマホで見ている割合が多いですね。
先ほどのメニュー画面で、「モバイル」⇒「デバイス」と見ていくとスマホの機種までわかります。
Googleアナリティクスって優秀なのね！
あなたのブログが何で見られているか、Googleアナリティクスで確認しておいた方がいいですよ。
Googleアナリティクスを登録していない方はすぐに登録して、分析できるようにした放がいいですよ。↓こちらをご参考ください。
思っているよりスマホで見ている割合が多いことがわかると思います。
スマホ対策必須です。
まとめ
記事のスマホチェックは必須です。
大切なのはパソコン表示とスマホ表示のバランスです。
スマホの見た目を気にするあまり、パソコンでの見た目が貧弱なものになってしまっては困りますので、どちらもプレビューを活用してチェックしましょう。
また、ジャンルによって利用されるデバイスに傾向がある場合、傾向に合わせてどちらを優先にするか考えてもいいでしょう。
最後までお読みいただきありがとうございました。
コメント