Смарт-баннеры: из мобильного веба в приложение (для маркетологов)

Подготовьте мобильную версию сайта к первому показу смарт-баннеров

1. В AppsFlyer в боковом меню выберите Вовлечение > Из веба в приложение > Смарт-баннеры > К смарт-баннерам.
2. Нажмите Начать. Мастер настройки проведет вас через все необходимые шаги (см. ниже). Для настройки других рабочих областей сайта см. ниже
3. Введите имя рабочей области сайта.
4. Нажмите Создать. Откроется рабочая область сайта. 
5. Копируйте фрагмент кода баннера. 
6. Внедрите фрагмент кода на свой сайт. Это нужно сделать один раз для каждого сайта.
   • Как добавить код через Google Tag Manager, Adobe Tag Manager, Shopify, Wix, Squarespace или WordPress, читайте в статье Внедрение кода смарт-баннеров на сайт (для маркетологов).
   • Как добавить код через другие платформы или внести изменения в код в зависимости от задачи (например, чтобы добавить параметры, настроить диплинкинг, скрыть баннер или интегрировать PBA со смарт-баннерами, читайте в статье Внедрение кода смарт-баннеров на сайт (для разработчиков).
7. [необязательно] Скопируйте веб-ключ. Этот ключ уже есть во фрагменте кода.
8. Нажмите Продолжить.

Чтобы создать рабочие области сайта после первого раза

1. В AppsFlyer в боковом меню перейдите в раздел ВовлечениеИз веба в приложение > Смарт-баннеры > Студия.
2. Нажмите на меню опций. 
3. Выберите Новая рабочая область сайта.
4. Введите имя рабочей области сайта.
5. Нажмите Создать. Откроется рабочая область сайта. 
6. Копируйте фрагмент кода баннера. 
7. Внедрите фрагмент кода на свой сайт. Это нужно сделать один раз для каждого сайта.
   • Как добавить код через Google Tag Manager, Adobe Tag Manager, Shopify, Wix, Squarespace или WordPress, читайте в статье Внедрение кода смарт-баннеров на сайт (для маркетологов).
   • Как добавить код через другие платформы или внести изменения в код в зависимости от задачи (например, чтобы добавить параметры, настроить диплинкинг, скрыть баннер или интегрировать PBA со смарт-баннерами, читайте в статье Внедрение кода смарт-баннеров на сайт (для разработчиков).
8. [необязательно] Скопируйте веб-ключ. Этот ключ уже есть во фрагменте кода.
9. Нажмите Продолжить.

Группа баннеров содержит один или несколько баннеров. Здесь вы можете:

• Выбрать шаблон OneLink, используемый группой баннеров, в котором указаны мобильные приложения, на которые нужно перенаправлять посетителей вашего сайта.
• Задать определенную схему диплинкинга.
• Определить правила таргетинга, график, поведение и атрибуцию, используемые всеми баннерами в группе.
• Задать, какие страницы при их посещении активируют баннеры в группе.

Чтобы настроить или продублировать группу баннеров:

1. В AppsFlyer в боковом меню выберите Вовлечение > Из веба в приложение > Смарт-баннеры.
2. Чтобы настроить группу баннеров в первый раз
   1. Слева выберите Add Banner Group (Добавить группу баннеров).
   2. Выполните шаг 5 и далее.
3. Чтобы настроить дополнительные группы баннеров
   1. Перейдите на вкладку Studio.
   2. Нажмите + Новый.
   3. Выполните шаг 5 и далее.
4. Чтобы продублировать группу баннеров
   1. Нажмите на значок Дублировать рядом со значком удаления.
5. Введите уникальное имя для группы баннеров. Оно должно отражать тему, в рамках которой эти баннеры объединены в группу (например, рекламируемое приложение).
6. Выберите шаблон OneLink для группы баннеров.
7. [необязательно] Задайте схему URI для группы баннеров в качестве резервного варианта для пользователей универсальных ссылок и Android App Links. Она редко оказывается нужна, так как по умолчанию значение берется из шаблона OneLink. Задавайте этот параметр для группы баннеров, только если вам нужно значение, отличное от указанного в шаблоне.
8. В основном и резервном параметре Attributed sources (Атрибутированные источники) укажите, каким источникам будут атрибутироваться новые установки при переходе с этой группы баннеров. 
   
   Примечание по пересылке идентификатора клика: FBCLID, GCLID, WBRAID и GBRAID автоматически пересылаются на исходящий URL, если они доступны на входящем URL. Для идентификаторов кликов Google, если параметр "ключевое слово" также найден, он помещает значение ключевого слова в исходящий URL в качестве значения af_keywords.
   

   Обратитесь к следующей таблице, чтобы выбрать оптимальный вариант для настраиваемой ссылки.

   Вариант	Когда выбирать	Комментарии
   Использовать параметры UTM	Выбирайте, если большинство неорганических посетителей попадают на мобильную версию сайта из источников с параметрами UTM.	◦ Имя медиа-источника (pid) = UTM_Source ◦ Кампания (c) = UTM_campaign ◦ Если параметры UTM_source или UTM_campaign отсутствуют, в качестве резервных используются статические имена.
   Использовать параметры входящей ссылки атрибуции	Выбирайте, если большинство неорганических посетителей попадают на мобильную версию сайта из рекламных сетей с оплатой за клики, использующих ссылки атрибуции AppsFlyer.	◦ Все доступные параметры из входящих ссылок атрибуции AppsFlyer добавляются к ссылке смарт-баннера.   ◦ Если параметр задан и во входящей ссылке атрибуции AppsFlyer, и в смарт-баннере, то в окончательной настраиваемой ссылке приоритет имеет значение, указанное во входящей ссылке.
   Добавить другой параметр атрибуции	Если требуется, укажите дополнительные данные атрибуции, связанные с сайтом. Это позволит более детально анализировать каждую установку.	Так, для сайтов электронной коммерции можно создать идентичные настраиваемые ссылки по каждой категории товаров, которые будут отличаться значениями параметра af_adset (например, для фруктов "af_adset=fruit").
   Использовать параметры атрибуции по умолчанию	◦ Выбирайте, если: ▪ большинство посетителей мобильной версии сайта являются органическими. ▪ Неорганические пользователи не попадают на сайт из рекламных сетей с оплатой за клики или из источников с параметрами UTM. ◦ Вы можете настроить значения параметров.	Важно! Рекомендуется выбирать параметры UTM или входящей ссылки атрибуции, т. к. заданные по умолчанию параметры атрибуции смарт-баннеров в любом случае используются в настраиваемой ссылке как резервный вариант на случай, если имена медиа-источника, кампании или канала будут недоступны.

9. [Рекомендуется] Задайте значение используемого по умолчанию параметра атрибуции Channel name (Имя канала), чтобы все установки после перехода со смарт-баннера атрибутировались указанному каналу. Это позволяет агрегировать информацию из нескольких медиа-источников по одному каналу в когортном отчете, на обзорном дэшборде, в отчете об удержании пользователей и т. д.
   
   
10. [Необязательно] Включите Ретаргетинг, если вы планируете использовать группу баннеров для регистрации повторных вовлечений пользователей, кликнувших по баннеру. Подробнее о ретаргетинге см. в руководстве по атрибуции ретаргетинга.

    Важно!

    Чтобы ретаргетинг работал, необходимо:

    • Включить ретаргетинг для приложения

    Имеющиеся пользователи, которые переходят с баннера по ссылкам на базе OneLink без ретаргетинга (UA), также запускают приложение и имеют такой же пользовательский интерфейс. Однако их повторные вовлечения регистрируются как регулярные сессии, что значит, что невозможно измерить успех собственной медиа-кампании.

11. [Необязательно] Включите опцию Игнорировать активных пользователей для ретаргетинга и укажите окно неактивности. К ссылкам в группе смарт-баннеров добавится параметр af_inactivity_window=[количество дней], и все пользователи, выполнявшие действия в течение указанного периода, будут игнорироваться с точки зрения ретаргетинга.
12. Задайте интервал повторного вовлечения, чтобы определить, в течение какого времени после повторного вовлечения внутренние события приложения пользователя будут атрибутироваться медиа-источнику ретаргетинга.
    • Это значение можно задавать в днях (от 1 до 90), часах (до 23) или даже на весь период использования приложения.
    • Окно повторного вовлечения добавляется в ссылку с помощью параметра af_reengagement_window.
13. [Необязательно] Задайте значение параметра Dismissal behavior (Поведение после закрытия), т. е. минимальный временной интервал между закрытием пользователем одного баннера в группе и возможностью повторного показа этого баннера этому пользователю. Выберите один из вариантов:
    • По времени: 1 час, 1 день или 1 неделя.
    • Следующая сессия: то есть сессия, которая происходит в другой вкладке или в другом окне после того, как пользователь закрыл баннер.
    • Никогда: баннер больше не отображается. Внимание:
      • Если пользователь очищает кэш браузера или открывает сайт в режиме приватного просмотра, параметр Dismissal behavior (Поведение после закрытия) сбрасывается.
      • Поведение после закрытия применяется именно к тому баннеру, который пользователь закрыл. Другие баннеры в группе по-прежнему могут отображаться.
14. [Необязательно] Задайте значение параметра Ограничение частоты показов.  Ограничение частоты показов определяет, сколько раз каждый баннер в группе баннеров может быть продемонстрирован уникальному пользователю. Вы можете выбрать либо Без ограничений (когда баннеры показываются всегда), либо Ограничить число показов баннеров.

    Например, если группа состоит из трех баннеров, а ограничение частоты установлено на единицу, то каждый баннер в группе будет появляться один раз для каждого пользователя. В этом сценарии после трех посещений пользователь увидит все три баннера в группе. Однако, начиная с четвертого посещения, пользователь больше не увидит ни одного баннера из этой группы. При установке ограничения частоты на два раза каждый баннер в группе будет показан дважды для каждого пользователя, что в общей сложности потребует шести посещений, чтобы увидеть все баннеры в группе.

15. [Необязательно] Определите, в какой операционной системе показывать баннеры:
    • Все мобильные ОС.
    • Только Android или только iOS.
16. [Необязательно] Определите время активации группы баннеров: незамедлительно (по умолчанию) или задайте кампанию, ограниченную по времени.
17. [Необязательно] Задайте Locations (Местоположения), для которых активируется группа баннеров.
    1. Чтобы показывать эту группу баннеров всем пользователям, выберите опцию Worldwide (Во всем мире). При необходимости можно исключить посетителей из других регионов или стран.
    2. Чтобы показывать эту группу баннеров пользователям из одного или нескольких конкретных местоположений, выберите Pick specific location (Выбрать конкретное местоположение).
18. [Необязательно] Задайте значение параметра Показывать на страницах, определяющего, посетители каких страниц будут видеть эту группу баннеров:
    • [По умолчанию] Показать на всех страницах сайта. Внимание: Рекомендуем настроить показ на всех страницах хотя бы для одной группы баннеров в качестве резервного варианта.
    • Показать на определенных страницах: укажите, что должна или не должна содержать страница или URL-адрес для отображения баннеров.
      • Возможные варианты:
        • Конкретная страница: укажите хост и/или путь к странице, на которой будет показан баннер. Любые введенные запросы не будут приняты во внимание. Пример: http://www.example.com/path?query
        • Путь URL и запрос: укажите путь и/или запрос, определяющий, будет ли показан баннер. Пример: path?query. Внимание: Не вводите URL-адрес целиком, например http://www.example.com/path?query. Укажите только путь и/или запрос.
      • С помощью операторов И/ИЛИ можно добавить до 15 условий.
      • В случае конфликта между условиями баннер не отображается.
19. Нажмите Create Banner Group (Создать группу баннеров).
20. [Необязательно] Чтобы снова отредактировать группу баннеров, наведите курсор на пункт Targeting & behavior (Таргетинг и поведение) и нажмите Edit (Редактировать).

Таргетинг и поведение

На панели таргетинга и поведения отображаются параметры, которые вы настроили для этой группы баннеров. Для изменения этих настроек нажмите на значок редактирования.

Чтобы создать баннер в группе баннеров:

1. Нажмите Новый баннер, чтобы перейти на страницу редактирования баннеров.
2. Задайте имя баннера.
3. Создайте креатив:
   1. Нажмите Создать креатив, чтобы задать креатив для баннера.

      Откроется окно для выбора шаблона баннера.

      
   2. Наведите курсор мыши на Creative template (Шаблон креатива) и нажмите Create (Создать), чтобы войти на страницу настройки креатива .
   3. Настройте все элементы креатива для смарт-баннера. Для этого выберите элементы по названию или нажмите на них в окне предварительного просмотра. Примечание. Не все элементы доступны в каждом шаблоне.
      • Название
      • Описание
      • Звезды рейтинга
      • Кнопка закрытия
      • Призыв к действию
      • Логотип приложения
      • Фон
      • Расположение баннера
      • Внешние отступы баннера (для настройки размера баннера)
      • Прозрачность устройства
      • Используйте изображения следующих форматов: jpeg, jpg, png. Примечание. Формат webp не поддерживается.  Рекомендации по изображениям:

        Тип шаблона	Максимальный размер файла	Пропорции	Высота изображения	Длина изображения
        Минимальный	300 КБ	3:1 (ширина х высота)	70 px	Подгоняется под устройство
        Стандартный	300 КБ	3:1 (ширина х высота)	70 px	Подгоняется под устройство
        Расширенный	300 КБ	9:4 (длина x высота)	110 px	Подгоняется под устройство
        Множественный выбор	300 КБ	9:4 (длина x высота)	110 px	Подгоняется под устройство
        Рекламный	300 КБ	4:5 (длина x высота)	300 px	Подгоняется под устройство
        Наложение с множественным выбором	300 КБ	9:4 (длина x высота)	110 px	Подгоняется под устройство
        Рекламная вставка	700 KB	9:16 (длина x высота)	Подгоняется под устройство	Подгоняется под устройство

   4. Нажмите Просмотр, чтобы увидеть креатив баннера и проверить, как он отображается на различных устройствах. Внимание: Баннеры в активных кампаниях могут немного отличаться от изображений для предварительного просмотра.
   5. Если нужно внести изменения, нажмите Назад в редактор.
   6. Нажмите Done (Готово), чтобы вернуться на страницу настройки баннера.
4. [Необязательно] Добавьте настраиваемые параметры атрибуции. Например, ad_adset и af_ad. Внимание: Параметры pid, c и channel нельзя добавить на уровне баннера, потому что они относятся к уровню группы баннеров.
5. Когда новый креатив готов и сохранен, баннер получает статус активного. Используйте переключатель Статус для переключения между статусами Активный и Приостановлен.
6. Нажмите Сохранить все, чтобы сохранить изменения, или Сохранить все и закрыть, чтобы сохранить изменения и закрыть страницу настройки баннера.

Когда креатив готов, перед публикацией и активацией для пользователей его нужно протестировать.

Чтобы протестировать креатив смарт-баннера:

Необходимые условия: убедитесь, что фрагмент кода смарт-баннера интегрирован в код вашего сайта.

1. На странице Тестирование креативов укажите ссылку на вашу страницу, в которую интегрирован SDK для смарт-баннеров (см. раздел Смарт-баннеры для разработчиков).
2. Нажмите Создать.
3. Копируйте созданную ссылку и отправьте ее на тестовое устройство или сканируйте QR-код тестовым устройством. Ссылка или QR-код должны привести вас на веб-страницу, на которой отображается баннер с креативом.
4. Нажмите Edit Creative (Редактировать креатив), чтобы вернуться к настройке креатива, или нажмите Done (Готово), чтобы сохранить креатив.

На странице показателей эффективности можно просмотреть и сравнить данные об эффективности всех ваших смарт-баннеров за период до 90 последних дней.

Просмотр страницы показателей эффективности:

1. В AppsFlyer в боковом меню выберите Вовлечение > Из веба в приложение > Смарт-баннеры > Эффективность.
2. Выберите диапазон дат для просмотра данных об эффективности. Период по умолчанию составляет 7 последних дней.
3. [Необязательно] Включите переключатель Показывать только активные баннеры. Если эта функция включена, данные для баннеров, которые приостановлены или неактивны в данный момент, не отображаются, даже если они были активны в течение выбранного диапазона дат. Данные об эффективности отображаются для выбранного диапазона дат.

Данные об эффективности любого баннера можно просмотреть за последние 7 дней.

Чтобы увидеть данные об эффективности баннера:

1. В AppsFlyer в боковом меню выберите Вовлечение > Из веба в приложение > Смарт-баннеры > Студия.
2. Выберите рабочую область сайта и группу баннеров, по которым хотите просмотреть показатели.
3. Наведите курсор на любой из баннеров в этой группе. Будут показаны данные об эффективности за прошедшую неделю.

При определении того, какой смарт-баннер следует отображать (и следует ли), AppsFlyer принимает во внимание следующее:

• Установлены ли для групп баннеров правила (поведение после закрытия, ограничение частоты показов, расположение, показ на определенных страницах и т. д.)?
• Соответствует ли конечный пользователь условиям правила, и нужно ли ему показывать баннер?

Если ответ на оба вопроса утвердительный, то есть правила установлены и пользователю можно показывать баннер, AppsFlyer выбирает баннер для отображения, как описано в следующей таблице.

Вы можете выполнить А/В-тестирование баннеров путем сравнения их эффективности на дэшборде эффективности. Для получения дополнительных данных, связанных с атрибуцией, рекомендуется добавить параметры af_adset, af_ad или другие параметры атрибуции (кроме pid, c и channel) с уникальным значением для каждого креатива баннера или группы баннеров. Используйте эти параметры для сравнения эффективности каждой группы баннеров на дэшборде и в отчетах AppsFlyer.

Это связано с ограничением частоты показов, настроенным для группы баннеров. Ограничение частоты показов определяет, сколько раз баннер может быть продемонстрирован уникальному пользователю. Например, если частота показов ограничена тремя, а пользователь заходит на сайт четыре раза, в первые три визита он будет видеть баннер, а начиная с четвертого — не будет. Ограничение частоты показов можно отключить. Выберите значение или отключите ограничение частоты показов.

Да. Вы можете установить для баннера свой собственный шрифт, используемый на вашем сайте, следуя инструкциям в хабе разработчиков.

• Для реализации требуется участие разработчика сайта.
• Шрифт будет применяться ко всем баннерам на сайте и ко всем текстовым элементам внутри баннера.
• Шрифт нельзя просмотреть в редакторе креативов.
• После внедрения протестируйте свой баннер с креативом.
• Если шрифт отображается некорректно, пересохраните баннер в редакторе креативов.

Да, вызвав следующие две функции в вашем смарт-скрипте:

• showBanner
• updateParams

Да. Чтобы его настроить, добавьте параметр deep_link_value одним из следующих способов:

• В пользовательском интерфейсе AppsFlyer добавьте статический настраиваемый параметр атрибуции при настройке баннера.
• Чтобы добавить параметр в URL-адрес перед показом баннера, используйте additionalParams в функции showBanner.
• Чтобы добавить параметр в URL-адрес после показа баннера, используйте функцию updateParams.

Убедитесь, что разработчик реализовал необходимое поведение deep_link_value.

Нет. Если вы не знаете, установлено ли приложение у пользователя, рекомендуем выбрать универсальный призыв к действию. Например: «Перейти к приложению» или «открыть приложение».

Да. Если в исходной входящей ссылке есть параметр utm_source или pid, исходный URL-адрес сохраняется в течении сессии просмотра, и параметры применяются к исходящему URL-адресу баннера.

Да. Если смарт-баннеры реализуются в приложении-обертке / гибридном приложении, и страница баннера загружается из приложения (а не из веб-браузера), не используйте функцию showBanner, поскольку она показывает баннер в приложении. Вместо нее используйте функцию hideBanner.

Мы стремимся к тому, чтобы все ваши пользователи, включая людей с ограниченными возможностями, могли получить полный доступ к смарт-баннерам и взаимодействовать с ним.

Поэтому мы стараемся обеспечить доступность наших смарт-баннеров в соответствии со стандартом WCAG 2.1, предоставляя соответствующие атрибуты HTML в элементах смарт-баннеров.

Однако определение соответствующих требований доступности для вашего использования смарт-баннеров является исключительно вашей обязанностью. Вы несете полную ответственность за то, чтобы используемые вами смарт-баннеры были доступны для всех пользователей в соответствии с требованиями к доступности веб-сайтов.

Обратите внимание, что различные изменения в смарт-баннерах могут повлиять на их соответствие требованиями доступности, в том числе, например, путем изменения цветов и размеров внутренних элементов баннера.