記事系コンテンツのデザイン

記事系コンテンツの主役は文章ですが、イラストやデザインも重要です。しっかりと時間をかけて書いた文章を、読みやすくするのがデザインの力です。なぜなら、多くの読者はスキップリーディングをしており、最初から記事を読むことがないからです。

記事を読ませるためのデザインやイラストのアイデアを紹介します。

記事系コンテンツのデザインとは？

記事系コンテンツは、サイトを訪れるユーザーに記事を読んでもらうコンテンツです。しかし、文章をしっかりと読もうとするユーザーは非常に少ないです。大半の読者がスキップリーディング（飛ばし読み）しかしてくれません。

このため、少しでも記事が読まれる確率を上げるためにデザインの力を借ります。具体的には、アイキャッチ画像や挿入イラスト、文字の装飾、レスポンシブ対応などです。

決して高度なデザインが必要ではありません。しかし、読者が興味を持ち、文章を読みたくなるようなビジュアルを整えなければなりません。文章とデザインが合わさったとき、記事系コンテンツは完成します。

読みたくなるデザインのアイデア

では、具体的にユーザーが読みたくなるデザインのアイデアをご紹介します。記事系コンテンツでデザインをするべき箇所には、次のようなものがあります。

• アイキャッチ画像
• 挿入イラスト
• 文字の装飾
• 見出し

それぞれのデザインが必要な箇所について、詳しく解説していきます。

アイキャッチ画像

アイキャッチ画像は、本の表紙のような役割です。記事への興味を抱かせることが目的です。YouTube動画ではサムネイル画像と呼ばれ、期待する効果は同じです。

例えば、SEOポータルが運営する「太子タウン」では、このようなアイキャッチ画像を設定しています。記事の内容をイメージさせ、本文への興味をひきつけます。

このようなアイキャッチ画像を作成する時には、次のことに配慮してください。

• 記事のタイトルのテキストを含むこと
• 記事の内容やテンションに合った色合い
• キーワードに関連する写真やイラスト

Googleの検索クローラーは随分と昔から、画像内に含まれる文字が読めます。このため、アイキャッチ画像にはテキストを含めて、記事との関連性を示すことが重要です。また、本文とのテンションに合った色合いや、キーワードに関連する写真やイラストを入れます。

記事ごとにアイキャッチ画像を作成しますが、サイト全体でイメージを統一してください。

挿入イラスト

挿入イラストがあることで記事にアクセントが生まれ、読みやすさが増します。文章よりもマンガの方が読みやすいと感じる人が大半でしょう。文章中にイラストがあることで、スキップリーディングの手が止まります。

具体的には、次のような挿入イラストを使用します。当サイトで使用しているもので、読者の理解を深めるためにイラストを作成しています。

挿入イラストは、文章では伝わりづらい内容の理解を促進するものです。次のような点で工夫をすると、デザインの効果が増します。

• テキストは最小限にする
• 本文の内容のサポートに徹する
• 親近感のあるイラストを使用する

文章で理解しづらい内容を挿入イラストで示すため、あくまでイラストがメインです。つまり、挿入イラストにごちゃごちゃと文章を書くことは逆効果になります。また、読者の身近にあるものや親近感を感じるイラストを使用することが好ましいです。なぜなら、想像を膨らませやすいからです。

挿入イラストについても、サイト全体でイメージを統一するようにしましょう。

文章の装飾

文章の装飾は、ライターが担当することが多いものの、デザインに含まれる作業です。一般的には太字とマーカー、文字の色しか設定項目がありません。つまり、数少ない選択肢を上手く活用して、読みやすい装飾を行います。

今、皆さんが読んでいる記事では、太字と黄色マーカーのみで文字の装飾をしています。例えば、次のような点に注意しながら装飾を行っています。

• 太字やマーカーは15文字以内
• 見出しごとにマーカーは2ヶ所まで
• マーカーだけを追う読者を想定

学生の頃に教科書に線を引いていたイメージで装飾しています。つまり、重要な箇所には黄色マーカーを引いて、それを補助する箇所に太字です。これによって、マーカーの引かれた箇所だけを目で追う読者にも内容が分かる工夫をしています。

あまりにも多くの文字を装飾するのは逆効果です。ですから、見出しごとに重要な箇所を厳選して、装飾を行うようにしてください。文章の一文を丸ごと太字にしたり、マーカーを引くと読みづらいです。

見出し

見出しのカラー設定は、サイト全体で統一したものです。記事系コンテンツの読みやすさに強く影響しますので、適切なカラー設定をしましょう。

SEOポータルでは、中見出し（H2）を「青背景の白文字」、小見出し（H3）を「グレー背景の黒文字」にしています。これは、中見出しだけを上から下まで読み飛ばす読者への対応です。

一般的には、中見出しは目立つ色合い、小見出しは落ち着いた色合いを選ぶのが良いでしょう。

なお、見出しのつけ方の工夫はライターの仕事です。全体のバランスや構成を考えながら、読みやすい見出しを作成してください。

記事系コンテンツのデザインまとめ

SEOポータルでは記事系コンテンツの執筆代行サービスを行うなかで、アイキャッチ画像や挿入イラストの作成も対応しています。いかに読みやすさを向上させるか、常に改善を行っています。

特に、最近ではスマホによる閲覧の割合が大きくなっています。このため、小さなスマホの画面でも読みやすいように、記事の見た目を工夫しています。

社内リソースで記事系コンテンツを制作することは、不可能に近いです。さらに、業務の合間に記事の執筆をすることで、本業に支障がでる可能性があります。限られた時間内で、デザイン面まで配慮することは難しいでしょう。

ウェブサイトへの訪問者を増やすためにコンテンツSEOに取り組まれる企業様は是非、記事執筆代行サービスをご活用ください。

最後まで読んでいただいて、ありがとうございました。