Библиотека analytics.js, также называемая тегом Google Аналитики, – это библиотека JavaScript для отслеживания взаимодействий пользователей с сайтом. Ниже рассказывается, как добавить тег Google Аналитики на сайт.
Тег Google Аналитики
Тег Google Аналитики должен размещаться в начале раздела <head>
(перед другими скриптами и тегами CSS) и содержать идентификатор ресурса, который вы хотите отслеживать.
<!-- Google Analytics --> <script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-XXXXX-Y', 'auto'); ga('send', 'pageview'); </script> <!-- End Google Analytics -->
Приведенный выше код выполняет четыре основные задачи:
- Создает элемент
<script>
, который инициирует асинхронную загрузку библиотеки analytics.js со страницыhttps://www.google-analytics.com/analytics.js
. - Инициализирует глобальную функцию
ga
, называемую очередью командga()
. Эта функция позволяет запланировать выполнение команд после полной загрузки библиотеки analytics.js. - Добавляет в очередь команд
ga()
операцию, создающую объект отслеживания для ресурса, указанного с помощью параметра'GA_MEASUREMENT_ID'
. - Добавляет в очередь команд
ga()
указание отправлять в Google Аналитику информацию о просмотре текущей страницы.
При необходимости вы можете изменить последние две строки тега Google Аналитики (команды create
и send
) или добавить дополнительные команды для сбора информации о взаимодействиях. Однако вы не должны изменять код, загружающий библиотеку analytics.js и инициализирующий функцию очереди команд ga()
.
Альтернативный тег асинхронной загрузки
Описанный выше стандартный тег Google Аналитики загружается и выполняется асинхронно во всех браузерах, однако он не позволяет использовать доступную в современных браузерах возможность предварительно загружать скрипт.
Приведенный ниже тег не имеет этого недостатка, что позволяет немного повысить производительность в современных браузерах. Однако в Internet Explorer 9 и старых мобильных браузерах, которые не поддерживают атрибут async
, этот скрипт не будет загружаться асинхронно. Этот тег имеет смысл использовать только в том случае, если многие посетители просматривают ваш сайт в современных браузерах.
<!-- Google Analytics --> <script> window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date; ga('create', 'UA-XXXXX-Y', 'auto'); ga('send', 'pageview'); </script> <script async src='https://www.google-analytics.com/analytics.js'></script> <!-- End Google Analytics -->
Какие данные собирает тег Google Аналитики?
После того как вы добавите на сайт любой из приведенных выше тегов отслеживания, в Google Аналитику будет отправляться обращение pageview при каждом посещении ваших страниц. Это позволит вам собирать важные данные о сайте, в том числе узнать:
- общее время нахождения пользователя на вашем сайте;
- время пребывания пользователя на каждой из страниц и порядок их посещения;
- на какие внутренние ссылки нажимал пользователь (определяются по URL следующего сообщения pageview).
Кроме того, по IP-адресу, строке агента пользователя и данным первоначального анализа страницы, выполняемого скриптом analytics.js при создании нового объекта отслеживания, определяются в том числе следующие параметры:
- географическое местоположение пользователя;
- используемый им браузер и операционная система;
- размер экрана и наличие Flash или Java;
- сайт-источник перехода.
Дальнейшие действия
В большинстве случаев вам будет достаточно стандартных данных, собираемых с помощью тега Google Аналитики. Однако не исключено, что вам потребуется более детально анализировать действия пользователей.
Информацию о том, как отслеживать нужные взаимодействия с помощью тега analytics.js, вы найдете в других руководствах на этом сайте, но прежде чем реализовать те или иные функции, рекомендуем изучить статьи в разделе Основы на навигационной панели слева. В наших руководствах представлена как общая информация о библиотеке analytics.js, так и примеры кода.
Следующее руководство посвящено принципам работы analytics.js.