スマホファーストを意識した見やすいブログレイアウトの作り方

20170928B

こんにちは、名畑です。
最近お茶にはちみつを大量投入しているせいか口がずっと甘いです。
さらに飴もなめたりしているのではちみつの入れ過ぎも問題なのかなと悩むこの頃です。

最近ブログでもホームページでもほとんどがスマホから見られます。
なのでブログを作る際、スマホからどのように見えるのか気をつけなければなりません。
ブログを作る際にスマホで見ることを意識して注意しなければならないポイントをまとめました。

目次

  • 見やすい導線
  • 早く表示される工夫をする
  • ブログのテキスト
  • おわりに

見やすい導線

サイトを作成する上でも一番大切な部分です。
ブログを見た時に一番問合せに繋げたいようでしたらどのページを表示させても問合せページに飛べるようなデザインにする必要があります。

SNSシェアボタンや読者登録等分かりやすい位置に表示させるようにしましょう。
例えばSNSシェアボタンは記事を読み終わって「良かったな」と思った人がシェアしてくれます。
なので読み終わった時にシェアできるように、記事の最後に設置するようにしましょう。

メニューの位置も分かりやすく、ブログを読む際に邪魔にならない位置に配置しなければなりません。
ブログを読んだ人に対して動作がしやすい、ブログが読みやすい設計にしましょう。

早く表示される工夫をする

スマートフォンでブログを見ていると、通信量を気にしている人が多いです。
さらに、画像等の読み込みファイルが多いとページを表示させるまでの時間がかかってしまいます。
そうすると、いつまでもページの読み込みを待つ人はいませんので、ページを見ずに離脱してしまう人がいます。
ページの表示が遅いというだけで離脱されてしまうと、文章を何も見ずにページから離れてしまいますので、それを防ぐためにページを早く表示させるようにする工夫が必要です。
パソコンのブラウザでは画像や動画を多く使用しても、スマホの際はごちゃごちゃさせすぎずシンプルに画像とテキストのみで軽く表示させる工夫をしましょう。

ブログのテキスト

文字の大きさが適切であるか、実際様々なデバイスで確認しましょう。
一番読みやすいフォントの大きさをデフォルトにしてなるべく文字サイズを変えないようにしましょう。

フォントのサイズが調整できたら、ブログを書く際もテキストの改行に注意が必要です。
テキストを整えるのはパソコンの方が楽なので、パソコンで編集する方が多いと思います。
なので見やすいように文章の途中で改行して作成する方がいますが、それはスマートフォンで見た際見にくくなってしまうので注意が必要です。
なぜならパソコンとスマートフォンでは見ている画面のサイズが異なります。
パソコンで見やすい位置で改行したとしても、スマートフォンで見た際に文章の途中で改行してしまい、最終的に改行が多い読みにくいブログ記事になってしまいます。
スマートフォンでも読みやすくするためには、文章をむやみに改行させないことです。
もちろん読みやすいように句読点での改行は読みやすくなっていいのですが、不用意な改行はあまりしないようにしましょう。

おわりに

スマホファーストで見やすいブログ設計も大切ですが、その後の運用も、スマホで見た際に見やすくなっているのかどうかが大切になります。
日々スマートフォンからのアクセスが増えてきています。
スマートフォンから見やすいブログを目指して作成していきましょう!

  • シェア
  • twitter
The following two tabs change content below.
名畑かなえ
株式会社インファクトのディレクターです。
フロントエンジニアだった知識を活かしてお客様のためになるような情報発信、制作を行なっております。また日本だけでなくベトナムスタッフとも連携して業務をとりまとめております。
好きなことは、自分で1から考えるものづくり。本の装丁が気になったり布ものやお菓子を自分でデザインして注文するのが好きです。
やっぱりはちみつなしでは生きてゆけない。
  • twitter
  • このエントリーをはてなブックマークに追加
  • Pocket
PAGE TOP
LINE it!