如何在标题中以语义正确的方式标记其他信息？ HTML5？

Question

我正在努力学习语义，而我喜欢思考网站各部分的含义，它变得越来越复杂......

无论如何，如果我在标题中有额外的信息框（想象一下高标题，使用nav和h1 +附加文本来解释网站的内容及其工作方式）。包含它的逻辑/语义元素是什么？

<figure id="info_how">
    <h2>Share what you will do for money, at the marketplace for small services!</h2>
    <p>bibendum auctor, nisi elit consequat ipsum. Duis sed amet <strong>nibh vulputate cursus</strong> sit.</p>

    <a id="button_start" href="#">Start selling</a>
    <a id="button_how" href="#">How does it work?</a>
</figure>

我在想，但是......

Answer 1

根据 the specs ：

  

figure元素表示一些流内容，可选地带有   标题，这是自包含的，通常被称为a   来自文档主流的单个单元。

     

该元素可用于注释插图，图表，照片，   代码清单等。这包括但不限于内容   从文件的主要部分提到，但可以，   在不影响文件流动的情况下，远离它   主要内容，例如到页面的一侧，到专用页面，或   到附录。

所以figure对我来说听起来不错！

此外，我会在<figcaption>代码中放​​置<h2>元素：

<h2><figcaption>Share what you will do for money, at the marketplace for small services!</figcaption></h2>

因为它确实代表了图中的“标题”。