一家SEO公司建议我们更改HTML元标记的顺序，以使<title>和<meta name="description">为前两个。他们说这是为了确保搜索引擎可以利用这两个标签。我一直觉得文档头内部的标签顺序并不重要。我错了吗？真的有搜索引擎会假设前两个标签始终是title和description，如果不是，则放弃寻找它们？

评论

另请参见“堆栈溢出”：在页面顶部添加链接和元标记的顺序会产生不利影响吗？

#1 楼

你是对的。这些标签的顺序对于SEO无关紧要。他们只需要在场。谁说的话显然是毫无头绪的（当然经营SEO业务。很遗憾）。

评论

您能否提供资料或案例研究？

– s_hewitt
2011年4月4日15:41
只是基于经验的意见。这是有关该主题的SearchEngineWatch讨论-顺序无关紧要：forums.searchenginewatch.com/showthread.php?t=16452

–恰兰
2011年4月4日在18:53

#2 楼

尽管出于SEO的目的，顺序可能并不重要，但在考虑其他方面（例如安全性，内容（字符）显示或加载速度）时，事实并非如此。最好这样大致安排页面的头部（假定HTML5为语法）：

<head>


到目前为止，在文档中，您不应该使用任何非ASCII字符，因此字符编码尚未成为问题。但是，一旦打开该head标签，使用非ASCII字符的可能性就会明显增加。因此（假设您没有以编程方式或在服务器级别上声明字符编码），则应将下一条语句作为字符编码声明。这也满足了可能会嗅探字符编码语句的解析器/浏览器/代理：

  <meta charset="utf-8">


Bootstrap的人员推荐以下两个（X-UA-Compatible和viewport）（截至v3.3.4）。尽管我几乎肯定这些建议是基于性能的，但我要说的大多数都是推测性的：

  <meta http-equiv="X-UA-Compatible" content="IE=edge">


如果您正在考虑与设备无关的设计/开发（包括较小的非桌面用户代理），您应该包括以下内容：

  <meta name="viewport" content="width=device-width, initial-scale=1">


最后，标题：

  <title>Ingenious Page Title</title>


接下来，您将在标题后尽快提供CSS（它们之间没有“白天”）：

  <link rel="stylesheet" href="stylesheet-1.css">
  <link rel="stylesheet" href="stylesheet-2.css">


如果您使用的是页面级样式，则应在此处使用。这主要是由于CSS的“级联”性质：即具有相同程度的特异性的最后一个样式声明（例如，两个针对段落p的语句）。为了使覆盖外部样式更容易（即，不使用更大的特殊性或!important），您应该在外部样式（<link>）之后放置页面级样式。另外，通常不建议在页面级样式中使用@import指令，因为这会阻止同时下载其他样式资产：

  <style>body{color:black;}</style>


指出最适合放置meta标签，网站图标和其他内容的位置。有争议的是，将在大多数元标记之前加载图标或类似资产（例如iOS应用程序图像），因为它可以更快地开始下载这些资产。

  <link rel="shortcut icon" href="favicon.ico">
  <link rel="apple-touch-icon" href="apple-icon.png">
  <meta name="description" content="Some information that is descriptive of the content">
  <meta name="generator" content="Microsoft FrontPage 2002">


因为它会阻止/延迟渲染，所以如果您打算需要脚本，请在合理的时候延迟加载它们。如果它们必须在head中，则可以在关闭head（</head>）之前加载它们。如果以后可以加载它们，请将其放在body标记（</body>）关闭之前。

  <script src="script-1.js"></script>
  <script src="script-2.js"></script>
</head>


在大多数情况下，要特别注意订购顺序似乎并不重要考虑到索引漫游器（即搜索引擎蜘蛛）将占用整个页面，因此用于SEO的meta标签的数量会增加。否则，他们将如何索引页面的内容，或者以后再更新该索引？

对我来说值得注意的是，对于我们认为的所有信息以及我们在网络上找到的所有建议（甚至是（例如Google和Bing网站管理员工具等地方），像Amazon，Google和其他明显关注如此微不足道的性能提升的人的网站，则不遵循这些规则。

评论

尽管X-UA兼容，视口和Apple触摸图标在2010年仍相对较新，但都在使用中。 HTML5仅影响字符集声明的长度。当时，CSS，JS和图像流水线以及在应用CSS和JS之后重新（重新渲染）页面都是一个问题。尽管如此，我无法在一处（在html文档的头部之外）找到此信息，并且在遇到此问题后，在这里进行查找似乎很好。

– David Eldridge
15年5月20日在9:54
好的答案@DavidEldridge。但是，您介意更新答案以包含针对结构化数据的application / ld + json脚本吗？为了提高速度。最好放在哪里？我们应该将其视为外部JavaScript文件吗？

–布兰登·沃格特（Brendan Vogt）
17年1月10日在8:30


标头中的所有CSS不再是CWV的最佳实践。

–曼谷
20-10-5在19:07
@Bangkokian您是否在谈论使用