【问题标题】:Meteor - what can and can't be included in the HEAD tag in 2016Meteor - 2016 年 HEAD 标签中可以包含什么和不可以包含什么
【发布时间】:2016-03-05 03:40:10
【问题描述】:

Meteor 中的head 标记中可以包含什么,不可以包含什么。

我可以像往常一样在静态 .html 中包含所有标签吗?

例如:

  • metaviewport, description, keywords, author, charset, http-equiv
  • link: canonical, favicons(icon,apple-touch-icon..), manifest, mask-icon...
  • open:graph, twitter:cards

我读到我不应该在head 中直接包含 GA scriptFB 像素 script。 2016年还是这样吗?

【问题讨论】:

标签: meteor


【解决方案1】:

如果有点啰嗦,请见谅

简短回答:静态应用范围的元标记很好,动态/每页不是,分析 - 除非是单页网站,否则不要标题

如果你有一个路由器和多个页面,你不能在<head> 模板中包含正常的元标记,如果你希望它们在每页的基础上为 SEO 机器人进行更改,这意味着对 seo/og/ 的明确拒绝只需将它们放在标题中的 twitter 标签(除非您是单页站点)。

这样做的原因是,一旦完成初始页面加载,头部在 Meteor 上是静态的,因此始终具有您指定的标签。当您定义多个 <head> 标签时,Meteor 会将所有标签捆绑在一起,从而导致访问您页面的机器人出现问题,例如重复的 og 标签。元标记不支持把手,因此您无法动态设置它们。

您可以将头部用于视口和所有页面中的静态内容。

您可以动态更改页面标题,但这对于 SEO 标签来说不是很好,因为机器人通常只会看到第一次点击(此时未加载标题)然后加载链接而不是点击应用程序。

onAfterAction: function(){
  document.title = "My pages name";
}

跟踪

对于分析,您可以在头部加载脚本,但您希望从路由器执行跟踪事件。从 GA Universal Analytics 页面获取代码

//GOES IN HEAD
(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','//www.google-analytics.com/analytics.js','ga');

//GOES IN ROUTER
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');

您可能想要使用一个包来避免正确设置的所有复杂性 - 其中很多 here 但我不能说哪些支持 fb 像素,但大多数支持 ga 开箱即用。我一直在用 reywood 的,它看起来很结实

如果您还使用移动应用程序,请记住为您的所有跟踪域设置允许规则。

meta 的解决方法

您需要实现类似可蜘蛛的东西来加载页面服务器端的静态实例以发送给机器人 - 这对于搜索引擎之类的搜索引擎非常有用,如果您的页面内容不匹配,它们可能会惩罚您。

如果您更关心 facebook/twitter 能够在没有创建静态页面的服务器开销的情况下进行抓取,那么有一个包允许您在第一页加载时将元数据直接注入您的头部,但它与 Iron 路由器相关联如果那不是您的路由器,那就不太好...@ 987654322@(免责声明-我确实制作了这个包,但它是为了解决这个问题而不必考虑服务器端渲染所以我想我会把它扔在那里)

流路由器 如果您使用的是流路由器,我认为您可以使用kadira:dochead package 来设置元数据,而不是使用服务器端渲染

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2014-08-01
    • 2012-04-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多