javascript - 使用语义类名与使用微数据

标签 javascript css html semantic-markup

<分区>

我一直在尽我所能只使用语义类名,但我最近对微数据和 SEO 的尝试让我想知道:两者都做有意义吗?考虑这两个表示事件的 HTML 片段:

使用 CSS 类:

<div class="event" itemscope itemtype="http://schema.org/Event">
  <h3 itemprop="name">Spinal Tap</h3>
  <div  class="description" itemprop="description">One of the loudest bands ever
  reunites for an unforgettable two-day show.</div>
  Event date:
  <time itemprop="startDate" datetime="2011-05-08T19:30">May 8, 7:30pm</time>
</div>

没有 CSS 类:

<div itemscope itemtype="http://schema.org/Event">
  <h3 itemprop="name">Spinal Tap</h3>
  <div itemprop="description">One of the loudest bands ever
  reunites for an unforgettable two-day show.</div>
  Event date:
  <time itemprop="startDate" datetime="2011-05-08T19:30">May 8, 7:30pm</time>
</div>

两者都代表相同的内容,而且都易于设置样式。我可以很容易地只使用属性选择器将样式应用于没有应用任何类型类的样式,除了可能应用某种额外的类(在这个例子中,可能是“即将到来的”或“过去的”之类的东西)。

考虑到这一点,当微数据已经添加了如此多的免费信息时,使用语义类还有什么优势吗?我唯一想到的是 Javascript 选择器的性能,但我不完全确定它的影响有多大。

最佳答案

如果我是纯粹主义者,使用类就像在说“如果是汽车就开它”。使用微数据就像说“如果它有大众汽车标志就开车”。大概你可以拥有一些没有微数据的东西,即“描述”,反之亦然。

如果您只使用类来设置段的样式,而不是类和微数据的混合,它也可能会更加一致。

在您的特定示例中,这可能无关紧要。在树的更高层的节点中,这些区别会更重要。

关于javascript - 使用语义类名与使用微数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21991952/

相关文章:

javascript - Concat 实际上是连接而不是添加到数组。 react native JavaScript

JavaScript:选择其他

javascript - 从事件菜单项 javascript 开始

html - 如何找到 :visited styles in firebug/FF Dev Tools

html - HTML 文档中的文件路径未定位 CSS 文件

html - 我正在尝试将变量从 Google 脚本传递到 HtmlOutputFromFile

javascript - 如何将 Vue 或 React 添加到现有的 Wordpress 站点?

javascript - setCustomValidity() 在 Chrome 浏览器中不起作用

css - 如何创建固定宽度的侧边栏和全宽内容

javascript - React Helm 不覆盖标题和元标记