Проведение экспериментов с AMP-страницами с помощью Оптимизации

AMP-страницы используют специальные компоненты, например <amp-analytics> для регистрации активности и <amp-experiment> для проведения экспериментов. Если вы проводите эксперименты с документами AMP с помощью <amp-experiment>, Google Оптимизация позволяет получать информацию об эффективности ваших вариантов и определять лучший с учетом ваших целей.

В этой статье рассказывается, как проводить эксперименты со страницами AMP и создавать по ним отчеты, используя вместо <amp-pixel> Google Оптимизацию. После завершения настройки вы сможете с помощью целей Google Аналитики передавать данные в байесовскую статистическую модель и разрешать Оптимизации выбирать лучший вариант. Приведенная в этой статье информация касается ресурсов, связанных с аккаунтом Universal Analytics. В настоящее время Оптимизация не поддерживает проведение AMP-экспериментов в аккаунтах Google Аналитики 4.

Требования

Эксперимент с AMP-страницами

Чтобы создать эксперимент Оптимизации для оценки эффективности компонента <amp-experiment>, выполните следующие действия:

  1. Проверьте наличие компонентов <amp-experiment> и <amp-analytics> в разделе <HEAD> вашего AMP-документа. Пример: 
    <script async custom-element="amp-analytics"
        src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
<script async custom-element="amp-experiment"
        src="https://cdn.ampproject.org/v0/amp-experiment-0.1.js"></script>
  2. В контейнере Оптимизации создайте A/B-тестирование. Далее указанное вами название эксперимента будет обозначаться как EXPERIMENT_NAME.
  3. Создайте варианты в своем компоненте <amp-experiment> и задайте их коэффициенты. Создайте соответствующие варианты в Оптимизации и задайте их коэффициенты.

    Кроме того, для создания вариантов можно использовать графический редактор Оптимизации.

  4. Задайте цели эксперимента в Оптимизации. Цели передают данные в статистическую модель, которая используется для выбора лучших вариантов и определения их эффективности в сравнении с исходными настройками.
  5. Создайте правило таргетинга для URL в Оптимизации для AMP-документов, на которые вы хотите настроить таргетинг. Это правило не используется в Оптимизации, но может использоваться для справки.
  6. Начните эксперимент в Оптимизации. На информационной панели эксперимента в Оптимизации можно найти идентификатор эксперимента Аналитики, состоящий из 23 букв и цифр (например, q0AKJL-XRuCmApEIQelcCg). Далее он будет обозначаться как EXPERIMENT_ID.
  7. Вставьте правильные компоненты <amp-experiment> и <amp-analytics> в свой AMP-документ.

    Пример 1: <amp-experiment> 

    <amp-experiment>
  <script type="application/json">
    {
      "<EXPERIMENT_NAME>": {
        "sticky": true,
        "variants": {
          "0": 33.4,
          "1": 33.3,
          "2": 33.3
        }
      }
    }
  </script>
</amp-experiment>

    Пример 2: <amp-analytics> 

    <amp-analytics type="gtag" data-credentials="include">
  <script type='application/json'>
  {
    "vars": {
      "gtag_id": "<GA_MEASUREMENT_ID>",
      "config" : {
        "<GA_MEASUREMENT_ID>": {"groups": "default"}
      },
      "xid": "<EXPERIMENT_ID>",
      "xvar": "VARIANT(<EXPERIMENT_NAME>)"
    },
    "extraUrlParams": {"exp": "${xid}.${xvar}"}
  }
  </script>
</amp-analytics>

    Замените >GA_MEASUREMENT_ID, EXPERIMENT_ID и EXPERIMENT_NAME значениями, полученными на предыдущих этапах.

Пример: использование редактора CSS-кода Оптимизации

С помощью редактора CSS-кода Оптимизации можно менять стиль варианта страницы, добавляя соответствующий AMP-префикс к каждому правилу CSS. Например, к следующему коду для "variant 1":

.selector {
  property: value
}

перед селектором необходимо добавить следующий префикс:

body[amp-x-[experimentName]="1"] .selector {
  property: value
}

Замените experimentName значением, полученным на этапе 2 выше.