Question

我为无知道歉但是，我很难确定何时改变我在H1-H6之间的标题。我正在尝试在codeacemy.com上自学代码，我的理解是为每个标题更改标题，例如：

<h1>Introduction</h1>
  <p>This is the intro</p>

<h2>Body</h2>
  <p>This is the body</p>

<h3>Conclusion</h3>
  <p>This is the conclusion</p>

代码学院希望我多次使用相同的标题（如下所示）是对还是错？我什么时候开始使用不同的标题？请帮助我澄清一下，这样我就可以更高效地了解我编写代码的使命。

Code Academy ex：

  <h2>Ethiopia</h2>
    <p>Ethiopian beans can be divided into 3 categories: Longberry, Shortberry, and Mocha. Longberry varieties consist of the largest beans and are often considered of the highest quality in both value and flavor. Shortberry varieties are smaller. The Mocha variety is a highly prized commodity. Mocha Harars are known for their peaberry beans that often have complex chocolate, spice and citrus notes.</p>
  <a href="#">Learn More about Ethiopia</a>
</li>
<li>
  <h2>Costa Rica</h2>
  <p>Costa Rican coffee beans are considered among the best in the world. Tarrazu is thought to produce the most desirable coffee beans in Costa Rica. In 2012, Tarrazu Geisha coffee became the most expensive coffee sold by Starbucks in 48 of their stores in the United States, using the Clover automated French press. The finest coffee is typically grown at altitudes of 1200 to 1700 meters.</p>
  <a href="#">Learn More about Costa Rica</a>
</li>
<li>
  <h2>Kenya</h2>
  <p>The acidic soil in highlands of central Kenya, just the right amount of sunlight and rainfall provide excellent conditions for growing coffee plants. Coffee from Kenya is of the 'Colombia mild' type, and is well known for its intense flavor, full body, and pleasant aroma with notes of cocoa and high grade coffee from Kenya is one of the most sought-after coffees in the world.</p>

Answer 1

h1通常用于页面的主标题。这表明此文本比其他文本更重要。 h2或h3可用于表示不太重要的文本的子标题。这一直持续到h6。

在您的示例中，所有国家/地区都位于h2标记中，表明它们在页面的语义中同样重要。

Answer 2

标题用于分割部分，就像您编写报告一样。例如https://www.w3.org/TR/html5/sections.html#headings-and-sections。

你应该重复你的文档代表相同“级别”的级别（例如h1） - 例如章节。

标题对辅助技术（即屏幕阅读器）非常重要，它允许视障人士“看到”您页面的结构。标有H1的部分将被视为最高级别的分组，H2将是其相关H1的子部分等。

Answer 3

Codeacademy是完全正确的。您可以多次重复使用相同的header-element。您可以使用CSS单独设置它们的样式。

另一件事是SEO（搜索引擎优化）。当您在标题标签中保留订单时，Google会喜欢它。不要从H1到H6进行大跳，然后再回到H2。只需像这样处理它：H1是整个页面的标题。 H2可用作物品的标题。 H3s是这些文章中的字幕。我经常只使用H1-H3。

Answer 4

可以这样想：<h1>标题是根标题，即页面的主标题。几乎总是只有其中一种。 <h2>个字幕是<h1>标题的直接子级。可能会有很多。同样，<h3>字幕是其前面的<h2>标题的子代。 <h4>是<h3＆gt;的孩子等等。或者把它放在代码中：

<h1>The main title</h1>
<h2>Subtitle</h2>
<p>A paragraph of text goes here...</p>
<h3>Sub-subtitle</h3>
<p>The nitty gritty of this section.</p>
<h2>Another Subtitle</h2>
<p>Some more text...</p>
<h2>Conclusion</h2>
<p>The final paragraph.</p>

这为我们提供了这样的标题层次结构：

<h1>
- <h2>
  - <h3>
- <h2>
- <h2>

上面的HTML并没有使预期的文档结构显而易见。最好更清楚地表明我们的意图。我将使用HTML5 <section>元素来执行此操作：

<h1>The main title</h1>
<section>
    <h2>Subtitle</h2>
    <p>A paragraph of text goes here...</p>
    <section>
        <h3>Sub-subtitle</h3>
        <p>The nitty gritty of this topic.</p>
    </section>
</section>
<section>
    <h2>Another Subtitle</h2>
    <p>Some more text...</p>
</section>
<section>
    <h2>Conclusion</h2>
    <p>The final paragraph.</p>
</section>

Answer 5

标题标签之间的区别基本上都与外观有关。

您可以使用不同的标题标记在浏览器中整理您的文字。

html标题级别以及何时使用它们

5 个答案: