2014/07/07 |
アクセスアップ アクセスアップ
アダルト関係のネタを離れ、珍しくアクセスアップネタです。
「訪問別ページビュー」というのは、ユーザが検索エンジンなどからブログを訪れたとき、ブログ内で何ページ見たかという数値です。
ちなみに1ページ見ただけで去ってしまうユーザの割合を直帰率といいます。
これらの数値を改善するために、ブログの記事内に過去の関連記事のリンクを表示させたりしますが、どのようなリンクの仕方が一番関連記事のクリック率が高くなるか、GoogleAnalyticsの「ウェブテスト」の機能を使いABテストをして調べてみました。
ブログの全体のデザインも左右するので、紹介する方法がどのブログでも確実に良いとは限りませんが、こちらの方法でテストすることにより、自身のブログで最適な方法が見つけられると思います。
アフィリエイトの広告のクリック率をどうしたら高められるかという調査にも応用できるかと思います。
アダルトサイトとは言え、こういう継続的な改善は必要です。
調査対象
※若干のPHPプログラム、サーバの知識が必要となります
ブログ内の「エロ音声によるオナニーが意外に気持ちいい」という記事の中で過去記事へリンクしている、「最悪死ぬ!?催眠オナニーが気持ちよすぎるらしい」という内部リンクのクリック率を計測しました。
通常パターン
赤色で目立たせたパターン
リンク色を緑色にしたパターン
リンクにワンポイント矢印をつけたパターン
この緑色というのは、
「緑色のボタンはクリック率が高い」は本当か？
という記事を参考にして、とりあえず緑パターンを試しました。
事前準備
ブログ内の調査対象の記事を選ぶ
今回は「http://net-hw.com/173.html」のページですね。
調査したい表示パターン分のページを作成
GoogleAnaliyticsでABテストをする場合、表示パターン別のURLを用意しないと行けないわけですが、ブログ内でパターン分の似た記事を作るわけには行きません。
そこでURLにパラメータをつけることで擬似的にページを複数用意します。
つまり、このようなページがあるとします。
http://net-hw.com/173.html
http://net-hw.com/173.html?patern=1
http://net-hw.com/173.html?patern=2
http://net-hw.com/173.html?patern=3
WordPressショートコードの作成
上記のように「patern=x」で擬似的に別ページとしましたので、記事内でこのパラメータを見て表示を切り替える必要があります。
そこで利用するのがWordPressのショートコード
「ショートコード」については、
WordPressのショートコードを自作してみる
こちらも参考にしてみてください。
WordPressの管理画面から、
[テーマ編集]＞[テーマのための関数 (functions.php) ]を選択。
一番最後の「?>」の直前の行に下記のショートコード用関数を追加します。
function abtestShortcodeFunc( $atts, $content = null ) {
extract(shortcode_atts(
array('patern' => 0),$atts)
);
$_GET['patern'] = isset($_GET['patern']) ? $_GET['patern'] : 0;
if($_GET['patern'] == $patern)
{
return $content;
}
else
{
return '';
}
}
add_shortcode('abpatern', 'abtestShortcodeFunc');
これで「abpatern」というショートコード完成です。
記事内で下記のようにショートコードを利用することで、URLのパラメータ別の表示を出し分けることができます。
[abpatern patern=0]
<a href="/42.html" onclick="ga('send','event','inbound','click','/42.html',{'nonInteraction': 1});">最悪死ぬ!?催眠オナニーが気持ちよすぎるらしい</a>
[/abpatern][abpatern patern=1]
<a href="/42.html" style="color:#228B22;" onclick="ga('send','event','inbound','click','/42.html',{'nonInteraction': 1});">最悪死ぬ!?催眠オナニーが気持ちよすぎるらしい</a>
[/abpatern][abpatern patern=2]
<a href="/42.html" style="background:url(/wp-content/uploads/2014/06/3.gif) no-repeat right center;" onclick="ga('send','event','inbound','click','/42.html',{'nonInteraction': 1});">最悪死ぬ!?催眠オナニーが気持ちよすぎるらしい </a>
[/abpatern]
「[abpatern patern=0]」から「[/abpatern]」はURLのパラメータが無い場合の表示、「[abpatern patern=1]」から「[/abpatern]」が「patern=1」の場合と言った具合です。
リンクのイベント設定
上記の出し分け部分内の「onclick=”ga(‘send’,'event’,'inbound’,'click’,'/42.html’,{‘nonInteraction’: 1});”」
この部分に注目してください。
こちらはGoogleAnalyticsでクリック数を計測するための記述で、「イベントトラッキング」といいます。
【Universal Analytics】イベントトラッキング設定法
設定するパラメータの値は任意ですが、「/42.html」の部分だけをわかりやすい名称にしておくと良いでしょう。
「{‘nonInteraction’: 1}」の部分はおまじないと思ってもらえればいいですが、気になる方はこちら。
直帰とは直帰率とは
ここで紹介されている「直帰率に影響を与えなくする」オプションになります。
ショートコードでパターン別の表示方法を記述したら、URLに「patern=1」「patern=2」とかをつけてアクセスしてみて、表示が自分の考えている通りになるかを確認できれば準備OK。
ウェブテスト用のWordPressヘッダーを作成する
ウェブテストを行うために、オリジナルページ（パラメータ無しのページ）に専用コードを埋め込む必要があります。
コードはWordPressの、「header.php」内に記述しますが、オリジナルページ専用の「header.php」を作成しておきます。
WordPress 特定のカテゴリーや投稿記事に特定（複数）のheader.phpを割り当てる方法
まずは、「header.php」をコピーして、「header-single173.php」を作成しておきます。
（ファイル名は必ず、「header-」から始まるようにしておきます、パーミッション許可も忘れずに）
これが記事ID=173専用のヘッダーになります。
そして、single.phpの先頭を下記のように修正します。
<?php
get_header();
?>
↓ ↓
<?php
if(is_single('173')){
get_header('single173');
} else {
get_header();
}
?>
「is_single(’173’)」は記事ID=173かどうかを調べる記述です。
「get_header()」の引数に新たに作成した「header-single173.php」の「header-」以降の名称を指定します。
これで記事ID=173では専用の「header-single173.php」を読み込むようになります。
のちほど、この専用ヘッダーのファイルにウェブテストコードを挿入しますので、とりあえずこのままにしておきます。
GoogleAnalyticsのウェブテスト設定
さて、ここからGoogleAnalytics側の設定となります。
目標を作成
GoogleAnalyticsでウェブテストをするためには、「目標」の作成をしておく必要があります。
Googleアナリティクスのイベント設定～リンクアクションを計測する
上記参考記事の「３．イベントによる目標設定」の「目標の詳細」のところで、カテゴリ・アクション・ラベルの部分の設定を、パターン別表示の部分に記述していた
「onclick=”ga(‘send’,'event’,'inbound’,'click’,'/42.html’,{‘nonInteraction’: 1});”」に沿って設定します。
例の場合は、
カテゴリ：inbound
アクション：click
ラベル：/42.html
を設定し目標を作成します。
新規ウェブテストの作成
これで面倒な事前準備がひと通り終わりましたので、GoogleAnalyticsから新規ウェブテストを作成します。
メニューから「行動」＞「ウェブテスト」＞「テストを作成」を選択。
（１）テストの目標を選択
このテストの名前：自分のわかりやすい名前
このテストの目的：事前に作成しておいた目標を設定
テスト対象のトラフィック割合：特に理由がない場合100%
重要な変更内容に関するメール通知：特に理由がない場合オン
（２）テストを設定
オリジナルのページ：パラメータ無しのオリジナルの「net-hw.com/173.html」を設定
パターン1：用意しておいた一つ目のパターン「net-hw.com/173.html?patern=1」を設定
テストしたいパターンは任意の個数が追加できます。
（３）テストコードの設定
「手動でコードを挿入」を選択するとスクリーンショットのようなコードが表示されます。
このコードをオリジナルページ”だけ”に挿入することになるのですが、このコードを先ほど作成した「header-single173.php」に挿入します。
headタグとmetaタグの間に下記のように挿入。
<head profile="http://gmpg.org/xfn/11">
<?php
if(!isset($_GET['patern']))
{
?>
【ウェブテストコード】
<?php
}
?>
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
オリジナルページ”だけ”に挿入することになるので、「$_GET['patern’]」のパラメータが存在しないときにコードが表示されるようにしています。
「次のステップ」ボタンで、進むとちゃんとコードが正しく設定されているかのチェックが行われ、問題なければテスト開始できるようになります。
当ブログでのテスト結果は
さて、先ほど紹介していたパターンを当ブログでテストした結果ですが
赤色で目立たせたパターン：-39%
リンク色を緑色にしたパターン：-6%
リンクにワンポイント矢印をつけたパターン：+132%
赤で目立たせた場合は、意外にもクリック率が下がりました。
不自然に目立たせるとクリックに抵抗感が出てしまうのでしょうか。
リンクの色変更は誤差の範囲程度の違いのようです。
明らかに変化があったのはワンポイント矢印ですね。
+132%というのつまりは倍ほどのクリック率ということになりますので、かなり高い数値だと思います。
誤差に注意
サンプル数が少ないと誤差が考えられますが、GoogleAnalyticsのウェブテストでは「オリジナルを上回る可能性」というパーセンテージが一緒に出るようになっており、この数値により信頼度を確認することができます。
今回のワンポイント矢印をつけた場合は95%の確率でオリジナルを上回る可能性と出てますので、クリック率が倍とは言わないまでもオリジナルよりはかなりの確率でクリック率が高いと言えそうです。
まだテストは終了させてませんので、もう少し様子を見てクリック率が高くなることを確認できたら全リンクを書き換えなどして、訪問別ページビューが増えるかを確認してみようと思います。
