html - 我可以多次使用 <h1> 标记，一个用于桌面，另一个用于移动吗？

Question

我正在使用 bootstrap-3，html-5。我的问题是，我可以使用 <h1> 吗？在同一页面中多次标记？我正在使用一个 <h1>用于桌面和另一个 <h1>对于手机。搜索问题后我有点困惑。任何人都可以正确地建议我正确的方法吗？

我的代码如下。代码对 SEO 友好吗？

<div class="row">
  <div class="col-sm-12 hidden-xs">
      <h1>Header in Desktop</h1>
  </div>
  <div class="col-xs-12 hidden-lg hidden-md hidden-sm">
      <h1>Header in Mobile</h1>
  </div>
</div>

Answer 1

是的，当然，您可以在单个页面中使用多个 h1 标签，对于 SEO，谷歌也确认使用多个 h1 标签是可以的。只要每个 h1 标签都在 html5 的元素内，它就是有效的(页面上的第一个 h1 除外，它不需要特定的包装器)。

目前，Google 提供两种不同的排名，一种针对桌面设备，另一种针对移动设备。所以有两个 h1 标签就可以了(一个用于桌面，一个用于移动)。

您可以像这样使用您的代码。

<div class="row">
  <div class="col-sm-12 hidden-xs">
      <h1>Header in Desktop</h1>
  </div>
  <div class="col-xs-12 visible-xs-*">
      <h1>Header in Mobile</h1>
  </div>
</div>

hidden-xs 表示它在桌面、平板电脑上可见，在移动设备上隐藏。

visible-xs-* 表示它将在移动设备上可见，而在平板电脑、台式机等所有其他设备上隐藏。