2

在搞乱 Twitter 标记时，我刚刚发现他们将 HTML 标记放置在其中data-expanded-footer，它看起来像这样：

data-expanded-footer="<div class="js-tweet-details-fixer tweet-details-fixer">
    <div class="js-tweet-media-container "></div>
      <div class="entities-media-container " style="min-height:0px">
    </div>
  <div class="js-machine-translated-tweet-container"></div>
  <div class="js-tweet-stats-container tweet-stats-container ">
  </div>
  <div class="client-and-actions">
    <span class="metadata">
      <span title="12:11 PM - 10 Apr 13">12:11 PM - 10 Apr 13</span>
           &middot; <a class="permalink-link js-permalink js-nav" href="/****/status/****" >Details</a>
    </span>
  </div>
</div>"

  1. 这是一个有效的 html 元素吗（这个属性是 div 类的子元素tweet）

  2. 如果这是有效的，这是一个好主意，如果不是，为什么？

  3. 这对 SEO 有那么糟糕吗？

编辑

刚刚尝试从 data 属性解析 HTML 并且它有效，但是如果你想让它像这样工作，应该有一个单引号：

http://jsfiddle.net/burimshala/crEXU/

如果您在标记中使用双引号离开 twitter，并且如果您使用双引号打开 data-markup 属性，则它不起作用：

http://jsfiddle.net/burimshala/crEXU/1/

Twitter如何解析这个？

4

2 回答 2

1

data-*属性是有效的 HTML5，请参阅：

http://ejohn.org/blog/html-5-data-attributes/ 和http://www.w3.org/TR/2010/WD-html5-20101019/elements.html

它的主要用途是数据存储（在这种情况下是 HTML 代码）。如果这是一个好主意，这一切都取决于您的情况，但它肯定是有目的的。当我想“克隆”动态内容时，我经常使用它。

这是一个“隐形”元素，所以 SEO 不应该受到真正的影响，但是我不是这方面的专家。

于 2013-04-10T10:25:18.960 回答
0

声明很好，我不会说它对 SEO 不利，因为其他 SEO 因素，如用于 SEO 的微格式（hCard、vCard 或架构）都使用 HTML 属性。只要您的网站对 W3C 有效，并且没有任何标记错误（在此处查看）：http: //validator.w3.org/，那么您就可以很好地使用 SEO。

对 SEO 友好的唯一小问题是，如果您的 HTML 标记代码总是胜过网站 TEXT。记住 SEO 总是最好至少 51% 的网站是文本和其他 HTML 属性。

于 2013-04-10T11:14:29.640 回答