人は文章を見る時にどんな目の動きをするのか考える
皆さん、文章を読むとき、どのような目の動きをされますか。
例えば小説。
当然、右から左に視線を移していきますよね。
では、新聞はどうでしょう。
まず、大きく目立つ見出しが目に入り、その見出しから気になった記事を読み進めていきます。
新聞は縦書きですので、この場合も当然、右から左に読み進めていきます。
ではここで、ちょっくら新聞に目を通してみましょう。
全部読まなくても構いません。
「川本特命相が辞表」という見出しだけを見つけて、
見つけたらすぐに目を離してください。
クリックで拡大します。
見つけられましたか?
では、今見た新聞で、「川本特命相が辞表」以外に印象に残っているところはどこでしたでしょうか。
▶
目次にもどる
見えていないスペース
さきほどの質問で恐らく印象に残っている部分として殆どの方が答えられるであろう箇所は、
この辺りではないでしょうか。
特に「商工中金」の部分は印象に残っているはず。
おや?
丸で囲んだあたりはぽっかりと空白になってしまっていますね。
どうしてこんなことが起きてしまうのでしょう。
▶
目次にもどる
情報媒体の性質を考える
新聞というのは、右上から左下に向かって読んでいくものですよね。
それは暗黙の了解といいますか、長年の経験則から言われずとも皆さん無意識に理解しているものかと思います。
この度、私は
「川本特命相が辞表」という見出しだけを見つけて、と言いました。ですので、よほどひねくれた人出ない限り、大抵の方は
こういった順で目立つ部分を拾っていくのです。
そうすると、必然的に右下が死角になってしまいますよね。
新聞というのはこういう人の目の動きもよく考えていて、人間がどんな視線の動きをしようと、必ず重要なニュースの部分が視界に入るように作られているのです。
この新聞は日航機墜落という、とてもセンセーショナルなニュース。
当時はすごく話題になり、どの新聞もトップニュース扱いでした。その重大なニュースに関して読者が情報の取りこぼしをしないよう、このように視線を考えた記事作りが行われているのです。
では、ブログという媒体の性質を考えてみましょう。
新聞の例とはうってっかわって、ブログの文章は基本的に横書き、左上から右下に向かって読み進めていきます。
しかし同じ左上から右下でも、PC表示とモバイル表示では大きく異なる点があります。
それはモバイル表示が単純に1カラムで構成されているのに対して、PC表示では2カラムか3カラムでの表示が基本となっていること。
PC表示では人の視線の動き方も、少し変わってきます。では、一体どのような構成にするのがいいのでしょうか。
▶
目次にもどる
ブログで目につく部分
さて、ブログのPC表示についての構成に行く前に、webページを開いた瞬間、真っ先に目に付くものは何でしょうか。
それは、装飾された文字やスペース、背景や本文などではなく、とにかく
「一番大きい画像」です。
写真でもイラストでも、とにかく「一番大きい画像」というのが最初に目に付くのです。
ここで大手企業のwebサイトを見てみましょう。
このように、新製品、売り出したい製品を、とにかくデカデカと画像を使ってアピールしていることが分かります。
webサイトで人が真っ先に注目するのは、「大きな画像」です。
そして次に、それよりも小さな画像を目で追っていきます。
ブログを見る人間はびっしり書き込まれた文字より何より、とにかく最初に画像を見る。
ですので、画像が一切なく文字ばかりびっしり書き込まれたブログは、それだけで直帰率が上がってしまいます。
もし完全にブログを文字だけで構成されているのでしたら、まずは
記事中のはじめに一枚だけでも関連画像を入れてみてください。
これが後の解説でも重要になってきます。
▶
目次にもどる
PC表示ではかならずサイドメニューを左に
PCでブログを読むとき、人はどのスペースから読んでいくでしょうか。
左から右に、だから左サイドメニュー?
違います。
大体の読者は、自分の求めている情報を得るためにブログへアクセスしてきます。
そしてその情報へすぐにたどり着くために、真っ先にメインコンテンツから見るはずです。
誰もサイドメニューをじっくり読んでから本文を読んだりなんかしません。
ですので、
サイドメニューに重要な情報を置いている場合は、メイン部分に移したほうがいいに決まっています。
しかし、左サイドメニューというのは馬鹿にできないのです。
それは、最初に取り上げた「視線の動き」。
ブログは左から右に向かって読んでいくものですので、
右よりも左の方が目に付く回数が圧倒的に多いのです。
特に改行を多用されている方や、短文細切れの文章を書かれている方は、メインコンテンツの右側に空白ができがち。
空白があるということは、メインコンテンツの空白より更に右側にある、
右サイドメニューの情報はほとんど目に入っていないということです。
これを踏まえて、右サイドメニューしか設置していない方は左へ配置を変えるか、あるいは3カラムに変更し、重要な情報は左サイドメニューへもっていくかを検討してみるといいかと思います。
実際に実証されている方もいらっしゃいますので、こちらも参考に。
ブログのメニューを左側にするとPV率が14%増加!StingerのCSSカスタマイズ | SWAT9
▶
目次にもどる
スマホ表示での注意点
さて、PCでの構成はおおよそ把握出来たと思いますが、スマートフォンページではいったいどのような構成を取ればいいのでしょうか。
基本的には上から下へ読み進めていくものですので、できるだけ上に重要な情報を置いておくのがいいのは当然ですが、
アクセスがほしいからといってランキングやアンテナサイトを記事より上に置くことは絶対にしてはいけません。
よく2ちゃんねるのまとめ系ブログではスマホページの上部にアンテナサイトへのリンクを入れていますが、あれは2ちゃんねるのまとめというコンテンツであるからできることです。
2ちゃんねるのまとめブログというコンテンツは、必要な情報を探してアクセスするものではありません。暇な時間に、暇つぶしに読むものです。
ですので普通の情報を発信しているブログよりも滞在時間が長く、また複数の記事を読者が確実に読んでくれるということが前提となっています。
そのためアンテナサイトにアクセスを送ったとしても確実にそれ以上のアクセスが帰ってくることが見込まれているからなのです。
これを真似て普通のブログがアンテナサイトやランキングサイトを記事より上へ置いたらどうなるか、想像に容易いですよね。
同じ情報を発している他のブログへ一度飛ばれてしまうと、その読者は二度と自分のブログへは帰ってきません。
情報を得たらそれで終わりなのですから、当然です。
2ちゃんねるのまとめブログは、 他のブログへ行ったところでどうせ似たような記事がまとめられているのは分かりきっています。言うなれば読者は、暇つぶしさえできればどのブログでもいいのです。
このような大きな違いがあるにも関わらず、「大手だから」「2ちゃんねるまとめはアクセス数がすごいから」といった理由だけでサイト構成を真似てしまうと、せっかくの読者をどんどん他へ逃がしてしまうことになります。
セッションが低い方、ページ滞在時間が短い方は、他サイトへのリンクはできるだけ人目に付かないところへ配置してみてください。
▶
目次にもどる
クリックしてもらいたいリンクはコンテンツの最重要部分付近に
最初に新聞の例で、印象に残った部分はどこかと問いました。
目の動きとは別に、「川本特命相が辞表」の見出し付近にある「商工中金」という広告も印象に残ったのではないかと思います。
人間は、必要な情報付近の情報しか頭に入っていない、ということですが、逆に言うと、必要な情報付近にある情報はなんとなくでも頭に入っているということです。
このなんとなくでも頭に入っている状態というのはかなり重要です。
なんとなくですら頭に入ってこないような場所にあるものより、格段にクリック率が上がります。
ですので、例えばどうしてもクリックしてもらいたい広告であるとか、どうしても見てもらいたい記事であるとかは、極力読者が求める最重要情報付近に配置しておくといいかと思います。
で、このリンクですが、やはりなんとなくでも頭に入れてもらうためには、他の文字列との差別化が必要になってくるのです。先ほどの「商工中金」のように。
ただの文字の羅列ではそこまで注目されません。
実際、新聞の例で挙げた「川本特命相が辞表」付近の文字列、「商工中金」の広告は印象に残っていても、同じような場所にある記事本文はあまり印象に残っていないですよね。
そこで重要なのが、ここでもやっぱり画像。広告にしろ記事へのリンクにしろ、画像を使って最大限にアピールしていくべきです。
画像のある無しでは本当にリンクのクリック率が変わってきます。
関連記事の表示にしても何にしても、アクセスしてもらいたいものにはとにかく画像を。
最近のブログサービスでは、最初の一枚目の画像を記事リストにサムネ表示してくれる機能があるところが多いです。
せっかくサムネ表示できるのに使わないなんてもったいない。
No imageのままにしている方は、フリー素材でもなんでもいいので、是非関連画像を入れることをオススメします。
▶
目次にもどる
関連記事への誘導について
関連記事や他の記事への誘導の方法について、これについては私見ですので賛否あるかと思いますが、できるだけ記事終わりにすべきだと私は考えています。
よく記事上部や記事中に関連記事を配置しているブログを見受けるので、実際滞在時間や直帰率の改善などのために何が正しいのかは分かりません。
しかし読者の立場でそういったブログを見た時、情報が行ったり来たりで面倒くさいと感じたので。
説明などのために関連記事を間に挟むのは問題ないと思います。
しかし、ただ関連しているからというだけで記事上部や記事間に関連記事のリンクを持ってこられると、ついそっちに目が行き、当初の目的であった最初のページの情報を全て把握しないうちに次のページへ行ってしまうことが多々あります。またその次のページで気になる情報が目に付くと更に次のページへ……となり、当初の目的のページへ戻れなくなり、再度検索し直すはめになることも。
再度検索し直すということは、読者を逃してしまう可能性があるということです。
また、記事上部や記事間に気になるリンクがあったとして、とりあえずこのページを全て読んでから改めてそのリンクへ飛ぼう、と思った時、記事下部から再びスクロールして戻らなければなりません。
1記事の情報量が多いと、リンクを探すだけで一苦労です。
これってとても不親切だと思うんですよね。
「別窓で開くようにしてるから別にいいじゃん」
と思う方もいるかもしれませんが、パソコンならまだしもスマホで別窓にされても気付きにくいし、他のタブを開くのがちょっと手間だったりとでやっぱり不親切だと思うんです。
しかも、別窓を開いた後、うっかり本来の目的のページのタブを消してしまったら?
そう考えると、やっぱり関連記事は記事下にもってくるべきだと思います。
読者も一通り記事に目を通してから次へ行ってくれるので、平均滞在時間も上がりますし。
▶
目次にもどる
読者の視線を考えるのではなく、読者の視線を誘導させる
漫画を書くときのテクニックで、「視線誘導」というものがあります。
詳しく解説されているサイトがあるので、漫画についての視線誘導は以下のリンクを読んでみてください。
GANMA!漫画の描き方講座 第6回 -視線誘導- - Web発のスターマンガ家を育成する支援プログラム【Route M】
これ、ブログでも同じことが出来ます。
新聞もそうですよね。重要ニュースに目が行きやすいよう、見出しの位置や大きさ、写真などを使ってうまく視線誘導をしています。
ブログで視線誘導が大事になってくるのは、正直アフィリエイトへの広告リンクへ注目してもらう時くらいだと思いますが(笑)
でも、目立つ画像、大事な記事、読者が気になりそうな記事などを上手く配置することで、ブログの隅々まで閲覧してもらうことが可能です。
記事以外にも、例えば下部のほうや目に付きにくい位置にあるSNSリンクとかを見て欲しいって場合には、視線誘導を考えたコンテンツの配置にするといいかと思います。
▶
目次にもどる
まとめ
今回とっても長い記事になってしまいましたが、要約すると
・文字ばかりにせず、画像を使う
・PC表示は左サイドメニューに重要項目や新着、関連記事などのリンクを
この二つだけでも、かなりページ/セッションが改善され、直帰率が下がるかと思います。
ちなみに当ブログの平均滞在時間は11分8秒、直帰率は46.8%、ページ/セッションは5.46です。
これがいいのか悪いのかはわかりませんが、これだけバラバラなジャンルで書いているにも関わらずページ/セッションが5.46あるのはまずまずなのではないかな、と思います。
最後になりましたが、古い記事のアクセス数も維持させたいって方向けにランダム記事表示の方法についてまとめています。ご参考までにどうぞ。
JUGEMスマホテンプレート徹底カスタマイズ講座その6〜JUGEMに実装されていないシステムを外部サービス等を利用することによって可能にする方法2〜
シェアする
こちらの記事も読まれています。