ユーザーを意識したレイアウトとは！。ブログを作成する際、ユーザーを意識したレイアウト作りを考えることは大事なことです。今回は、ユーザーを意識したレイアウトとは！について書いていきます。
ブログアフィリエイトは、ユーザーファーストを意識して作成するように心掛けましょう。ユーザーが必要としている情報が直ぐに見つかり、ストレスを与えないようなブログレイアウトにした方が良いでしょう。
| 結論を先に話ししておきます |
| 私が思うに、ユーザーを意識したレイアウトとは「見やすい」「分かりやすい」ブログではないかと思う訳です。ユーザーを意識したレイアウトを作る為には、文章だけではなく、装飾なども工夫することが大事だと思うのです。
また直感的に分かる構成にすることが大切とも思う訳です。読み手に情報を整理して貰うのではなく、書き手側が「情報」や「レイアウト」を整理し、読み手の考える負担を減らすことで、読み手に「親切な作りのブログ」になるのです。一応下記を参考に。
|
| ワードプレス制作を簡単にする！「プログラミング不要！ＷＥＢサイト作成ツール【weluka】」。 |
目次はコチラ
【ブログアフィリエイトで用いられるレイアウトの種類(動画付き)】
レイアウトの種類について。これは「カラム」や「段組み」と言ったような言葉を指します。ブログを構築する前、ユーザーにとって見やすいレイアウトにする為に、大まかでも良いので配置を決めておきましょう。
またレイアウトとは「情報を視覚化する作業」とも言います。具体的には、ブログ上に掲載する「写真」「画像」「文字」など、様々な構成要素に視覚的表現を取り入れることを言います。視覚的表現を取り入れるとはどう言うことか。
ただ単に並べただけでは伝えきれないブログ内に含まれる多くの「情報」や「目的」を素早く、且つ、的確にユーザーへ伝えることができます。ブログは主に、5つの領域から構成されていることを覚えておきましょう。
|
ではここで動画を視聴してみて下さい。題して「【レイアウト・装飾で差をつける】見やすいブログ記事の作り方・書き方」です。
基本のレイアウトパターン(動画付き)
ブログの基本形である代表的なレイアウトパターンをいくつか紹介していきます。一応言っておきますが、ブログでなくてもWebサイトでも同じことが言えます。そこのところを勘違いされないようにしましょう。
基本のレイアウトパターンが分かれば、後は「ブログの目的」に沿って、適切なレイアウトを選ぶだけ。初心者であっても、簡単にレイアウトを決めることができます。但し、注意点が一つあります。それは。
| どのレイアウトを選んで良いのかは、作成するブログの用途によって変わるので、一概に「これが良い」と言うものはありません。 |
ではここで動画を視聴してみて下さい。題して「記事/カラム/WordPress！画像や文字を横並びにしたい！」です。
1カラム
「1カラム」とは、サイドバーが一切ないレイアウトを言います。サイドバーとは、ブログの右側もしくは左側に対し、常に表示される縦型のことを指します。特にスマートフォンでは「1カラム」を使って制作しているブログがほとんどです。
| 1カラムのメリット・デメリット |
|
|
サイドバーがないと言うことは、見た目がスッキリ、且つ、インパクトがあり、訴求力が最も高いレイアウトと言えます。その為、特定の商品やサービスを紹介したい時に「1カラム」は、威力を発揮します。
また余計なコンテンツを排除していることから、中身をじっくり読んで貰えるメリットもあります。それ以外にも、パソコンとスマートフォンでの見た目が変わらず情報も整理して表示されるので、利用しやすいことも挙げられます。 |
|
余計な情報を省いている為、ブログ全体の回遊率が低下し、直帰率が高まります。その為、ブログ内を隅々まで見て貰いたい時など「1カラム」は、向かないレイアウトと言えます。
またスマートフォンで「1カラム」表示にした場合、画面下までスクロールする時間が長くなります。その為、情報量が極端に多くなり、ユーザーの離脱に繋がる恐れがあります。 |
2カラム
「2カラム」とは「メインコンテンツ」と「サイドバー」で構成されるレイアウトを指します。サイドバーには「カテゴリー」「カレンダー」「広告」「コメント覧」など、表示させることができます。
| 2カラムのメリット・デメリット | |
|
メインコンテンツに加え、他の情報も一緒に掲載することが可能となり、回遊率の向上が期待できます。他のサービスが目につきやすいレイアウトの為、ネットショップなど、少しでも多くの商品を見て貰うのには最適と言えます。
サイドバーは、メインコンテンツと一緒にスクロールされる訳ですが、一部の情報を常に固定してスクロールさせないことも出来る為、強くアピールしたい情報など、サイドバーに掲載することでクリック率を高めることもできます。 |
|
最近のブログは、優秀なテーマが増えている為、レスポンシブデザインを採用することが非常に多くなり、パソコンでは「2カラム」で表示されていても、スマートフォンで見た場合「2カラム」にならないところが残念。
一応、スマートフォンに於いても、無理やり「2カラム」表示にすることも可能ではありますが、文字が小さくなる上、視認性も悪くなり、離脱率の増加を招き兼ねません。 |
3カラム
「3カラム」は、両サイドにサイドバーを配置することができるレイアウトです。「3カラム」に関して、コンテンツ領域は狭くなりますが、一度に豊富な情報量を見せることが可能となり、ユーザーを惹きつけておくにはもってこいです。
| 3カラムのメリット・デメリット | |
|
「3カラム」は、一度に多くの情報を表示させることができます。関連商品を掲載したり、広告を上手く配置することでクリック率を高め、ブログ全体の回遊率向上も期待できると言えます。
どこにどのような情報を配置し、素材を使うかなど、デザイン的要素が大きくなるレイアウトの為、ブログ制作に於いて「3カラム」を採用する場合、配置のバランスを考えることで、見た目の印象が大きく変わります。 |
|
見た目の煩雑さが目立ち、人によっては、そこでページを離脱してしまうことが考えられます。ユーザーにとって、本当に欲しい情報がどこにあるのか分かりずらくなるだけではなく、情報過多に陥りやすいと言えます。
またメインコンテンツ以外に注意が向けられる為、滞在時間が短くなることも予想されます。レイアウトをしっかり考えておかないと情報の羅列で終わってしまう可能性が高くなるので気を付けましょう。 |
| 薬機法と景表法でこんなの欲しかったを提供開始！「薬機法かけこみ寺」。 |
グリッド型レイアウト
「グリッド型レイアウト」は「1カラム」「2カラム」「3カラム」でもないブログのデザイン手法の一つで、画面やページを縦横に分断する直線で格子状に分割し、これを組み合わせ、ブロック内要素の大きさや配置を決定していく方法です。
| グリッド型レイアウトのメリット・デメリット | |
|
「グリッド型レイアウト」は、ユーザーに沢山の情報を一度に見せられることです。これは「3カラム」と似ているかも知れません。情報量が多いブログでも「グリッド型レイアウト」で綺麗に整列されています。
またブログ上の統一性に関しては、十分保たれていると言っても過言ではないでしょう。仮にコンテンツの追加や変更が生じたとしても、配置を気にすることなくブログの更新が可能です。 |
|
「グリッド型レイアウト」は、ブログ上の統一感や情報量の多さから、コンテンツにおける重要度の見極めが非常に難しく、ユーザーがどのコンテンツから閲覧すれば良いか迷う可能性が挙げられます。
各コンテンツごとに重要度の差を表現するのであれば、サイズや背景のカラーを変えて強調する部分を作ると良いかも知れません。是非チャレンジしてみてはいかがでしょうか。 |
フルスクリーン型レイアウト
「フルスクリーン型レイアウト」は、イメージ写真や動画をブラウザの幅いっぱいに映し出したデザインのレイアウトです。写真のギャラリーサイトやブランドイメージを前面に出したいプロダクトの紹介ページに使われるケースが多いです。
| フルスクリーン型レイアウトのメリット・デメリット | |
|
全画面をナビゲーションエリアとして使用するので、スプリットレイアウトを取り入れたり、背景画像を使用したちょっとリッチなナビゲーションを作ることが可能となります。
元々、スマートフォンでは、表示領域が狭い為、フルスクリーンナビゲーションがほとんどです。そのことから、スマートフォンで主流のフルスクリーンナビゲーションをパソコンでも採用するようになった訳です。 |
|
「フルスクリーン型レイアウト」に限ったことではありませんが、クリックするまで、中身が見えないのは、ユーザビリティとしてはデメリットだと言う考え方があるようです。
フルスクリーンナビゲーションを開くボタンのほとんどがハンバーガーメニューを使用しています。なぜハンバーガーメニューなのかは分かりませんが。そうなるとユーザーがブログを回遊することなく離れてしまうことは間違いないでしょう。 |
今回は、ここまでといたします。ユーザーを意識したレイアウトとは！については理解して頂けたでしょうか？それほど難しいことは書いてないので理解できるかと思います。何でもそうですが、少しずつでも覚えていきましょう。
