📈

Nelio A/B Testing による WordPress での ABテスト の実施

2024/05/07に公開

概要

スタジアムのプロダクトチームが開発している FANTS は、ブランドサイト https://fants.jp/ の運用を WordPress で行っています。こういったWebサイトは、ABテストを行うことで、デザインや文言の最適化を行うことがあります。

この記事では、WordPress で運用されているサイトで、ABテストを実施するためのツールの選定と、WordPress プラグインである Nelio AB Testing を用いたテストの方法について解説します。

https://fants.jp

WordPress での ABテスト について

ざっと調べたところ、WordPress で運用されているサイトで、A/Bテストを行う方法は下記の方法があるようです。

  • WordPress に依存しない A/B Test ツールを使う方法
  • WordPress のテーマを使う方法
  • WordPress のプラグインを使う方法

WordPress に依存しない A/B Test ツールを使う方法

Google Optimize や KAIZEN PLATFORM など、WordPress などCMSに依存しないツールを利用する方法です。

JavaScript によって、表示時に動的にUIを変更することで、A/Bテストを実施するため、WordPress などの CMS や サーバー環境に依存することなく、手軽にA/Bテストを実施することができます。

WordPress のテーマを使う方法

AFFINGER など、A/Bテストに対応したテーマを用いる方法もあります。

WordPress の テーマは、テンプレートだけでなく、機能も付与することができ、ある意味何でもありで、AFFINGERのように非常に高機能なテンプレートも存在します。

WordPress のプラグインを使う方法

A/B テスト 機能を提供する WordPress プラグインを用いる方法です。WordPress では、プラグインでできることは非常に強力で、様々なプラグインが存在します。

A/Bテスト機能を提供するプラグインとしては、調べたところ下記が比較的利用実績があり、良さそうでした。

WordPress プラグイン Nelio AB Testing を選定

以下を検討した結果、WordPress プラグイン の Nelio AB Testing を用いて、A/Bテストを実施することにしました。

  • 昔使ったことがある Google Optimize が 第一候補だったが、2023年9月に廃止されている
    • 以前よりもSEOペナルティが考慮されて、表示時のUIのすり替えは下火になっている可能性がある。
    • 開発環境と本番環境で、使い分けるのが面倒そうだった。
    • A/Bテストの内容や成果がテンプレートとは別管理
      • テーマ(テンプレート) の GitHub 修正フローとの相性が悪そうだった。
  • AFFINGER などテーマの変更はコストが大きい。
    • FANTS のブランドサイトは、独自の WordPress テーマとして実装されており、テーマを入れ替える手間は許容できなかった。
    • すでに各種プラグインを用いているため、テーマの機能と競合しそうだった。
  • WordPress プラグイン を 以下の観点で検討
    • A/Bテストできる対象は豊富か
      • 固定ページ、記事など、A/Bテストの対象は多彩か。
    • 開発は継続的に行われているか。
      • WordPressはアップデートが早いので、開発が止まっているプラグインは負債になりやすい。
    • ドキュメント等の情報源は豊富か。
    • 管理画面の使い勝手など、導入や管理が容易か。

いくつかのプラグインのドキュメントを読んだり、試用してみてみましたが、下記の理由で Nelio AB Testing を選択することにしました。

  • Nelio AB Testing での A/Bテストの対象が非常に多彩
    • 固定ページや記事など、改善したいページは一通り対応していた。
  • Nelio AB Testing Support Forum など、コミュニティも存在し、情報量があった。
  • Nelio Software が事業として開発していて、アップデートも頻繁に行われている。
    • 個人プラグインは継続性が心配。
  • 管理画面が非常に使いやすく、プラグインの導入、ABテストの設定やレポート等も迷いなくできた。
    • IPアドレスで会社からのアクセスを除外できるなど、機能面でも申し分なかった。
  • 本場と開発(検証)環境を並行運用できて、開発→検証→本番 の流れがスムーズにできる。

なお、Nelio AB Testing は、非常に強力なプラグインですが、有料です。
Plan and Pricing に、プラントと機能が解説されているため確認すると良いです。

以下では、Nelio A/B Testing を利用した A/Bテストの利用方法について、解説します。

Nelio A/B Testing の概要

https://wordpress.org/support/plugin/nelio-ab-testing/

インストール

インストール方法は、他のプラグインと同じです。WordPress の 管理画面にアクセスし「新規プラグインの追加」画面にて、キーワードで「Nelio A/B Testing」を入力して、プラグインをインストールしてください。

インストールしたら、プラグイン一覧で、有効化 (Activate) しましょう。有効化すると、管理画面のメニューに「Nelio A/B Testing」が表示されます。以後、このメニューから操作することになります。

また、管理画面から、購入した際にメールされるライセンスキーを入力することで、すべての機能が利用できるようになります。

Nelio A/B Testing の使い方

ここでは、WordPress Theme の固定ページとして実装されているページのA/Bテストを例にして、Nelio A/B Testing の使い方をご紹介します。

ABテストの流れ

  • ABテスト案となるテンプレートを作成する
  • Nelio A/B Testing で A/Bテストを作成する
  • A/Bテストを開始して、結果が出るのを待つ
  • A/Bテストの結果を適用する

ABテスト案となるテンプレートを作成する

まず、ABテストを行うテンプレート(A)に対しての 代替案(B Variant)となるテンプレートを作成します。

既存のテンプレートをコピーすると楽ですが、管理画面で選択するときに重複しないように、コピー後に テンプレートファイルの冒頭の Template Name の値を変更するのを忘れずに修正する必要があります。

cp page-template/t-download.php page-template/t-download_ab20240412.php

前項で作成したテンプレートファイルに ABテスト で試したい内容を記述します。

今回は、FANTS の 資料ダウンロード フォームについて「ダウンロードできる資料の概要を記載することで、問い合わせする人の不安や手間への懸念が減り、資料ダウンロードのCVRが向上する」という仮説に基づいて、タイトルやデザインの変更を行ったテンプレートでABテストを実施することにします。

今回、A/Bテストの対象としたページと、その改善案は下記となります。

ABテストの対象と改善案

Nelio A/B Testing で A/Bテストを作成する

Nelio A/B Testing の管理画面から「Add Test」を押し、新規A/Bテストを作成します。
今回は、固定ページのテンプレートのA/Bテストとなるため、GLOBAL Template を選択します。

今回作成したABテスト

次に、作成したABテストについて、設定をしていきます。

最初に、ABテストにわかりやすい名前を設定しましょう。

最も大切なのが、ABテストの対象(A)と、改善案(B)の設定です。今回は、ダウンロードページの固定ページのテンプレートの改善となるため、
A案として、固定ページ 資料ダウンロードのテンプレート を選択し、B案として、先ほど作成したテンプレート 資料ダウンロードのテンプレート(AB: 2024.04.12) を選択します。

次に、A/Bテスト の 効果判定の基準となる Conversion Goals and Actions を設定します。

今回の場合、それぞれのダウンロードページで、訪れたユーザーがフォームを入力し、資料請求の問い合わせをすることがゴールとなるため、資料請求の完了ページ(お礼ページ)を Conversion Goal として設定します。

Nelio A/B Testing では、表示されるテンプレートの他、任意のパスを設定したり、複数の Conversion Goal を設定でき、非常に柔軟な Conversion Goal の設定が可能です。

今回作成したABテスト

A/Bテストを開始して、結果が出るのを待つ

開始日や終了日を設定して「Start」を押すとABテストが開始されます。

初期設定では、AとBの2パターンの場合は、初回アクセス時に 50% の確率で振り分けられます。

途中経過は、下図のようにグラフでわかりやすく表示され、十分なサンプル数が揃うと 結果 が表示されます。この例では、なんと +94.1% の改善となり、CVRが約倍になりました。

ABテストの結果

A/Bテストの結果を適用する

結果が確定したら、Nelio A/B Testing の管理画面で ABテストを終了し、A案が勝った場合はB案を破棄し、B案が勝った場合はA案にB案の内容を取り込みましょう。

まとめ

この記事では、Nelio A/B Testing を用いた WordPress での A/Bテストの実施についてご紹介しました。

Nelio A/B Testing を用いると、改善案のテンプレートを用意したら、あとは管理画面で設定するだけで、簡単にABテストを実施することができます。

有料プラグインなので、多少のコストがかかりますが、A/Bテストで得られる効果を考えると、非常に良くできたプラグインと感じています。

FANTS では、Nelio A/B Testing 導入後、毎週何かしらのA/Bテストが実施されるようになっており、定量的な効果測定によるサイト改善が行われるようになりました。現在は、Webサイトのみですが、今後はアプリにも定量的な効果測定に基づく改善を実施していきたいと考えています。

GitHubで編集を提案
株式会社スタジアム

Discussion