如果元标记存在于文档正文中会发生什么?

Sal*_*n A 56 html seo templates asp-classic meta-tags

我正在开发一个ASP应用程序,代码,模板和文件的组织方式不允许我改变body标签之外的任何内容.所以我在考虑在体内插入元标记 - 就像这样:

<!-- FEW ASP INCLUDES -->
<html>
    <head>
    <!-- FALLBACK TITLE AND DESCRIPTION -->
    <title>Default Title</title>
    <meta name="description" content="Default Description">
</head>
<body>
    <!-- SOME HTML MARKUP -->
    <div class="dynamic-content">
        <!-- InstanceBeginEditable name="dynamic-content" -->
        <!-- THIS IS WHERE I CAN WRITE ASP CODE -->
        <title><%= Page.Meta.GetTitle( yada, yada ) %></title>
        <meta name="description" content="<%= Page.Meta.GetDescription( yada, yada ) %>">
        <!-- InstanceEndEditable -->
    </div>
    <!-- SOME MORE HTML MARKUP -->
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

我想知道将meta标签放在HTML文档的正文中有多好.它如何影响:

  1. 搜索引擎
  2. 浏览器

kan*_*gax 42

根据HTML4.01,这当然是无效的.META标签只允许在HEAD中使用(就像TITLE一样),所以通过将它放入BODY,你实际上是在创建一个无效的标记.

从粗略测试中,似乎某些浏览器(例如Firefox 3.5和Safari 4)在创建文档树时实际上将这些元素放入HEAD中.这并不奇怪:众所周知,浏览器会容忍并试图解释各种破坏的标记.

无效的标记很少是个好主意.浏览器的非标准处理可能会导致各种难以处理的渲染(和行为)不一致.而不是依赖浏览器猜测,最好遵循标准.

我不知道搜索引擎如何对这样的标签汤做出反应,但我不想冒险尝试找出:)也许他们只解析HEAD标签以获取某些信息,并且会完全跳过你的BODY包含的标签.或许他们认为这些是恶意赌博尝试和包含此类标记的黑名单页面.谁知道.

底线 - 尽可能避免这种情况.

  • 如果您正在使用HTML5**,只要存在`itemprop`属性,就允许在`<body>`标记内使用`<meta>`标记.参见[spec](http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-meta-element). (40认同)
  • 叹了口气,我将重新安排所有代码.任何有助于减轻这一过程痛苦的建议都将受到赞赏. (2认同)

小智 29

最重要的是当DOCTYPE禁止时尽可能避免这种情况.我认为这在HTML5中是绝对允许的,在使用微数据的情况下非常有用.示例:http://schema.org/Event


Joh*_*ood 6

我不会这样做.这不是那些标签的去向,搜索引擎可能会将其视为垃圾邮件.如果您可以重新组织母版页,则始终可以在head部分中添加contentplaceholder.我完成了以下工作:

<asp:ContentPlaceHolder ID="HeadTags" runat="server" />
Run Code Online (Sandbox Code Playgroud)

通过这种方式,您可以在页面上添加您喜欢的任何内容:

<asp:Content ID="Whatever" ContentPlaceHolderID="HeadTags" runat="server" >

    <meta ... >

</asp:Content>
Run Code Online (Sandbox Code Playgroud)

  • 不,可能不会。但就糟糕的答案而言,它不仅在生产中有效,而且还有四票。 (2认同)

nul*_*ity 6

如果您的目标是搜索引擎优化,那么遵循标准并将所有元标记放入其中可能是一个好主意<head>.但是,就浏览器行为而言,如果您将<meta>标记放入其中,<body>它们仍将起作用.我决定在符合标准的文档中使用多个<meta http-equiv="refresh"/>标签和<title>标签来测试它.

我的测试结果:

Firefox 18,Firefox 3.6,Firefox Mobile,Chrome 24,Chrome for Mobile,Opera 12,IE6,IE8,IE10:

  • <meta>处理了身体中的所有标签.
  • <title>处理文档中的第一个标记,即使它在正文中.后续<title>标记被忽略.
  • 最早的元刷新指令生效,暗示两者都已处理完毕.

IE9:

  • 与上面相同,但<title>忽略了正文中的所有标记.
  • IE9标准模式下的IE10也表现得像这样.
  • IE8标准模式下的IE9与IE8相同,允许<title>在主体中使用1个标签.

那么,当您在体内使用元标记时会发生什么?总的来说,它们似乎工作得很好.meta标签可能会被处理,所以如果你不能把它们放在头部那么我就不会担心太多.


Sit*_*ram 6

元标记可以添加到 HTML 中的任何位置。

网络爬虫可以读取它们,但唯一的问题是当您必须通过 Facebook Messenger、Whatsapp 等某些应用程序共享您的页面时。

这些应用程序仅读取head 标签内存在的元标签。因此,如果放置在body 标记内,元标记的og:image、og:description属性不会被读取,因此在此类应用程序中共享时不会显示。

如果仅用于 SEO 目的,您可以在任何地方添加元标记,但建议仅添加内部head 标记