---
title: 開始前チェックリスト：開始前の実験のQA
description: Optimizely では、ウェブページに視覚的変更および新しい機能の両方を簡単に実装できます。ウェブにコンテンツを公開するツールと同様に、行った変更が正しく表示され、機能することを常に確認する必要があります。
---

[OptimizelyのFAQ ](https://optimizely.gaprise.jp/faq)

# [開始前チェックリスト：開始前の実験のQA](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863)

 作成者: [株式会社ギャプライズ（Optimizely）](https://optimizely.gaprise.jp/faq/author/株式会社ギャプライズoptimizely)｜Jun 8, 2020 5:58:00 PM

Optimizely では、ウェブページに視覚的変更および新しい機能の両方を簡単に実装できます。ウェブにコンテンツを公開するツールと同様に、行った変更が正しく表示され、機能することを常に確認する必要があります。最終的に、実験は訪問者のエクスペリエンスに影響します。

何かが正しく公開されないというリスクが生じないように、開始前チェックリストリスクに従ってください。プレビューや QA（品質保証）プロセスに少々時間がかかり ますが、これに従うと、エラーが減り、1 回目で処理を正しく行うことができます。

プレビューモードとブラウザー間テストツールによるプレビューに加えて、実験に含めるすべてのブラウザーで QA を実行することをお勧めします。

目次

1.[開始前チェックリスト](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863?hs_amp=true#ch1)  
2.[開始する前に、テストの環境を作成します。](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863?hs_amp=true#ch2)  
2.1.[1. バリエーションコードおよびタイミングのテスト](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863?hs_amp=true#5eddd37b5403b80bf6cc361e-1591596549013)  
2.2.[2. ターゲット条件のテスト](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863?hs_amp=true#ch2-2)  
2.3.[3. 目標のテスト](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863?hs_amp=true#ch2-3)  
3.[環境の比較](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863?hs_amp=true#ch3)  
3.1.[プレビューモード](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863?hs_amp=true#ch3-1)  
3.2.[テスト Cookie](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863?hs_amp=true#ch3-2)  
3.3.[ステージング環境](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863?hs_amp=true#ch3-3)

 

## 開始前チェックリスト

| バリエーションコード | 確認：バリエーションは正しく表示され、動作していますか。 ビジュアルエディターで何らかの変更を行った場合は、バリエーションコードが jQuery の形式で生成されます。また、JavaScript/jQuery をコードエディターで手動で書き込むことができます。多くのウェブサイトで、AJAXや Angular.JS などのテクノロジーを使用してコンテンツを動的にロードすると、Optimizely がバリエーションコードを実行した場合にページにコンテンツが存在せず何も変更されないことがあります |
| --- | --- |
| タイミング | 確認：バリエーションはページが点滅することなく正しく表示されますか。タイミングとは、バリエーションコードが有効になる前の元のコンテンツの点滅のことです。点滅を回避できる速さでバリエーションコードを実行してください。 |
| ターゲット設定 | 確認：実験は、正しいページで正しい訪問者グループに表示されていますか。 ターゲット設定には、URL と訪問者グループ条件の両方が含まれます。テストは、URL で、含める訪問者に対してのみ実行してください。 |
| 目標 | 確認：目標は適切なタイミングでトリガーされ、正確なデータを取得していますか。 目標は、トリガーされたときに適切な追跡コールを開始する必要があります。つまり、目標をトリガーした場合、目標は Optimizely に正しくレポートする必要があります。目標の QA を適切に行わない場合、正確なデータを取得するように設定されていないために、最終的に実験の結果を放棄する必要がある可能性があります |

 

バリエーションコード、タイミング、ターゲット設定、および目標をチェックするときは、この開始シーケンスを使用してそれぞれが正常に動作することを確認してください。

 

## 開始する前に、テストの環境を作成します。

実験の QA を行うときに、ライブサイトをシミュレーションする環境が必要です。プレビューモードは実験のクイックチェックの実行に適していますが、完全な QA プロセスでは、次のいずれか、または両方を使用します。

- 追加の Optimizely プロジェクトを設定できるステージング環境がある場合はそれを使用します。次のテスト Cookie 手法を使用して、本番環境での最終的なチェックを実行します。
- 実験の実行をライブであるかのように開始し、自分または選択した人だけが表示できるようにライブ本番環境でテスト Cookie を設定します。

環境の比較については、次の表を参照してください。詳細については、この記事の下にある環境比較を参照してください。

 

 

| 環境 | 使用するタイミング | 用途 | 推奨 |
| --- | --- | --- | --- |
| プレビュー | オプション | Optimizely のプレビューモード | 迅速な初期チェック、特に「プレビュ ー方法」に適しています。 |
| テストCookie | 常時（ステージング環境が ある場合を除く） | 自分だけでなく、ライブで実行できるように実験のターゲットを設定します。 | ライブと同様の複数のページにまたがるテスト実験 |
| ステージング環境 | 使用可能な場合は、テストCookie の代わり | 実験をテストできる個別のプロジェクト | 個別のステージング環境と本番環境を持つ大企業 |

### 1. バリエーションコードおよびタイミングのテスト

Optimizely のプレビューモードを使用して、実験のビルド時にバリエーションコードをチェックできますが、最終的な QA のときは、テスト Cookie またはステージング環境を使用してください。ここでは、訪問者として、バリエーションが意図したとおりに表示され、ページの点滅がないことを確認します。

**使用するテクニック：強制パラメーター**

バリエーションコードとタイミングをテストするには、適切なバリエーションを表示していることを確認する必要があります、サイトでこれを最も簡単に行う方法は、1つのライブページで特定のバリエーションを素早く簡単に表示する方法である強制パラメーターを使用することです。これは、実験を開始する前にも実行できます。

> 注：  
> 強制実行パラメーターは、[強制バリエーションパラメーターを無効にする] チェックボックスをオフにしない限り、デフォルトでは機能しません。この設定は、ホームページに移動して [設定] タブをクリックし、[強制バリエーション] セクションで行うことができます。

**使用方法：**

1. 最初に、新しいシークレットウィンドウまたはプライベートブラウジングウィンドウを開き、テスト Cookie を設定します（またはステージングサイトに移動します）。
2. テスト対象のページに移動します。
3. 実験に含める URL を ?optimizely_x パラメーターで追加します。
4. オプション：目標をテストする場合も、optimizely_force_tracking=true パラメーターで目標の追跡が可能になります。

> ヒント：  
> バリエーションコードの問題とタイミングの問題は、ブラウザーの開発者コンソールを使用して識別できます。ブラウザーで自分のページを開いてからコンソールを開き、Optimizely の [コードの編集] ボックスからバリエーションコードをコピーして貼り付けるだけです。実験が有効でもバリエーションコードが動作せず、コンソールでは動作する場合は、Optimizely の実行終了後にコンテンツをロードした可能性があります。

### 2. ターゲット条件のテスト

ここでは、実験が表示されるか、タイミング問題が発生していないかを確認します。自分が望む場所に実験が表示され、適切な訪問者グループに実験が表示されるかどうかを確認する必要があります。

**使用する手法：データオブジェクト**

何らかのコマンドをブラウザーコンソールに入力すると、Optimizely が実験に振り分ける方法がわかります。これを使用して、ターゲット設定が正しく動作するかどうかを確認します。

**使用方法：**

1. 最初に、新しいシークレットウィンドウまたはプライベートブラウジングウィンドウを開き、テスト Cookie を設定します（またはステージングサイトに移動します）。
2. テスト対象のページに移動します。
3. ブラウザーコンソールを開きます。
4. optimizely.activeExperimentsをコンソールに入力します。これは、その訪問者のページで現在実行されているすべての実験のリストを返します。必要な実験は実行されていますか。実行されている場合は、ターゲット条件を満たしています。  
   実行されていない場合は、次のようにします。
5. optimizely.variationNamesMapをコンソールに入力します。これは、訪問者が現在 Cookie 処理されているすべての実験（ページ上のアクティブと非アクティブの両方）に対する実験 ID とバリエーション名のマッピングを返します。これにより、振り分けられたバリエーションを表示できます。

**トラブルシューティングの注意事項：**

ターゲット条件が合格すると予想していたのに失敗した場合、またはその逆の場合は、URL ターゲット設定および訪問者グループ条件に戻って確認します。URL ターゲット設定内では、URL 一致検証を使用して、テストしていた URL がターゲット条件に合格することを確認します。訪問者グループ条件内では、ページを表示するために使用する条件に一致しない可能性がある条件が設定されているかどうかを確認します。

### 3. 目標のテスト

最後に、想定通りに目標が開始されるかどうかを確認します。これは、訪問者に実験が実行されているときにデータが正確に取得されることを確認します。Optimizely のプレビューモードで、[イベント] タブに移動し、クリック目標をテストできます。ただし、他のタイプの目標を表示するには、テスト Cookie またはステージング環境を使用して実際の実験を表示する必要があります。

**使用する手法：ネットワークトラフィック**

ネットワークトラフィックは、ページとの対話時に発生するすべてのイベントのブラウザー内のログです。Optimizely で目標をトリガーすると、トラッキングコールが発生し、ネットワークトラフィックから取得されます。

**使用方法：**

- 新しいシークレットウィンドウまたはプライベートブラウジングウィンドウを開き、テスト Cookie を設定します（またはステージング環境に移動します）。
- テスト対象のページに移動します。
- 開発者コンソールの [Network] タブに移動します。
- Optimizely で目標をトリガーするアクションを実行します。
- [Network] タブでその目標に対応するイベントを探し、必要なときにそのイベントが発生するかどうかを確認します。
- 特定のバリエーションについての目標をテストしたい場合は、強制パラメーターツールを使用してください。強制パラメーターはデフォルトで目標の追跡を無効にするので、次のようにパラメーターをもう 1 つ追加して、追跡を有効にする必要があります：optimizely_force_tracking=true（URL はhttp://www.example.com/testpage?optimizely_x12345678_1&optimizely_force_tracking=true のような形になります）

## 環境の比較

このセクションでは、実験のプレビューおよび QA で使用可能なさまざまな環境の違いを説明します。

### プレビューモード

プレビューモードは、Optimizely のビルトインプレビュー機能で、すぐに簡単に使用できます。特に、さまざまな訪問者および訪問者グループの視点から実験をプレビューする場合に使用します。

**方法：**

- [バリエーション] タブをクリックし、[プレビュー] を選択します。
- ライブプレビューは、実際のサイトに最も近いエクスペリエンスを提供します。

**使用するタイミング：**

- バリエーションコード - バリエーションコードが正常に動作するかどうか（特に視覚的変更）を確認します。
- クリック目標 - クリック目標が実行されているかどうかを確認します。

### テスト Cookie

テスト Cookie はサイトの QA を行う最も堅牢なフル機能の方法で、実験を訪問者にどのように実行するかの全体像を提供します。この手法は簡単に設定でき、訪問者が間違って実験を閲覧することなく実験を安全に実行することができます。テスト Cookie は、複数のライブページの QA を行うベストプラクティスです。

**方法：**

- NAME、VALUE に関する Cookie ターゲット条件を追加します。
- 保存して、実験を開始します。
- ターゲット条件に含めた URL にアクセスします。
- JavaScript コンソールを開き、"document.cookie = 'NAME=VALUE'" と入力します。
- ページを更新します。
- または、このブックマークレットを使用します。

**使用するタイミング：**

- 複数のページ（複数ページを含む）でのテスト - テストは実行中であるため、複数のページを対象とするテストの全機能をテストできます。これには、あるページから次のページまたはチェックアウトファネルの機能にクエリーパラメーターが渡されるかどうかのテストが含まれます。
- タイミング - これはロード時間およびバリエーションコードの実行のタイミングをテストする最も正確な方法です。
- 視覚的変更
- 機能性（新旧）
- 目標 - テストは実行中であるため、設定した目標をテストし、ネットワークトラフィックを介して送信されていることを確認できます。

### ステージング環境

ステージング環境と本番環境を分けている大企業では、実験を設定し、訪問者に実験を公開することなく最初の QA を実行する方法としてステージング環境を使用する可能性があります。これを使用する場合でも、実験を本番環境に移動した後は、テスト Cookie の手法を使用することをお勧めします。

**方法：**

- ステージング環境および本番環境で異なるプロジェクトを使用します。そのため、スニペットも異なります。
- 本番プロジェクトに実験を複製する前に、QA を行うステージングプロジェクトの実験をアクティブ化します。
- 本番プロジェクトのテスト Cookie など、他の QA メソッドを使用することをお勧めします（特に、ステージング環境と本番環境の差異が自明ではない場合）。

**使用するタイミング：**

- ステージング環境と本番環境が一致する場合に最適です。
- タイミング
- ターゲット設定
- バリエーションコード - 視覚的変更とページ上の機能の両方をテストできます。
- 目標
- 複数のページをテストできます。

[完全な記事を表示](https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863)

```json
{
  "@context" : "http://schema.org",
  "@type" : "BlogPosting",
  "author" : {
    "@type" : "Person",
    "name" : "株式会社ギャプライズ（Optimizely）"
  },
  "dateModified" : "2022-02-22T17:59:29.089Z",
  "datePublished" : "2020-06-08T17:58:00Z",
  "headline" : "開始前チェックリスト：開始前の実験のQA",
  "image" : {
    "@type" : "ImageObject",
    "height" : 630,
    "url" : "https://f.hubspotusercontent10.net/hubfs/19917462/optimizely/optimizely-blog.png",
    "width" : 1200
  },
  "mainEntityOfPage" : "https://optimizely.gaprise.jp/faq/optimizely-classic/optimizely-classic-qa/863",
  "publisher" : {
    "@type" : "Organization",
    "logo" : {
      "@type" : "ImageObject",
      "height" : 60,
      "url" : "/hs/hsstatic/content_shared_assets/static-1.4092/img/default-amp-logo.png",
      "width" : 60
    },
    "name" : "OptimizelyのFAQ"
  }
}
```