我应该使用多个 h1 还是不使用 h1 的多个 h2 ？

Question

在一个显示导师列表的网页中，当前的 HTML 代码：

<div id="tutors">

 <h1>Tutors</h1>
 <div class="tutor">
  <h2>John</h2>
  <p>...</p>
 </div>

 <div class="tutor">
  <h2>Mary</h2>
  <p>...</p>
 </div>

 <div class="tutor">
  <h2>David</h2>
  <p>...</p>
 </div>

</div>

现在，由于某些原因，需要在页面中删除当前由 h1 包裹的单词 Tutors。我能想到3个选择：

1. 使用css来隐藏它。
2. 只要去掉它，页面就会有h2 没有 h1。
3. 删除它，并将所有 h2 更改为 h1。

哪一种更合适？

Answer 1

#3：删除它，并将所有 h2 更改为 h1。

1. 对于 SEO，隐藏文本是不受欢迎的，因为它可以被视为黑帽 SEO。除非您打算将标题替换为包含文本“Tutors”的图像。
   • 我应该使用“alt”还是 CSS 包含徽标文本？
   • 使用 CSS 隐藏文本以进行 SEO
   • 如果您坚持隐藏文本，辅助功能/SEO 友好的 CSS隐藏
2. 除非事先有
   

   ，否则不能有

   。

   • 标题、标题层次结构和文档大纲

Answer 2

根据页面的用例，其中任何三个听起来都是有效的选项。也就是说，在考虑这个问题时，我想到了一些事情：

• SEO：似乎有一些观点认为标签内容的选择可能会影响搜索引擎排名。
• 无样式渲染：如果由于某种原因，页面可能在没有附带 css 表的情况下渲染，请注意页面上默认渲染的效果以及您可能希望它如何执行
• 请注意，有新的常见标签，例如“section” ' 在 HTML 5 中，这可能适合您的页面，并且在语义上比 H 标记更清晰

Answer 3

没关系。

如果您使用 jQuery 来显示和隐藏内容，那么它对 SEO 没有影响。当您在所有实际意义上查看源代码时，搜索引擎会看到您所看到的内容。反正你也没有做什么偷偷摸摸的事情。

参考我关于堆栈溢出的帖子 如果我使用 Ajax 完成页面上的所有操作，我该如何进行搜索引擎优化？

因为您所做的是在搜索之后引擎已经出于所有实际目的考虑了它。

Answer 4

这些选项都不是好的 SEO。

1. 这是有风险的，也是一种不好的做法。搜索引擎已经变得非常擅长确定文本何时被隐藏，如果它们发现像
   

   这样的权重较大的标签被隐藏，则会损害您的排名。

2. 您永远不应该跳过标头层次结构中的任何一步（没有
   

   没有

   等）。此外，它们应始终按重要性降序排列。

3. 每个页面都应该有一个
   

   并且它应该是第一个标题标签。就 SEO 权重而言，它们的顺序为

为什么这个标题首先需要隐藏？这似乎是对页面内容的一个很好的描述。

Answer 5

也许您应该考虑将这些项目格式化为定义列表，例如：

<div id="tutors">
    <h1>Tutors</h1>
    <div class="tutor">
        <h2>John</h2>
        <p>...</p>
    </div>
    <div class="tutor">
        <h2>Mary</h2>
        <p>...</p>
    </div>
    <div class="tutor">
        <h2>David</h2>
        <p>...</p>
    </div>
</div>

变为：

<dl title="Tutors">
    <dt>John</dt>
        <dd>...Description here...</dd>
    <dt>Mary</dt>
        <dd>...Description here...</dd>
    <dt>David</dt>
        <dd>...Description here...</dd>
</dl>

然后将 CSS 类和样式应用于元素，以便为有视力的用户美化它。只是一个想法。

Answer 6

这是一个偏好。您应该始终将演示文稿和结构分开，所以我想说只需将其注释掉，然后将其放在那里即可。如果你隐藏它，这实际上就不是演示，因为它永远不会被看到。所以3是最合适的。