Javascript 在<;头>;你能安全地把谷歌标签管理器的代码?

Javascript 在<;头>;你能安全地把谷歌标签管理器的代码?,javascript,html,google-tag-manager,html5boilerplate,Javascript,Html,Google Tag Manager,Html5boilerplate,Google Tag Manager指示开发人员: 在页面的中将此代码[跟踪代码]粘贴为high 尽可能: (函数(w,d,s,l,i){w[l]=w[l]||【】;w[l]。推送({'gtm.start]:新建) Date().getTime(),事件:'gtm.js'});var f=d.getElementsByTagName[0], j=d.createElement,dl=l!=“数据层”?“&l=”+l:“”;j.async=true;j.src= 'https://www.goo

Google Tag Manager指示开发人员:

在页面的
中将此代码[跟踪代码]粘贴为high 尽可能:


(函数(w,d,s,l,i){w[l]=w[l]||【】;w[l]。推送({'gtm.start]:新建)
Date().getTime(),事件:'gtm.js'});var f=d.getElementsByTagName[0],
j=d.createElement,dl=l!=“数据层”?“&l=”+l:“”;j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(窗口、文档、'script'、'dataLayer'、'GTM-XXXXXXX')

我的问题是,代码的正确位置有多高?正确的意思是,能够在95%以上的浏览器上运行,没有问题/警告/错误,和/或符合HTML最佳实践

它能在打开
标签后立即打开吗?只要它在某个地方的
部分,它真的很重要吗

作为参考/示例,下面是HTML样板。样板中跟踪代码的最佳位置是什么

<!doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="manifest" href="site.webmanifest">
        <link rel="apple-touch-icon" href="icon.png">
        <!-- Place favicon.ico in the root directory -->

        <link rel="stylesheet" href="css/normalize.css">
        <link rel="stylesheet" href="css/main.css">
    </head>
    <body>
        <!--[if lte IE 9]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
        <![endif]-->

        <!-- Add your site or application content here -->
        <p>Hello world! This is HTML5 Boilerplate.</p>
        <script src="js/vendor/modernizr-{{MODERNIZR_VERSION}}.min.js"></script>
        <script src="https://code.jquery.com/jquery-{{JQUERY_VERSION}}.min.js" integrity="{{JQUERY_SRI_HASH}}" crossorigin="anonymous"></script>
        <script>window.jQuery || document.write('<script src="js/vendor/jquery-{{JQUERY_VERSION}}.min.js"><\/script>')</script>
        <script src="js/plugins.js"></script>
        <script src="js/main.js"></script>

        <!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->
        <script>
            window.ga=function(){ga.q.push(arguments)};ga.q=[];ga.l=+new Date;
            ga('create','UA-XXXXX-Y','auto');ga('send','pageview')
        </script>
        <script src="https://www.google-analytics.com/analytics.js" async defer></script>
    </body>
</html>

你好,世界!这是HTML5样板

window.jQuery | | document.write(“”) ga=function(){ga.q.push(参数)};ga.q=[];ga.l=+新日期; ga(“创建”、“UA-XXXXX-Y”、“自动”);ga('send'、'pageview')
谷歌标签管理器不依赖于任何插件,在原始JavaScript中运行。为防止冲突,应将其尽可能置于
标记中的高位

考虑到它是独立的并且没有任何冲突,将其放在
之后、任何
标记之前是完全安全的。谷歌的搜索算法将读取整个DOM,试图找到你的
标记,因此它们不必是
部分的第一件事

在上面的示例中,我建议将您的Google Tag Manager代码放在
之间(我通常将其放在自己的网站上)

除此之外,不要忘记,它允许Google标记管理器在页面上禁用JavaScript的情况下运行。这应该直接放在您的
标签后面:

<noscript>
  <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXX" height="0" width="0" style="display:none;visibility:hidden"></iframe>
</noscript>


希望这有帮助!:)

谷歌建议将其尽可能高的原因主要是为了提高跟踪的准确性。代码段在页面中的位置越高,加载速度越快。将代码段放在页面下方,可能会错过跟踪在加载代码之前离开页面的用户。它还可能导致错误地报告在代码加载之前从您的主页导航出去的站点访问者作为用户导航到的页面的直接访问者

谷歌的A/B测试工具Optimize也很重要。更快地加载代码段可确保Optimize将尽快加载页面的正确版本

<> P>但是,还有其他的因素你可能需要考虑,如这里所讨论的:例如:

…因此,用于指定字符集的任何元标记(无论是
还是简单地
)必须在文件的前1024字节内才能生效。因此,如果要在文档中包含字符编码信息,则应该将标记放在文件的早期,甚至可能放在
元素之前

<> P> >尽管<<强> > 在“代码< >代码>头/代码>标签后面紧贴您的跟踪代码片断,但您可能需要考虑将其放在最重要的<代码>元< /代码>标签之后。这些标签通常不会花费很长时间来加载,也不会延迟您的跟踪代码

但是,出于上述原因,您将跟踪代码放在
标题中的什么位置确实很重要。因此,如果要加载许多脚本、样式表等,那么将标记管理器代码放在更高的位置,而不是放在最后

<!doctype html>
<html class="no-js" lang="">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title></title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Tracking Code -->

    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/main.css">