Блог Yagla » Аналитика » Установка кода Google Analytics: часто задаваемые вопросы

Установка кода Google Analytics: часто задаваемые вопросы

 

В этой статье вы узнаете как работает код Google Analytics, где его лучше размещать и что при этом учитывать.

Что такое код отслеживания

Трекинг-код Google Analytics – фрагмент кода JavaScript, который собирает и отправляет данные об уникальных посещениях страницы в Google Analytics. Чтобы активировать его работу, скопируйте эту часть кода, замените UA-XXXXX-X на ваш ID:

Установка кода Google Analytics — асинхронный код

Вставьте ее в шаблон страницы сайта перед закрывающим тегом </head>.

Так выглядит асинхронный код отслеживания Google. Однако, не все так просто. Остается много вопросов. Далее – ответы на самые частые из них.

Где лучше размещать код отслеживания Google?

Прежде всего выясните, какую версию вы используете. Если это синхронный код, его устанавливают обычно внизу страницы. Рекомендуем обновить код до асинхронного и поместить в «голову» документа, а не в конец «тела».

Если поместить код отслеживания в конец «тела» документа? В книгах / блогах пишут, что это делает сайт быстрее

Обязательно ли, чтобы код отслеживания был в блоке <body>? Ответ очевиден – да. Можно поместить новый код в любую часть страницы, но в 99% случаях асинхронный код лучше размещать в «голове» документа. Есть исключения, о них позже.

Из многих ресурсов вы узнаете, что код Google стоит добавлять внизу страницы, это ускоряет работу сайта. Это неактуальная информация, она верна для синхронного кода. Google выпустил асинхронный код отслеживания еще 1 декабря 2009 года.

Как работает синхронный код

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

Если помещать такой код в «голову» документа, скорость загрузки сайта зависит от того, как быстро Google отправляет вам его. Если это занимает 10 секунд, посетитель ждет открытия страницы еще дольше.

Поэтому лучшее место синхронного кода – блок <bottom>. По крайней мере при сбое в загрузке файлов Google страница загрузится первой.

Как работает асинхронный код

Это уже своеобразный многоленточный конвейер: элементы страницы грузятся независимо от того, когда вы получаете данные от Google. Код отслеживания «движется» на собственной ленте, а сайт – на своей. Он работает в фоновом режиме без приостановки загрузки следующих за ним скриптов.

Асинхронный код в «голове» страницы загружается только один раз, затем сохраняется в кэше (сохраняется на ваш компьютер, и не нужно загружать его повторно), что ускоряет процесс.

Почему асинхронный код лучше?

Так как асинхронный код начинает сбор данных на раннем этапе загрузки страницы, он учитывает «быстрых посетителей», которые перешли на страницу и закрыли ее до полной загрузки.

Это улучшает отслеживание данных в среднем на 5%, а на некоторых сайтах – на 10-20%. Если вы используете AdWords, асинхронный код работает быстрее – вы получаете более точные цифры о том, сколько уникальных пользователей посетили сайт.

Если код отслеживания еще не загрузился, но на странице происходят события, которые нужно фиксировать?

Эта проблема случается в обоих случаях. Иногда и асинхронный код «подвисает».

Решение – пользовательские переменные отслеживания. Даже если загрузка файла ga.js занимает время, они собирают данные о событиях на странице. В Google отправляются после полной загрузки кода. Схема не идеальная, но вы хотя бы не теряете информацию о действиях всех посетителей.

Обязательно ли переносить код в блок «head» для всех страниц? У меня их много, это займет кучу времени

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

Допустим, страница открывается примерно 10-20 секунд. С синхронным кодом – еще дольше из-за последовательной работы скриптов. Он может «притормозить» за это время. Если пользователь уходит до того, как увидит контент, вы потеряли посетителя. Он, вероятно, предпочтет другой сайт, который работает быстрее.

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

Асинхронный код в «голове» не замедляет загрузку элементов и работу самой страницы. Выгоды очевидны.

Когда не нужно размещать код в «голове» страниц?

Мы упомянули об исключениях. Одно из них – пользовательские переменные.

Пользовательские переменные отслеживания

Они всегда на странице в режиме ожидания очередного просмотра или другого события. 

Пользовательскую переменную можно установить в «голове» документа, и она активируется до того, как Google отправит код HTML. Но если разработчики построили страницу иначе и вы не хотите ничего менять, можно создать пользовательскую переменную где угодно. Удалите эту строку из асинхронного кода:

Установка кода Google Analytics — удаление строки при создании переменной

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

Да, это может снизить точность данных, если посетитель уходит сразу после загрузки страницы.

Отслеживание событий

Второе исключение – функция «Отслеживание событий». Когда происходит событие, сигнал идет к переменной отслеживания. Как учесть «быстрых» посетителей:

Установка кода Google Analytics — пример отслеживания события

1) Создаем переменную, устанавливаем в ключевом пространстве 1 (из 5). Называем ее «Статус». Устанавливаем значение «Logged In» – оно не изменится, пока не произойдет нужное событие.

2) Создаем событие, относим его к группе «Пользовательские» и определяем действие – «Загрузка страницы».

Варианта два: событие произошло и событие не произошло.

Для первого присваиваем ярлык, например 0 (может быть любое другое значение, удобное для вас).

Также устанавливаем значение для второго варианта (событие не произошло). 

Обновление кода до асинхронного изменит мои данные? Внезапный скачок в количестве посещений и что-то вроде того

Зависит от месторасположения прежнего кода, скорости и текущего числа загрузок страницы. Сложно предугадать, в какой степени изменятся данные.

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

Если я не обновлю код до асинхронного, продолжит ли сайт отслеживать данные?

Да. Основные функции – в том же файле ga.js. Но вы не сможете сохранять данные в кэше. Скорость загрузки и точность данных останутся на прежнем уровне. Поэтому выбор за вами.

Статья подготовлена по материалам lunametrics.com