Должен ли я помещать Google Analytics JS в <head> или в конец <body>?

123

Google дает мне кусок javascript и говорит мне включить его в <head>.

Могу ли я поставить это в конце <body>или возникнут какие-то побочные эффекты, если я это сделаю?

Питер Холл
источник
3
Разве они не говорят поставить его перед закрывающим тегом </body>? Или это изменилось?
Marko

Ответы:

155

Помещение его в конце <head>раздела помогает обеспечить отслеживание ваших показателей, даже если пользователь не позволяет странице завершить загрузку.

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

Напрямую из Google:

Одним из основных преимуществ асинхронного фрагмента является то, что вы можете разместить его вверху HTML-документа. Это увеличивает вероятность того, что маяк отслеживания будет отправлен до того, как пользователь покинет страницу. Обычно в <head>раздел помещают код JavaScript , и мы рекомендуем размещать фрагмент внизу раздела для лучшей производительности.

См. Справку Google Analytics : добавьте код отслеживания прямо на свой сайт.

Крис Аргуин
источник
8
Так нормально, если я положу его внизу? Я предпочитаю, чтобы мои страницы загружались быстро, помещая все внизу (и css вверху для правильного рендеринга) - отредактируйте - его грубо помещать там js.
2
Да, это нормально; У меня действительно есть микс, но в основном я перешел на то, чтобы поставить его на первое место по указанным причинам.
Chris Arguin
6
Почему это преимущество? Мне кажется, что я не хочу считать частичные загрузки страниц, потому что такие пользователи, по сути, говорят, что они сделали ошибку, придя туда в первую очередь. Даже когда они действительно хотят быть там, я не хочу заставлять их ждать лишнюю миллисекунду, чтобы увидеть мой контент.
Мелинда Грин
3
Частичная загрузка страницы также может означать для владельца сайта что-то, что ему нужно исправить. Представьте, что кто-то входит в ваш магазин только для того, чтобы понять, что их ввела в заблуждение извне. Вы бы хотели исправить свою рекламу, чтобы исправить это.
Optimus
2
Небольшое обновление: вместо того, чтобы в конце <head>, страница, на которую указывает ссылка, теперь говорит: «Добавьте тег сразу после открывающего тега <head> на каждой странице».
Брэндон
6

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

Касабланка
источник
2
Зачем вам обнаруживать пользователя, который частично загружает вашу страницу и уходит за миллисекунды?
Жоао Пиментел Феррейра,
@ JoãoPimentelFerreira, потому что это также ценная информация, вы можете измерить, какой% просмотров был таким
jangorecki
3

Вы можете разместить его в любом месте страницы и запускать где угодно на странице, будь то в заголовке или в теле. Но, согласно поддержке Google ( добавьте код отслеживания прямо на свой сайт ), рекомендуется добавить его в тег заголовка, вставить его непосредственно перед закрывающим </head>тегом.

Следующий абзац из хорошей статьи, объясняющий, зачем помещать код в тег заголовка

Просмотр страницы записывается только после загрузки этого кода. Таким образом, чем раньше вы загрузите код, тем раньше будет записан просмотр страницы. Допустим, у вас есть большая страница блога, и она загружается медленно: на загрузку всего уходит от 10 до 20 секунд. Если ваш код Google не запускается до конца страницы, он может задерживаться, как и старый неасинхронный код, используемый для хранения ДРУГИХ строк кода. Только вот сейчас он показывает код отслеживания. Если посетитель вашего сайта попадает на страницу, а затем покидает ее до того, как код отслеживания запускает просмотр страницы, вы теряете этого посетителя. Теперь они становятся новым прямым посещением любой страницы сайта, на которую они попали. Это может сделать все данные на вашем сайте неверными.

Субодх Гулакс
источник
0

В голове, непосредственно перед закрывающим тегом </ head>, у вас не возникнет проблем с проверкой вашего сайта в Инструментах для веб-мастеров.

Sezhers
источник
0

Добавление следующего кода (известного как «фрагмент отслеживания JavaScript») в шаблоны вашего сайта - это самый простой способ начать работу с analytics.js.

Код следует добавить в верхней части тега и перед любым другим скриптом или тегами CSS, а строку UA-XXXXX-Y следует заменить идентификатором свойства (также называемым «идентификатором отслеживания») Google Analytics. свойство, которое вы хотите отслеживать.

<!-- 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 -->

Приведенный выше код выполняет четыре основных действия:

  1. Создает элемент, который запускает асинхронную загрузку библиотеки JavaScript analytics.js с https://www.google-analytics.com/analytics.js

  2. Инициализирует глобальную функцию ga (называемую очередью команд ga ()), которая позволяет запланировать выполнение команд после загрузки библиотеки analytics.js и ее готовности к работе.

  3. Добавляет команду в очередь команд ga () для создания нового объекта трекера для свойства, указанного в параметре UA-XXXXX-Y.

  4. Добавляет еще одну команду в очередь команд ga () для отправки просмотра текущей страницы в Google Analytics.

Миля Миятович
источник
Давайте немного посмотрим, потому что называть это «очередью команд» слишком много. Сжатый углифицированный код принимает несколько аргументов, которые он использует для распаковки некоторых вещей и получения дескриптора связанной Array.pushфункции. ga«Функция» полностью , что связано push. Таким образом, немедленные вызовы могут быть оптимизированы: вместо создания пустого массива, если он не найден ( []), заполните его массивами «аргументов» для каждого gaвызова: [['create', 'UA-XXX', 'auto'], ['send', 'pageview']]
amcgregor
-3

Код, который вы всегда должны добавлять в верхней части тега, перед любым другим скриптом или тегами CSS, а строку 'UA-XXXXX-Y'следует заменять свойством ID(также называемым «идентификатором отслеживания») свойства Google Analytics, которое вы хотите отслеживать.

Паял Дарьяни
источник
2
Это не отвечает на вопрос. Вопрос в том, каковы побочные эффекты того, что вы не делаете то, что вы говорите.
Питер Холл