Библиотека 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 -->
Приведенный выше код выполняет 4 основные задачи:
- Создает элемент
<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.