ABテストの設定チュートリアル
このチュートリアルでは、LPのメインビジュアルを2パターン用意して(1パターンは既存のもの)、均等に配信した上でどちらのコンバージョン率が高いかを検証するABテストの設定方法をご紹介します。
ABテストはコードエディターである「Standardキャンペーン作成」と、ビジュアルエディターである「Visualキャンペーン作成」の2種類のエディターで設定することができます。このチュートリアルでは各エディターの設定方法をご紹介します。
はじめに
DLPOを導入する際にプランニングを行い、ランディングページのテスト要素(表示切替要素)やコンバージョンページ等を決定します。このチュートリアルのプランニングは以下の通りです。
・弊社で用意したサンプルサイト「テック・キャリア・パートナーズ」（https://dlpo.jp/demo/）のLPを使用し、コンバージョンページは「1週間無料体験お申込みフォーム」の「1.無料体験申込フォーム」と「3.申込完了」といたします。
図１－１：サンプルサイトの構成
・メインビジュアルのクリエイティブはデフォルトHTMLを「Aパターン」、新規作成したものを「Bパターン」として2つ使用します。
※Aパターンは配信しても表示が切り替わらない(=デフォルトが表示)HTMLを何も記述しない「空クリエイティブ」として作成します。
図１－２：表示切り替え箇所と切り替えパターン
Standardキャンペーン作成による設定手順
1．タグ設置
ワンコード実装またはダイレクトコード実装にて、クリエイティブを配信する「エリア」、コンバージョンを計測する「コンバージョンポイント」を設定してください。
(1)エリア設定
クリエイティブを切り替える「エリア」を登録してください。
【ワンコード実装】
管理画面にてページ設定＞ワンコード設定と進み、ワンコード条件登録より「エリア」を登録してください。LPトップページのメインビジュアルを切り替えるのでLPトップページのURLを「エリア設置URL」へ入力してください。ワンコード条件を登録したら、対象条件をワンコードルール設定へ追加し「作成/更新」ボタンをクリックしてください。
エリア条件のワンコードルール設定後、LPトップページにワンコードタグを設置してください。
ワンコード実装の詳細は「ワンコード実装」をご覧ください。
図２－１：ワンコード実装でのエリア設定イメージ
【ダイレクトコード実装】
管理画面にてページ設定＞ダイレクトコード設定と進み、「エリアタグを作成する」よりエリアタグを作成してください。LPトップページに制御タグを設置、またメインビジュアル部分にエリアタグを設置してください。
ダイレクトコード実装の詳細は「ダイレクトコード実装」をご覧ください。
図２－２：ダイレクトコード実装でのエリア設定イメージ
(2)コンバージョン設定
テストの測定対象となる「コンバージョンポイント」を登録してください。
【ワンコード実装】
管理画面にてページ設定＞ワンコード設定と進み、ワンコード条件登録より「コンバージョン」を登録してください。コンバージョンポイント1つにつき、コンバージョン条件を1つ登録する必要があります。「1.無料体験申込フォーム」と「3.申込完了」の2つのコンバージョン条件を登録してください。ワンコード条件を登録したら、対象条件をワンコードルール設定へ追加し「作成/更新」ボタンをクリックしてください。
コンバージョン条件のワンコードルール設定後、「1.無料体験申込フォーム」と「3.申込完了」にワンコードタグを設置してください。
ワンコード実装の詳細は「ワンコード実装」をご覧ください。
図２－３：ワンコード実装でのコンバージョン設定イメージ(1.無料体験申込フォーム)
図２－４：ワンコード実装でのコンバージョン設定イメージ(3.申込完了)
【ダイレクトコード実装】
管理画面にてページ設定＞ダイレクトコード設定と進み、「コンバージョンタグを作成する」よりコンバージョンタグを作成してください。コンバージョンポイント1つにつき、コンバージョンタグを1つ作成する必要があります。「1.無料体験申込フォーム」と「3.申込完了」の2つのコンバージョンタグを作成してください。対象ページを閲覧した場合にコンバージョンを計測したいため、計測タイミングはいずれも「ページビュー」を設定してください。対象ページに制御タグ、コンバージョンタグを設置してください。
ダイレクトコード実装の詳細は「ダイレクトコード実装」をご覧ください。
図２－５：ダイレクトコード実装でのコンバージョン設定イメージ(1.無料体験申込フォーム)
図２－６：ダイレクトコード実装でのコンバージョン設定イメージ(3.申込完了)
(3)ページ読み込み
エリアとコンバージョンがDLPO管理画面で認識されるためには、タグを設置したページを一度ブラウザで読み込む必要があります。
タグを設置した
・LPトップページ
・1.無料体験申込フォーム
・3.申込完了
を一度ブラウザで読み込んでください。
図２－７：ブラウザ読み込み対象ページ
(4)認識確認
管理画面にてページ設定＞エリア一覧と進み、エリアがDLPO管理画面上で認識されているかを確認してください。エリア一覧の詳細は「エリア一覧」をご覧ください。
図２－８：エリアグループ一覧
同様に、管理画面にてページ設定＞コンバージョン一覧と進み、コンバージョンポイントがDLPO管理画面上で認識されているかを確認してください。コンバージョン一覧の詳細は「コンバージョン一覧」をご覧ください。
図２－９：コンバージョングループ一覧
エリアやコンバージョンポイントが管理画面上で認識されない場合は、以下の点をご確認ください。
【共通確認事項】
・各種タグは対象ページに設置されていますか？
・各種タグを設置したページにアクセスしてみましたか？
【ワンコード実装の場合の確認事項】
・ワンコード条件にて登録したURLは正しいですか？
・ワンコードルールに条件を追加しましたか？
・ワンコードルール設定の一覧に条件が表示されていますか？
・ワンコードルール設定の作成/更新を押しましたか？
【ダイレクトコード実装の場合の確認事項】
・制御タグは設置していますか？
・制御タグのパスは正しいですか？
・通信ファイル(adlpo.jp)はアップロードされていますか？
・エリアタグは入れ子構造になっていませんか？
・エリアタグの文字コードは正しく設定されていますか？
※管理画面上への認識まで少し時間がかかる場合もございます。上記をご確認頂いても管理画面上にエリアやコンバージョンポイントが認識されない場合はしばらく時間を空けてから再度ログインをしてご確認ください。
(5)表示名称の変更
エリアやコンバージョンポイントが認識されていることを確認できましたら、この後の設定にて判別しやすくするため「表示名称」の変更をお勧めします。
エリアやコンバージョンポイントの名称は半角英数字で登録されるため、エリア一覧、コンバージョン一覧にて「表示名称」を変更してください。
図２－１０：エリア「表示名称」変更
図２－１１：コンバージョン「表示名称」変更
2．クリエイティブの登録
エリアに配信するクリエイティブを登録してください。
図３－１：クリエイティブ登録パターン
(1)Aパターンの登録
クリエイティブの「Aパターン」を登録してください。
管理画面にてクリエイティブ＞クリエイティブ個別登録と進み、「HTMLエディター」を選択してください。HTMLエディター設定の内容を初期表示のまま登録すると、何も配信しないクリエイティブとして登録することができます。これをキャンペーンに組み込むことによってデフォルトパターン(Aパターン)の効果を測定することができます。
図３－２：Aパターンの登録
(2)Bパターンの登録
クリエイティブの「Bパターン」を登録してください。
「Bパターン」に使用する画像ファイルはDLPOのCDNサーバーへアップロードし利用します。管理画面にてクリエイティブ＞CDN登録と進み、対象の画像ファイルをCDNサーバーへアップロードしてください。
図３－３：CDN配信一覧
【ワンコード実装】
管理画面にてクリエイティブ＞クリエイティブ個別登録と進み、「ワンコード実装用エディター」を選択してください。クリエイティブを切り替える箇所としてエリア設定にて登録した「エリア」を設定してください。切り替え方法を「の中身を書き換える」に設定し、切り替え内容にBパターンの画像を表示するHTMLタグを設定してください。
図３－４：Bパターンの登録（ワンコード実装用エディター）
【ダイレクトコード実装】
管理画面にてクリエイティブ＞クリエイティブ個別登録と進み、「HTMLエディター」を選択してください。HTMLエディター設定の内容にBパターンの画像を表示するHTMLタグを設定してください。
図３－５：Bパターンの登録（HTMLエディター）
(3)クリエイティブの確認
管理画面＞クリエイティブの「クリエイティブグループ一覧」にて、登録したAパターン、Bパターンのクリエイティブがあることを確認してください。
図３－６：クリエイティブグループ一覧
3．キャンペーンの登録
Standardキャンペーン作成にてキャンペーンを登録してください。
なお、キャンペーン作成についての詳細は「Standardキャンペーン作成による設定」をご覧ください。
(1)基本設定
管理画面のキャンペーンにて、Standardキャンペーン作成の「キャンペーンを作成する」をクリックしてください。Standardキャンペーン作成の「1.基本設定」にて「キャンペーン名」「稼働日時」を設定し、「次へ」ボタンをクリックしてください。
図４－１：「1.基本設定」
(2)詳細設定
「2.詳細設定」の「エリア設定」にてエリアを選択し、「追加」ボタンをクリックしてください。
図４－２：「2.詳細設定」エリアの設定
エリアを追加するとターゲティングセグメント、クリエイティブパターンの設定欄が表示されます。「クリエイティブ設定」の「クリエイティブ一括追加」をクリックし、クリエイティブ一括選択から「Aパターン」「Bパターン」どちらにもチェックを入れて「選択」をクリックしてください。
図４－３：「2.詳細設定」クリエイティブ一括追加
「クリエイティブ設定」の当該エリアに、Aパターン、Bパターンのクリエイティブが追加されていることが確認できましたら、「次へ」ボタンをクリックしてください。
図４－４：「2.詳細設定」クリエイティブの設定確認
(3)コンバージョン設定
「3.コンバージョン設定」の「コンバージョンポイント」にてコンバージョンポイントを選択してください。まず「無料体験申込フォーム」を選択すると「追加」ボタンが出現するので、「追加」ボタンをクリックしてください。
図４－５：「3.コンバージョン設定」コンバージョンポイントの追加
「追加」ボタンをクリックすると、下にコンバージョン名欄が追加されます。同様に「申込完了」も追加し、対象コンバージョンポイントを追加しましたら「登録」ボタンをクリックしてキャンペーンの設定を完了させてください。
図４－６：「3.コンバージョン設定」コンバージョンポイントの確認＆登録
4．表示の確認とキャンペーンの稼働
登録したキャンペーンが正しく表示されるか確認し、キャンペーンを稼働させてください。
(1)プレビュー確認
キャンペーン設定後にキャンペーンを稼働せずに(もしくは稼働後にも)、LP上のクリエイティブ表示をご確認いただける「プレビュー」機能にて、登録したキャンペーンが正しく表示されるかを確認してください。管理画面のキャンペーンにて、「キャンペーングループ一覧」より対象キャンペーンの アイコンをクリックしてください。
「エリア」のプルダウンより「Bパターン」を選択し、「プレビュー」ボタンをクリックすると別タブでプレビューが表示されます。
図５－１：プレビュー
表示されたプレビューより、以下チェックポイントをご確認ください。プレビューの詳細については「プレビュー機能」をご覧ください。
【チェックポイント】
・ビジュアルが切り替わるか
・表示が崩れていないか
・ページ内のリンクなどクリックされる箇所をクリックして正しく動作するか
※可変箇所のクリエイティブ内にリンクなどが無い場合でも、ページj内のすべてのクリックされる箇所について、動作確認することをお勧めします。
「2．クリエイティブの登録」の(1)～(2)にて、クリエイティブを登録する際にサムネイル画像は未登録のまま進めました。プレビュー確認にてそれぞれのキャプチャー(スクリーンショット)を撮影しサムネイル登録しておくと、この後のレポート確認時に表示することができます。
クリエイティブのサムネイル画像は、管理画面のクリエイティブにて、クリエイティブグループ一覧の該当箇所に画像をドロップするだけで簡単に登録することができます。詳細は「クリエイティブ設定とは」をご覧ください。
(2)キャンペーン稼働
プレビュー機能にて確認が済みましたら、プレビューウィンドウは閉じてキャンペーンを稼働させます。管理画面のキャンペーンにて、キャンペーングループ一覧より対象キャンペーンの「稼働ON/OFF」を「ON」に設定してください。確認アラートが表示されるので「OK」をクリックするとキャンペーンが稼働します。
図５－２：キャンペーンの稼働
キャンペーンが稼働しない場合は、以下の点をご確認ください。
【確認事項】
・稼働日時は正しく設定されていますか？
・Aパターンが表示されている可能性がございます。同じブラウザでは同じクリエイティブが表示される仕様ですので、他のブラウザや他の端末で他のパターンが表示されるかをご確認ください。
※以上をご確認いただいた上で、キャンペーンが稼働しない場合は、DLPOサポートデスクまでお問い合わせください。
5．レポートの設定
DLPOは美しいレポート画面と多様なレポートにて、皆さまの統計的な処理をサポートいたします。
ここでは、「おすすめ基本ビューセット」の設定方法をご紹介します。
図６－１：おすすめ基本ビューセット
(1)レポートを開く
DLPO管理画面の「キャンペーン」または「レポート」を開き、キャンペーングループ一覧より設定したいキャンペーンの アイコンをクリックしてください。
図６－２：キャンペーングループ一覧
(2)ビュー設定
レポート詳細が表示されます。初回表示時にはエリアに対し1つのビューが表示されています。
画面右側に表示される縦バーの「ビューセット設定」にマウスをドラッグして、表示されたメニューの「ビューの追加」をクリックして、ビューを2つ追加してください。
上から2つ目のビューの アイコンをクリックし、「ビュー設定」を表示させてください。ビュー設定にて、以下を設定し「登録」ボタンをクリックしてください。
・「CVポイント」のプルダウンから「申込完了」を選択してください。
・「サムネイル」のラジオボタンから「表示しない」を選択してください。
編集したビューのCVポイントが「無料体験申込フォーム」から「申込完了」に変更されていることを確認してください。
図６－３：2つ目のビュー設定
上から3つ目のビューの「クリエイティブ種別」プルダウンより、「クリエイティブ-時系列」を選択してください。
図６－４：3つ目のビュー設定
その後、上から3つ目のビューの アイコンをクリックし、「ビュー設定」を表示させてください。ビュー設定にて、以下を設定し「登録」ボタンをクリックしてください。
・「CVポイント」のプルダウンから「申込完了」を選択してください。
(3)ビューセットの保存
ここまでのビューセットを保存しましょう。「名前をつけて保存」をクリックしてください。
「ビューセットの保存」にてビューセット名称に「おすすめビューセット」と入力し「保存」ボタンをクリックしてください。
保存することで、今後計測されたデータをこのビューセットで確認することが可能です。
図６－５：ビューセットの保存
以上がStandardキャンペーン作成による設定手順となります。
ご不明点が解消されない場合は、DLPOサポートデスクまでご連絡ください。
Visualキャンペーン作成による設定手順
1．キャンペーンの登録
Visualキャンペーン作成にてキャンペーンを登録してください。
なお、キャンペーン作成についての詳細は「Visualキャンペーン作成による設定」をご覧ください。
(1)配信ページ登録
管理画面のキャンペーンにて、Visualキャンペーン作成の「キャンペーンを作成する」をクリックしてください。
「1.配信ページ登録」にて「キャンペーン名」を入力し、「エリア(ワンコード)を新規作成する」を選択後「URL」にLPトップページのURLを設定してください。その後、LPトップページにワンコードタグを設置し、「保存して次へ」ボタンをクリックしてください。
図７－１：「1.配信ページ登録」
(2)クリエイティブ編集
次の「2.クリエイティブ編集」では、キャンペーン作成時に予めクリエイティブパターンが2つ用意されます。今回は「デフォルト」を「Aパターン」用、「クリエイティブ1」を「Bパターン」用に利用します。クリエイティブパターンの名称を変更してください。
図７－２：「2.クリエイティブ編集」クリエイティブパターンの名称変更
「Aパターン」はメインビジュアルを変更しないパターンとなるため、Visualエディターでの編集は必要ありません。「Bパターン」はメインビジュアルの画像を変更するため、サイドメニューより「Bパターン」を選択し、Visualエディターにてメインビジュアルにマウスカーソルを合わせてください。メインビジュアルに青枠が表示された状態でクリックすると、編集メニューが表示されます。
編集メニューにて「編集」＞「画像（CDN画像）」を選択し、表示された「画像を選択（CDN画像選択）」より対象画像の「この画像に変更」をクリックしてください。BパターンのVisualエディターにて、指定した画像が表示されます。
※画像がCDNサーバーにアップロードされていない場合は、「新規画像登録」からアップロードすることが可能です。
図７－３：「2.クリエイティブ編集」Bパターンのクリエイティブ編集
サンプルサイトでは、PC/タブレットとスマートフォンにて使用する画像ファイルが異なるため、サイドバーの下部に表示されているデバイス表示切り替えにて表示形式を切り替え、スマートフォンの場合の画像を同様に変更してください。
図７－４：「2.クリエイティブ編集」Ｂパターンのデバイス表示切り替え
以下のように「Aパターン」、「Bパターン」のクリエイティブ編集が完了しましたら、「保存して次へ」をクリックしてください。
図７－５：「2.クリエイティブ編集」パターン比較
(3)詳細設定
「3.詳細設定」にてコンバージョンポイントを設定します。まず「コンバージョンポイント設定」をクリックしてください。コンバージョンポイント選択が表示されるため、右上の「新規コンバージョンポイント登録」をクリックしてください。新規コンバージョンポイント登録にて「表示名称」、コンバージョンポイントの「URL」を入力し、「コンバージョンポイント登録」をクリックしてください。なお、コンバージョンポイントに登録するページにはワンコードタグを設置する必要があります。
上記の手順にて「1.無料体験申込フォーム」「3.申込完了」のコンバージョンポイントを登録してください。登録後は、コンバージョンポイント選択に対象コンバージョンポイントが表示されます。対象コンバージョンポイントの「選択」を「ON」に設定し、「選択したコンバージョンポイントを設定」をクリックしてください。
※コンバージョンポイントを設定済みの場合は、新規登録する必要はありません。コンバージョンポイント選択にて対象コンバージョンポイントの「選択」を「ON」に設定し、「選択したコンバージョンポイントを設定」をクリックしてください。
図７－６：「3.詳細設定」コンバージョンポイント設定
対象コンバージョンポイントを設定しましたら、キャンペーンの「稼働日時」を設定し、「設定完了」ボタンをクリックしてキャンペーンの設定を完了させてください。
図７－７：「3.詳細設定」稼働日時の設定＆設定完了
2．表示の確認とキャンペーンの稼働
登録したキャンペーンが正しく表示されるか確認し、キャンペーンを稼働させてください。
(1)プレビュー確認
キャンペーン設定後にキャンペーンを稼働せずに(もしくは稼働後にも)、LP上のクリエイティブ表示をご確認いただける「プレビュー」機能にて、登録したキャンペーンが正しく表示されるかを確認してください。管理画面のキャンペーンにて、「キャンペーングループ一覧」より対象キャンペーンの アイコンをクリックしてください。
サイドメニューのクリエイティブパターンを選択すると、対象のプレビューが表示されます。
図８－１：プレビュー
表示されたプレビューより、以下チェックポイントをご確認ください。プレビューの詳細については「プレビュー機能」をご覧ください。
【チェックポイント】
・ビジュアルが切り替わるか
・表示が崩れていないか
・ページ内のリンクなどクリックされる箇所をクリックして正しく動作するか
※可変箇所のクリエイティブ内にリンクなどが無い場合でも、ページ内のすべてのクリックされる箇所について、動作確認することをお勧めします。
(2)キャンペーン稼働
プレビュー機能にて確認が済みましたら、キャンペーンを稼働させます。管理画面のキャンペーンにて、キャンペーングループ一覧より対象キャンペーンの「稼働ON/OFF」を「ON」に設定してください。確認アラートが表示されるので「OK」をクリックするとキャンペーンが稼働します。
図８－２：キャンペーンの稼働
キャンペーンが稼働しない場合は、以下の点をご確認ください。
【確認事項】
・稼働日時は正しく設定されていますか？
・Aパターンが表示されている可能性がございます。同じブラウザでは同じクリエイティブが表示される仕様ですので、他のブラウザや他の端末で他のパターンが表示されるかをご確認ください。
※以上をご確認いただいた上で、キャンペーンが稼働しない場合は、DLPOサポートデスクまでお問い合わせください。
3．レポートの設定
DLPOは美しいレポート画面と多様なレポートにて、皆さまの統計的な処理をサポートいたします。
ここでは、「おすすめ基本ビューセット」の設定方法をご紹介します。
図９－１：おすすめ基本ビューセット
(1)レポートを開く
DLPO管理画面の「キャンペーン」または「レポート」を開き、キャンペーングループ一覧より設定したいキャンペーンの アイコンをクリックしてください。
図９－２：キャンペーングループ一覧
(2)ビュー設定
レポート詳細が表示されます。初回表示時にはエリアに対し1つのビューが表示されています。
画面右側に表示される縦バーの「ビューセット設定」にマウスをドラッグして、表示されたメニューの「ビューの追加」をクリックして、ビューを2つ追加してください。
上から2つ目のビューの アイコンをクリックし、「ビュー設定」を表示させてください。ビュー設定にて、以下を設定し「登録」ボタンをクリックしてください。
・「CVポイント」のプルダウンから「申込完了」を選択してください。
・「サムネイル」のラジオボタンから「表示しない」を選択してください。
編集したビューのCVポイントが「無料体験申込フォーム」から「申込完了」に変更されていることを確認してください。
図９－３：2つ目のビュー設定
上から3つ目のビューの「クリエイティブ種別」プルダウンより、「クリエイティブ-時系列」を選択してください。
図９－４：3つ目のビュー設定
その後、上から3つ目のビューの アイコンをクリックし、「ビュー設定」を表示させてください。ビュー設定にて、以下を設定し「登録」ボタンをクリックしてください。
・「CVポイント」のプルダウンから「申込完了」を選択してください。
(3)ビューセットの保存
ここまでのビューセットを保存しましょう。「名前をつけて保存」をクリックしてください。
「ビューセットの保存」にてビューセット名称に「おすすめビューセット」と入力し「保存」ボタンをクリックしてください。
保存することで、今後計測されたデータをこのビューセットで確認することが可能です。
図９－５：ビューセットの保存
以上がVisualキャンペーン作成による設定手順となります。
ご不明点が解消されない場合は、DLPOサポートデスクまでご連絡ください。