はてなブログに見る「クリックされやすいブログカード」の考察

以前から、はてなブログのブログカードが、とても見やすく綺麗で「クリックしたくなる」と感じていましたので、私が利用しているWordPressテーマのブログカードをサンプルとして、「クリックしたくなるブログカードデザイン」を考察しました。

ブログカードサンプル

私が使ってるWordPressテーマ「ルクセリタス」で選べるブログカードの種類は次のようなものです。

厳密には画像に枠線をつける/つけない、ブログカード・画像の角の丸みを調整できますが、それほど大きな違いはないと判断したため、省略しました。また後ほど紹介するはてなブログのブログカードでは画像に枠線がついていないため「画像に枠線はつけない方がいいのでは？」と現時点では推測しています。

そして、私が「最も自然にクリックしてしまう」と感じるのが、はてなブログのブログカードです。

それが次になります。

ブログカードに影がなく、画像は右に配置。ブログカードの枠線はうっすらと丸みを帯びていて、記事タイトル下に本文冒頭が表示されています。そして左下にはブログトップページの URL が表示されています。

おそらく私がはてなブログのブログカードを最もクリックしたいと感じるのは、次の2点が原因だと思います。

それぞれの理由を私なりに考察してみます。

この2つを、自分の深層心理や、物事を見た時に起こる自動的な脳の反応・解釈を、じっくり観察しながら何度も見比べると。

影があるブログカードでは「それがリンクである」と脳が理解するのに若干のタイムラグがあることがわかりました。

このため影がないブログカードの方が、脳は自然にそれが「リンクである」と（早く）理解できるため、クリックしやすいのではないかと思います。

次のように画像が左に配置されていると、

ブログカードを一瞬見たときにまず画像が目に入ります。その次に視線を右に移動して記事タイトルを見る。という視線の流れがあります。

これは脳が「その記事が自分にとって有益が？」を判断するために、視線移動分の時間がかかることを意味します。

画像を見ただけで直感的に「それが自分にとって有益だ」と判断できる場合は別ですが、多くの場合ブログカードに配置される画像は、アイキャッチ画像を「切り取ったもの」になるはずです。

これだと脳が直感的に一瞬で「それは自分にとって有益だ」と感じるのは難しいはずです。

そう考えると、 WordPress に標準で装備されているかなり大きなブログカードは、アイキャッチ画像を切り取ることなく表示されるので、大きさを考えなければ、読者に直感的にブログカードの有益性を伝えるには、有利だと考えられます。

その点、次のように画像を右に配置すれば、

まず目に付くのは記事タイトルでそれを読む・あるいは感じ取ってから、アイキャッチ画像を切り取ったものが目に付きます。

この方が視線の移動と脳の解釈が、スムーズに行くのではないかと私は感じます。

多くの場合アイキャッチ画像が語るのは、その記事の雰囲気や印象だけです。その記事の内容を端的にそしてストレートに分かりやすく表現しているのは記事タイトルです。

だからこそ記事タイトルを一番最初に目に付く場所に配置し、読者がそれを読んで理解できるようにする方が、良いのではないか。

その方が、そのリンク先の内容を早く理解できるため、「リンク先の記事内容を理解して読みたいと思ってブログカードをクリックする」という動きを読者がしやすいのではないかと感じます。

まとめると、私が感じた「クリックされやすいブログカード」は、次の2点を満たしているものだと、現時点では考えています。

現在の主流のブログカードは、バナーのように長方形の形をしています。このタイプのブログカードなら、上記の2点を満たしたものが一番クリックされやすいのではないかと、私は感じています。

このような現在の主流の「かっこいいブログカードデザイン」をお“除けば” WordPress 2デフォルトで装備されている「デカめのブログカード」いいのではないかと感じます。