Отслеживание браузера в приложении Facebook в Google Analytics

На наших мобильных гаджетах установлено большое количество приложений – игры, читалки книг, редакторы фото, утилиты, бизнес-программы и многое другое. А те, кто пользуется социальными сетями, наверняка, имеет в своем арсенале стандартный набор тулз, в числе которых Facebook, Intagram, Twitter, VK и т.д.

Возьмем Facebook. По статистике в течение дня пользователи заходят в приложение 5-8 раз. За это время они скроллят более 40-50 постов, пишут 5-10 сообщений друзьям и коллегам, просматривают видео суммарно на 7-10 минут. Некоторые и того больше.

Посты, которые содержат ссылки, при переходе на внешний ресурс не открываются в отдельном приложении, а открываются в окне Facebook Mobile Browser (In-App). Это выглядит примерно так:

Facebook In-App Browser
Facebook Mobile Browser

Браузеры In-App имеют легкий функционал. Они не позволяют пользователям добавлять закладки, не имеют изменяемой адресной строки и не дают открывать ссылки в новых окнах (только дают перейти в другой браузер).

Facebook очень популярен в США. Его браузер в приложении теперь является третьим по величине мобильным браузером в стране, следуя за Safari (из-за доминирования iOS от Apple) и Chrome (из-за Android), согласно исследованию аналитической фирмы Mixpanel (август 2018 года) и TechCrunch (июнь 2018).

Facebook In-App Browser
Рейтинг мобильных браузеров в США

Да и в России он набирает обороты. В связи с этим задача по отслеживанию трафика в In-App браузерах аналитическими инструментами становится все более актуальной.

Браузер – это просто окно, которое обеспечивает ограниченную функциональность просмотра, как подпроцесс приложения, которое его открыло. Это позволяет передавать информацию из окна браузера в само родительское приложение. В нашем случае, в Facebook. «Браузеры в приложении» — это не настоящие браузеры, а окно веб-просмотра, запущенное из основного браузера вашего устройства.

Каждый раз, когда вы нажимаете на ссылку из Facebook в своем мобильном приложении, это означает, что вы используете встроенный браузер, если только вы не отключили его. А раз ссылка не открывается в отдельном браузере, то как отследить откуда же на самом деле был переход в Google Analytics?

Увы, но Analytics неправильно сообщает информацию о браузерах в приложении. Если мы откроем отчет Аудитория – Технологии — Браузер и ОС, то увидим только Safari (In-App):

Facebook In-App Browser
Технологии — Браузер и ОС

А как же другие встроенные браузеры? Safari передает строку in-app в имя браузера, а другие — нет. В Google Analytics окно веб-просмотра на основе Chrome — это просто Chrome. То есть Google Analytics не сообщает вам о действии пользователя – перешел он к вам на сайт из приложения или просто браузера.

В качестве примера я сделал тестовый заход по utm-метке в Facebook Mobile Browser с мобильного устройства, получив такой User-Agent:

Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/16A366 [FBAN/FBIOS;FBAV/195.0.0.44.99; FBBV/128807583;FBDV/iPhone8,4; FBMD/iPhone;FBSN/iOS;FBSV/12.0;FBSS/2;FBCR/Beeline; FBID/phone;FBLC/ru_RU;FBOP/5;FBRV/129729940]

Facebook In-App Browser
User-Agent после захода с Facebook Mobile Browser

Как я получил такую строку в отчетах GA? О настройке передачи данных User-Agent в качестве пользовательского параметра можно узнать здесь. Статья называется «User-Agent — «Hello, world!» для веб-аналитиков».

На сайте whatismybrowser.com можно проанализировать любой User-Agent (и свой собственный), и увидеть информацию по устройству, браузеру и версии операционной системы в удобочитаемом виде. Например, для моего запроса выше – это Facebook App на iOS 12 версии с iPhone SE:

Facebook In-App Browser
Мои данные с whatismybrowser.com

Следы, оставленные In-App браузером Facebook, выдают себя в строке User-Agent FBAV и FBAN.

  • FB_IAB / FB4A; FBAV — Android
  • FBAN — iOS

Но они не будут доступны в Google Analytics, если не передавать их в качестве пользовательских метрик.

Например, построив специальный отчет с параметром «Социальная сеть», мы можем отследить некоторое количество сеансов, которые, скорее всего, были совершены из браузера в мобильном приложении Facebook, Instagram, VKontakte и т.д.

Facebook In-App Browser
Специальный отчет по браузерам, социальной сети и типам устройств

Однако быть абсолютно точным нельзя. Ведь, например, у нас есть «Источник или канал» facebook / cpc, который имеет большое количество платных переходов с рекламы на наш сайт. И мы лишь знаем только, что это были переходы из браузера Safari (In-App) с мобильных устройств. Но так ли это на самом деле? И да, Google Analytics умеет определять переходы из социальных сетей. Отчеты по ним доступны в «Источники трафика – Социальные сети».

Зачем так делают?

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

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

В-третьих, Facebook так получает больше информации о своих пользователях, создавая «аудиторные слепки». Если ссылка открывается в Chrome, то Facebook теряет этого пользователя и больше ничего не узнает о нем, пока он не вернется назад. Но если пользователь открывает ссылку в браузере Facebook, то это позволяет собирать и хранить все его данные.

Facebook – это интернет-рекламная компания, и их главным конкурентом является Google. Google сейчас — доминирующая платформа интернет-рекламы. Как только пользователи покидают Facebook, они не только прекращают предоставлять данные в Facebook, но и начинают предоставляют их своему сопернику.

Google = Android и предустановленные браузеры Chrome на многих типах устройств. Apple = iOS и предустановленный на собственных устройствах браузер Safari. А что же делать Facebook? Приходится как-то выкручиваться.

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

Для того, чтобы определить, является ли In-App браузер Facebook, или переход из Facebook на ваш сайт был осуществлен через обычный (полный) браузер, необходимо в Google Analytics создать пользовательский параметр, в который будет передаваться значение, определенное из User-Agent.

Для этого:

1. создаем пользовательский параметр через «Администратор – Ресурс – Пользовательские определения – Специальные параметры — +СПЕЦИАЛЬНЫЙ ПАРАМЕТР»;

2. Название – Браузер In-App, Область действия — Сеанс, Активная. Нажимаем «Сохранить»;

3. Запоминаем индекс параметра. Он нам понадобится чуть позже. В нашем примере «4».

Facebook In-App Browser
Специальный параметр с индексом 4

4. Определяем, какой код отслеживания Google Analytics у вас установлен на сайте (библиотека analytics.js или gtag.js). От этого будет зависеть способ реализации и добавление дополнительных строчек кода в GA. В моем примере – это Universal Analytics.

5. Добавьте в код сайта следующие строчки:

Для библиотеки analytics.js получим такой итоговый код:

Facebook In-App Browser
Итоговый код Google Analytics библиотеки analytics.js

где dimension4 – индекс вашего пользовательского параметра, который вы запомнили на 3 шаге.

Для библиотеки gtag.js используйте другую конструкцию через custom_map. Подробнее о специальных параметрах и показателях для gtag.js по ссылке.

Механика проста – если в User-Agent находятся строки с FBAN и FBAV, то это In-App браузер и Google Analytics отобразит «Facebook». В противном случае будет возвращено значение «Нет».

Сохраняем изменения и отправляем на сервер. Если все сделали так, как описано, то данные будут передаваться в пользовательский параметр dimension. Проверить корректность передачи можно с помощью инструмента отладки GA Debugger.

Я сделал два захода:

  1. перешел по ссылке из Facebook с ПК браузера Chrome;
  2. перешел по ссылке из Facebook с iPhone SE браузера Facebook Mobile Browser (In-App).

В первом случае я получил ответ «Нет», а во втором «Facebook».

Facebook In-App Browser
Проверка работы кода в GA Debugger

В кастомном отчете Google Analytics будет доступна следующая информация о моих переходах:

Facebook In-App Browser
Результат работы

Вот и все! Теперь вы можете легко отслеживать браузер в приложении Facebook (Mobile Browser) в Google Analytics.

Примечание: представленный фрагмент кода определяет только Facebook. Но та же самая логика может быть применена и к другим In-App браузерам, открываемым в мобильных приложениях. Вам просто нужно найти уникальные строки, указанные в User-Agent. Для их определения можете использовать whatismybrowser.com.

Данный материал взят за основу со статьи stateofdigital.com и oko.uk

Понравилась статья? Подписывайтесь на социальные сети:

Остались вопросы? Задайте их на Кубик.Ком

Yakov Osipenkov | 06.11.2018
Отслеживание браузера в приложении Facebook в Google Analytics
4 Всего оценок: 4

КонтактыКонтакты

Связаться

Контактная информация

Выпускник МГТУ им. Баумана (2008-2014), ведущий специалист по контекстной рекламе компании ConvertMonster (2016-2017), сертифицированный специалист по Google AdWords и Google Analytics, автор курса Google Adwords 3.0 (2017) и публикаций учебных материалов по продуктам Google на seonews.ru, searchengines.ru, webpromoexperts.com.ua, менеджер по мобильному трафику в компании Kokoc (2017-март 2018)

По вопросам консультаций, сотрудничества и предложений:

Skype

yasha.cmteam

E-mail

ya.osipenkov@icloud.com

Обратная связь

Имя:

E-mail:

Тема письма:

Ваше сообщение:


УслугиУслуги

Чем полезен
E-Commerce

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Responsive Design

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Web Security

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Behold appear first, kind all i saying fowl man itself moved which every open shall moved subdue appear.

I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

  •  Contabile computer 100% responsive design
  •  Contabile laptop 100% responsive design
  •  Contabile tablet 100% responsive design
  •  Contabile smartfon 100% responsive design

I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

E-COMMERCE

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

КонтактыКонтакты

Связаться

Контактная информация

Выпускник МГТУ им. Баумана (2008-2014), ведущий специалист по контекстной рекламе компании ConvertMonster (2016-2017), сертифицированный специалист по Google AdWords и Google Analytics, автор курса Google Adwords 3.0 (2017) и публикаций учебных материалов по продуктам Google на seonews.ru, searchengines.ru, webpromoexperts.com.ua, менеджер по мобильному трафику в компании Kokoc (2017-март 2018)

По вопросам консультаций, сотрудничества и предложений:

Skype

yasha.cmteam

E-mail

ya.osipenkov@icloud.com

Обратная связь

Имя:

E-mail:

Тема письма:

Ваше сообщение:


УслугиУслуги

Чем полезен
E-Commerce

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Responsive Design

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Web Security

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Behold appear first, kind all i saying fowl man itself moved which every open shall moved subdue appear.

I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

  •  Contabile computer 100% responsive design
  •  Contabile laptop 100% responsive design
  •  Contabile tablet 100% responsive design
  •  Contabile smartfon 100% responsive design

I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

E-COMMERCE

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Creative Ideas

Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.

Бесплатные уроки по контекстной

рекламе и веб-аналитике!

Решаем задачи

Общаемся

Делимся

Спасибо за подписку!