エキスパートコラム
みんビズ運用講座：ブログをつかって情報発信（全6回）
第3回：記事にインパクトを与えるポイントと、テキスト装飾で気をつけたい3つのこと
執筆：赤間 公太郎（株式会社マジカルリミックス）
2013年8月7日更新
閲覧数5,689views
「みんビズ運用講座：ブログをつかって情報発信（全6回）」担当、マジカルリミックスの赤間です。
「第2回：ブログに書く内容 テキスト編」では記事の組み立て方や、ブログを書く上で気をつけたいことなどを解説しました。ぜひ今回のコラムと併せてチェックしてみてくださいね。
さて、第3回目のテーマは「記事にインパクトを与えるポイントと、テキスト装飾で気をつけたい3つのこと」です。写真の効果的な扱い方や装飾のポイントを解説します。
ブログの本質の再確認
ブログの基本は「テキスト」です。もちろん、華やかにするためのデザインや装飾などは、閲覧者の満足度を向上させるのに必要なことです。しかしながら、よいブログというのは「文章」だけでも人気があるものです。これは見た目はさることながら、内容がしっかりしていることによるものです。
ブログのテーマにもよりますが、写真や装飾はあくまで本文を引き立たせるものです。前提には「しっかりしたテキストが必要」ということを念頭に置きましょう。
記事冒頭にアイキャッチ画像を挿入してみよう
ブログの記事を読む際に、まず目にするのは記事の上部です。見出しや本文などの明確な装飾も大事ですが、ここで「アイキャッチ画像」や「キービジュアル」と呼ばれる写真を挿入してみましょう。
アイキャッチ画像がなし・ありのものを見比べてみましょう。
アイキャッチ画像なし
テキストが主体の場合、メリハリは見出しを使って行う
アイキャッチ画像あり
関連する写真をアイキャッチとして挿入した
いかがでしょうか？アイキャッチ画像を使った場合、その記事の冒頭にインパクトが生まれます。伝えたいことを文字で書くのも大事ですが、視覚にも訴える「パッと見」も、つかみとしてとても大事なものです。
写真やイラストをチョイスするポイント
アイキャッチ画像に使用する写真やイラストは、好みのものをチョイスするというよりも、その記事に関連するようなものを選びましょう。
例えば、このbizYouエキスパートコラムでも、各エキスパートの人の記事の冒頭にアイキャッチ画像が使われています。
「第1回：ブログを書く理由」では、「書く」というキーワードから万年筆の写真をチョイスしています。記事の内容的には、万年筆は直接関係ありませんが、言葉の意味や全体の雰囲気から、なんとなくイメージが合致しています。
ブログを書く、というテーマに沿って、書くための万年筆をチョイス
「第1回：素材を使うその前に～仕様上の注意とルール～」では、「素材」というキーワードをもとに、もの作りや加工のための工具の写真をチョイスしています。
素材、というテーマに沿って、加工に必要な工具をチョイス
このように、キーワードから関連するような写真を差し込むだけで、目を引くようなインパクトを与えることができます。
アイキャッチ画像を使う際に注意したいこと
使用する写真は面積が大きければ、それだけインパクトも大きくなります。しかし、写真を大きく扱う際の注意として、画像が大きい分記事本文が下にずれていってしまいます。画面の大きなコンピューターにおいては特に気にならないかもしれませんが、ユーザーによっては小さめのノートパソコンだったり、タブレット端末など画面のサイズはさまざまです。
このような理由により、上記で紹介したような横長の画像がオススメです。インパクトこそ欠けますが、記事本文にたどり着きやすくなります。しかし、アフィリエイトなどの広告バナーも横長タイプが多く、広告と間違われないように注意しましょう。
また、アイキャッチのバリエーションとして、正方形の画像を利用する例もあります。
記事のタイトルを列挙するよりも、中身が連想できるアイキャッチが望ましい
写真素材の調達
使用する写真は、人物・コンピューター・CG・自然イラストなど、記事の内容に応じて適切なものを選びます。その際、無料で提供しているWebサイトを利用すると効率的です。
ただし、無料といっても使用に関するルールが設けられている場合があります。「みんビズ制作講座 上手に素材を使いこなそう : 第1回 素材を使うその前に～使用上の注意とルール～」を参考に、素材利用時の注意点などを事前に把握しておきましょう。
ひと手間かけて、インパクトを出そう！
テキストの装飾時に気をつけたいたった3つのこと
テキストを装飾する際に、特に気をつけたいことは「1.色を使いすぎない」「2.アンダーラインを多用しない」「3.リンク色との区別を意識する」の3つです。
Jimdoやみんビズをはじめ、多くのブログシステムの場合、「WYSIWYG（ウィジウィグ）」と呼ばれる、WordやExcelを操作する感覚で装飾できる入力ツールを使います。手軽がゆえに、過度な装飾を施しがちなので注意しましょう。
1.色を使いすぎない
語句を強調する場合は、太字やイタリックを使いましょう。いっけん地味ですが、ひと続きのテキストの中でも少なからず見た目が変化するので、実は効果的です。青や赤など、色数を多く使うと、まとまりのない見た目になってしまいます。もちろん、トーンを揃えるなどで見た目を良くすることもできますが、特別な理由が無い限り色数は極力抑え、あえて着色はしない、などの選択も検討しましょう。
2.アンダーラインを多用しない・リンク色との区別を意識する
HTMLでは、テキストに対してアンダーラインを引くことができます。しかし、このアンダーライン、インターネット上においては「リンク」の意味合いを強く含みます。アンダーラインの引かれた語句を見た場合、無意識にそこにリンクが張られている、と認識してしまうケースが多いのです。これはユーザーにとって好ましいことではなく、むしろわかりにくくしてしまう要因です。
明確にリンクと区別ができないようであれば、アンダーラインの使用は避けた方が無難です。
ブログに付属するエディタの例。アンダーラインや青文字はリンクと誤認してしまう
3.リンク色との区別を意識する
アンダーラインと同様の理由で、「青文字」もリンクと勘違いしてしまうケースがあります。ユーザーにストレスなくブログを見てもらうためにも、これらの3つの装飾には特に気を遣いましょう。
次回は「ページビューを意識したブログのチューニング」をお送りします。
まとめ
- 記事の冒頭に「アイキャッチ画像」を入れてみよう
- 写真は横長で使用すると、下に続く本文が近く、バランスもよい
- 記事の内容からキーワードを抽出し、そのイメージから写真をチョイスする
- テキストの装飾はほどほどに抑え、特にリンクとの差を意識する
赤間 公太郎（あかま・こうたろう）
株式会社マジカルリミックス 代表取締役CEO／JimdoExpert
http://www.magical-remix.co.jp/
http://www.kotalog.net/
宮城県出身。IT関連の専門学校を卒業後、仙台のデザイン会社に入社。Webサイトのデザイン・コーディングを中心に従事。2002年退職後すぐに個人事業としてマジカルリミックスを創業。2007年に法人化し株式会社マジカルリミックスを設立。規模を問わずお客様のニーズにあわせたWebサイトの企画立案、制作、アクセスと売上アップをめざした更新サポートまで一貫して手がけている。
また、Web制作だけにとどまらず、社内向けのセキュリティ・IT活用のプライベートトレーニング、セミナー出演、執筆なども意欲的に手がける。全国からの講演依頼も多数。2005年から仙台の専門学校で、非常勤講師としてWeb制作講義を担当。
主な著書に『10日でSEO&アクセスアップ Jimdoデザインブック』（エムディエヌコーポレーション）『10日で作るかっこいいホームページ Jimdoデザインブック』（同）『HTML5+CSS3の新しい教科書 基礎から覚える、深く理解できる。』（共著、同）『基礎から覚える、深く理解できる。Webデザインの新しい教科書』（同）。
［所属］
仙台商工会議所 エキスパートバンク登録／みやぎ産業振興機構 専門家アドバイザー／みやぎ工業会正会員
10日で作るかっこいいホームページ Jimdoデザインブック 改訂新版
「Jimdo」（ジンドゥー）でのホームページの作成方法と運用方法を解説した書籍。
『10日で作るかっこいいホームページ Jimdoデザインブック』（2014年10月発売）の改訂版となり、2016年11月に改変されたJimdoの新・管理メニューに全面対応した内容です。
解説記事を順番に読み進めて行くことで、Jimdoを使ったホームページの作成・運用・宣伝・集客の基本を、10日間で習得するのが本書のコンセプトです。12章構成の解説の中で、Jimdoの基本操作とホームページの作成、デザインとコンテンツ（内容）のレベルアップ、そしてSEOやリスティング広告を含む宣伝・集客の基本を解説しています。
![[はじめてＷＥＢ・Jimdo公認] はじめてのホームページらくらく作成ガイド <改訂版>](/images/img_book1.jpg)
