preambles/postscript 文章内多篇文章的语义标记

Question

作为与有关的项目的一部分，我需要在语义 HTML5 中标记嵌套文章。有一篇杂志文章，其中包含不同作者的一些短文以及一些编辑评论。在目前的 HTML4 版本中，它看起来像这样：

<div id="article">
    <h1>Main heading - a collection of texts</h1>

    <p id="intro">
        A general introduction to the whole collection by the editor.
    </p>

    <p class="preamble">
        A few words from the editor about the first text.
    </p>

    <h2>First text heading</h2>

    <p>First text. Lorem ipsum ...</p>

    <p class="author">
        Name of author of first text.
    </p>

    <div>*</div>

    <p class="preamble">
        A few words from the editor about the second text.
    </p>

    <h2>Second text heading</h2>

    <p>Second text. Dolorem ipsum ...</p>

    <p class="author">
        Name of author of second text.
    </p>

    <p id="postscript">
        Some final words about the whole collection by the editor.
    </p>
<div>

我在 HTML5 中一直在考虑类似的事情，但有些因素我根本不知道什么是最好的：

<article>
    <header>
        <h1>Main heading</h1>
        <ELEMENT>
            General introduction
        </ELEMENT>
    </header>

    <article>
        <header>
            <ELEMENT>
                Preamble
            </ELEMENT>
            <h2>
                Article heading
            </h2>
        </header>
        <p>
            Article text
        </p>
        <ELEMENT>
            Name of author
        </ELEMENT>
    </article>

    <div>*</div>

    <article>
        Second article ...
    </article>

    <ELEMENT>
        Postscript by editor
    </ELEMENT>
</article>

我应该使用带有 class 名称的 p 元素来表示各种介绍和后记，还是 aside 元素？还有别的吗？关于作者姓名的相同问题。 address 元素似乎不太合适。一个 footer 也许里面有一些其他元素 (?)?

编辑：偶尔也有一些图片，摄影师在文章末尾以小字体提及 ("Photo: John Doe.")。 footer?

中的元素 x

Answer 1

我觉得第一个问题应该是哪里放一篇文章的编辑评论。我可以想到三种方法：

(a) 编辑器在 article

的 header 中发表评论

<article class="author-text">
  <header class="editor-comment"></header>
</article>

(b) 嵌套在 article

中的 article 中的编辑注释

<article class="author-text">
  <article class="editor-comment"></article>
</article>

(c) section 中的编辑评论 article 作为子

<section class="editor-comment">
  <article class="author-text"></article>
</section>

您在问题中使用了 (a)。我不认为这是最好的选择，主要是因为这个 article 会包含来自不同作者的内容（它们不能一起工作），所以 "nearest article element ancestor" 表示作者身份的概念是行不通的。例如，它被 author link type and the address element.

使用

(b)和(c)没有这个问题。在 (b) 中，每个编辑都可以有自己的作者信息，在 (c) 中，编辑的作者信息将从父级获取article（包括整个文章集），所以编辑器每次都必须相同。

definition of article建议(b)是合适的：

When article elements are nested, the inner article elements represent articles that are in principle related to the contents of the outer article.

将此编辑评论 article 包含在 header 中是有意义的。

作者信息可以放在footer中。 Only if 此信息包含作者的联系信息，另外使用 address 元素（并且仅用于这些联系信息部分）。

因此，单个短文本可能如下所示：

<article class="author-text">
  <h1>First text heading</h1>
  <header>
    <article>
      <p>Editor comment</p>
    </article>
  </header>
  <p>First paragraph of the text …</p>
  <footer>
    <!-- text author information -->
    <!-- use 'address' here if appropriate -->
  </footer>
</article>

整个集合的结构可以是这样的：

<article class="text-collection">

  <h1>Main heading</h1>

  <p>General introduction</p>

  <article class="author-text"></article>
  <article class="author-text"></article>
  <article class="author-text"></article>
  <article class="author-text"></article>

  <p>Postscript by editor</p>

</article>

preambles/postscript 文章内多篇文章的语义标记

Semantic markup of multiple articles inside article with preambles/postscript

html

article

semantic-markup