読者です 読者をやめる 読者になる 読者になる

元コンサルタントな歴史家―ドイツから見た日本

ドイツの大学で歴史を研究する伊藤智央のブログ。ドイツと日本に関する批判的な評論を中心に海外生活(留学や移住)の実態をお伝えしています。その際には元戦略コンサルタントとしての経験も踏まえてわかり易くお伝えできればと思います

【定量測定】スマホ版固定メニューのクリック率改善法とその限界

スマホユーザーは一般的に、なかなか次の記事を見てくれません。その理由は

  • ユーザーがあまり時間が割けないから
  • PCやタブレットに比べ画面が小さいため、どこにどのような記事があるのかわかりにくいから

ということが考えられます。

ユーザーが急いでいて、時間がないという場合はどうしようもありませんが、「画面が小さくて、どこにどんな記事があるのかわかりずらいから、面倒で離脱してしまう」のは機会損失でしょう。私も実際、スマホでWebサイトを見ていて、他に何か面白い記事がないのかと思って一寸探そうとしてみても、どうやって探せばいいのかすぐにはわからず、もう面倒だからと離脱することも少なくありません。

そのため、できるだけユーザーが次の記事を見つけやすいデザインにすることは、

  • ページ/セッション数
  • 滞在時間

を上げる上で、重要なのではないでしょうか。

ではどのようなデザインであれば、次の記事を見てもらいやすくなるのか、実際にリンクにタグを埋め込んで実験してみました。サイト・デザインの参考にしてみて下さい。

スマホ画面下のメニューバーとは

スマホ画面の下に固定バーを設置表示させて、それをクリックすれば、

  • アクセス順上位記事
  • はてブ順上位記事
  • カテゴリ別

が表示されるというカスタマイズを使っている人は少なくないと思います。私も「はてなブログスマホ画面にホーム・人気記事・カテゴリ・トップへ戻るの複合メニューバーをつけるカスタム - Yukihy Life」を参考にこうした固定バーを設置していました。

デフォルトの固定メニュー

しかし、ユーザー視点から改めて見てみると、本当にこのリンクは使われているのか疑問が生じてきました。

実際にタグを入れて計測していたわけではないのですが、例えば右から二つ目の「カテゴリ」をタップすると、カテゴリ一覧が出てくるのですが、そこを経由するカテゴリ一覧ページがあまり閲覧されていないことに気が付きました。Google Analyticsからの簡単な測定でしたが、そのことから、ナビの「カテゴリ」はあまり使われていないという印象を受けていました。

実際に、このタイプのグローバルナビの利用状況を計測して分析した方がいます。この方によると、スマホ経由の総PVに対して、グローバルナビのリンク・クリックが占める割合は約0,08%だったそうです。

たったの約0,08%・・・

メニューバーは画面下に固定させてかなり目立つ位置にあるのを考えるとちょっと少なすぎると思いませんか?

ただ、このグローバルナビの利用、つまり上のスクリーンショットの右側のように、ナビの一部をタップして、おススメの記事一覧を表示させた回数はスマホ経由総PVに対して1,5%となっています。

そうしたことから、この方は

  • 「スマホ画面下固定」の効果は1タップまで
  • 出す記事やタイトルは興味をそそるものでないと意味なし

(中略)

スマホ画面下はいわゆるゴールデンスペースです。最もタップしやすく、だからこそそこにあるメニューは利用率も高い。

しかしそれにあぐらをかいて「入れただけ」状態で放置すると、記事一覧やカテゴリなどは全くタップされないことがわかりました。

参照&引用元:スマホサイトのグローバルメニュー(画面下固定)の利用率を定量測定した結果 - NaeNote

という結論に至っています。

アクセス順・はてブ順の記事一覧が魅力的ではない理由

私も、ただ「入れただけ」状態では効果が出ないと直感的に考えています。

というのも、もともとのカスタマイズでは

  • アクセス順上位記事
  • はてブ順上位記事

のみを表示させていたので、そこで表示される記事は自動的に選ばれていました。

雑記ブログの場合、アクセス順やはてぶ順で表示される記事一覧には、さまざまなカテゴリの記事がごちゃ混ぜで出てきます。たいていのユーザーにとっては、興味のないカテゴリの記事の中から自分に興味のあるカテゴリの記事を選び分ける必要があります。*1

ユーザーにとってこの作業は面倒でしょう。なぜ、サイト運営者の側で前もっておススメの記事をカテゴリ別に整理して出してくれないのかと。

2つのカスタマイズ

そこで、2つのカスタマイズを考えてみました。中身は同じなのですが、使い勝手や設置位置を少し変えています。

解決法①:固定メニュー・バージョン

1つ目の方法は、画面下の固定メニューで全カテゴリーを一つ一つ表示させるようにして、それぞれをタップするとそのカテゴリ内でのおすすめ記事が一覧で表示させるという方法です。

言葉で説明するよりも実際にイメ―ジを見ていたいた方がわかり易いと思います。以下のようになります。

アレンジした固定メニュー

左に設置した「Topへ戻る」以外のボタンは「カテゴリ」に置き換えました。*2

このスクリーンショットにあるように4つのカテゴリのどれかをタップすれば、それぞれの

  • カテゴリ内の厳選記事
  • カテゴリ内の一覧へのリンク

が飛び出てきます。

解決法②:関連記事下バージョン

ただ、私自身、スマホで画面上や下に追跡型のバーが入ると、警戒してあまり使いません。見知らぬサイトが提供しているこうした機能を使うことになぜか抵抗を感じます。そのため、使い慣れたブラウザの機能しか使いません

加えて、リンクをクリックするには、まず固定メニューの一部をタップして、リンクをクリックする必要があります。つまり、2回操作が必要になるということです。1回ならまだしも、2回の作業は面倒と感じさせるかもしれないという可能性もあります。

そういう自分の感覚からも推測して、そもそもスマホの画面下に固定ナビを入れるということ自体に問題がある可能性もあると考えたため、全く同じデザインの厳選記事とカテゴリ・リンクを記事下に入れて、画面下の固定バーと比較してみることにしました。

設置場所は以下の通りになります。

  • 記事本文
  • 手動挿入の関連記事
  • シェア、フォローボタン
  • 自動挿入の関連記事
  • カテゴリ別厳選記事(←挿入場所はココ)

関連記事下にHTMLで挿入した厳選記事のイメージは以下のようになります。記事下へカテゴリ別厳選記事を挿入

こちらは、タップして開くタイプではなく、単にスクロールするだけで各カテゴリ内の厳選記事を一覧できることになります。ブログ自体にどんな記事があるのかを確認するのにクリックが必要なく、カテゴリ別の記事を簡単に一覧できるため視認性も高いと思います。

カスタマイズの意図

固定メニューも記事下のカスタマイズも、一見さん、特に検索流入のユーザーをファンに変えていきたいという意図をもって行いました。

つまり、一見さんが

  1. ある記事を読む
  2. 同じカテゴリの関連記事を読む
  3. 読んだ記事とは別のカテゴリの記事、つまりブログ自体に興味を持つ
  4. 運営者に興味を持つ

という読者獲得戦略の流れの内、「3. ブログ自体に興味を持つ」という段階を促進することを目的にしています。

各カテゴリの内容を代表的な記事を出すことで、一目で「どんなカテゴリがあって、どんな内容のことを書いてるのだろうか?」という疑問に答えることができます。

詳しくは以下の記事で書いております。

この「3. ブログ全体の記事に興味を持つ」という段階において、デザイン設計をうまく行うことで「ユーザーに次の記事を探させない」という状態を作り出せるのではないかと考えています。

カテゴリ名を表示させているだけだと、実際にどんな内容のことが書いてあるのかわかりにくいと思います。タップしたり、スクロールするだけで、具体的なタイトル名とサムネイルが目に飛び込んでくるようにデザインを設計すると、カテゴリの内容がより直接伝わります。

計測結果の発表

このようにして設定したリンクにはすべてタブを埋め込んで、そのクリック数を計測してみました。その結果が以下のものです。

測定期間:2017/1/9~1/21

*以下の計測結果は概数にして表示しています

結果①:固定メニュー Vs. 記事下

まず、全PV数(スマホに限る)のうち、どれだけのPVが固定バーや関連記事下バージョンから発生しているのかを見てみると、それぞれ

  • 固定メニュー:0,13%
  • 記事下:0,4%

となっています。

示唆①固定メニューはカスタマイズが必要

「アクセス順」、「はてブ順」で記事をポップアップで表示させていたオリジナルバージョン(0,08%)よりも、固定バーのクリック率が1,5倍ほどになっています。*3

やはり、固定メニューは内容をカスタマイズしないといけないようです。

示唆②固定メニューという表示形式自体に問題がある

記事下のクリック率は固定メニューに比べて3倍近くも高くなっています。

加えて、固定メニューはカスタマイズしても1,5倍程度にしかなっていません。

これらの2つの事実から、固定メニューという表示形式自体の問題でもあるのかと思います。

タップしてクリックするという操作がスクロールするよりも面倒という仮説をもっていたのですが、その通りになりました。固定メニューは自己満足のためでしかないということです。

結果②:流入経路別の利用状況

次に流入経路別に、このカスタマイズしたリンクの利用状況を見てみました。

  • Direct(参照元なし)
  • Social(SNSから)
  • Organic Search(検索サイトから)
  • Referral(ニュースサイトや他サイトのリンクから)

測定結果

-
Direct
Social
Organic Search
Referral

Clicks (%) =
"Global Navigation" / Sessions

1,0% 1,3% 0,02% 0,9%

Clicks (%) =
"Below" / Sessions

1,1% 2,1% 0,2% 3,9%

Total =
Global Navigation + Below

2,1% 3,4% 0,22% 4,8%

測定数値は、流入経路別に見た割合です。

例えば、表左上の数字1,0%は直接流入によるセッション数の内、固定ナビを通した発生したクリック数の割合を示しています。縦割で数字を捉えてください。

示唆:検索流入ユーザーはやっぱり獲得が難しい

測定データを見てみると、リンクを使った割合は検索流入において最も低くなっています。(0,22%)

検索ユーザーは興味がそもそも始めから特定の記事にしか向かっていないため、「次の記事も読みたい!」という気持ちにはなかなかならないのでしょうか。そうした意志が始めから存在しない場合、検索ユーザーを振り向かせるのはやはり難しく、ウルトラC級の記事で魅せるしかないということです。

当たり前のことですが、「質の高い」記事をこつこつと作ることが大切ということです。

それに比べて、ReferralやSocialからのユーザーのクリック率が高くなっています。

これは、言及からの流入は、「言及してくれている」ということ自体が品質の一定の担保になっているために、ブログに滞在してくれる傾向が強いということや、SNS流入は、そもそも同じような関心をもった人にうまくリーチできていれば、彼ら/彼女らはブログに長く滞在してくれる傾向にあるという想像から説明できるでしょう。

導線設計の意義

デザインが素晴らしいから次の記事も読みたいという人はいないでしょう。

しかし、面白いし次の記事も読みたいと思っても、デザインが悪く次の記事が見つからない場合は離脱します。

そのため導線の設計(読者を次のアクションへと導くための仕掛け)は、デザインのせいでユーザーが別の記事を探すのを諦めて離脱することを防ぐという消極的な目的しかありません。

導線は軽視すべきものでもありませんが、過度にのめりこむのも非生産的ということです。あくまでブログの導線はユーザーがブログに滞在する上でのボトルネックになりやすく、それを解消するという限りにおいて時間を投資すべきです。*4

その意味で、固定メニューの改造は確かにクリック率を増大させますが、記事下のカスタマイズに比べるとその効果が限定されています。

そのため、まずは記事下のカスタマイズを追及してから、その後に時間があれば、追尾型の固定ナビのカスタマイズに力を入れてみてはいかがでしょうか。

余談:ブログ論は読まれない

ちなみに、「ブログ運営」というカテゴリについては、「記事下バージョン」にのみ掲載していますが、クリック率が飛びぬけて低くなっています。

この記事下リンクの総クリック数に対して、ブログ運営関連のクリック数は6%となっており、5つのカテゴリ中最も低い値となっています。つまり、ブログ論は全く読まれない、ということです。

ブロガー自体がネット人口のうちのほんの一握りだけだということを考えると、当たり前の結果と言えるでしょう。

関連する記事

*1:テーマの統一性がとられている専門サイトは、全体の記事に統一性があるので、別です

*2:この作業のためにカテゴリを4つに絞りました

*3:オリジナルバージョンの計測結果は、他サイトのものですが、参考値と使えると考えています

*4:たしかにデザインをいじるのはブログ運営の一つの楽しみということは否定できることではありませんが