HTML5中的<article>里面的<article>

Question

情節：在建立優惠券網站時，我意識到他們可以是不是頁面獨有的內容，但應該在<main><article> ..here..</article></main> 。

問題：僅僅因為w3schools聲明：

元素內的內容應該是文檔的唯一內容。 它不應包含跨文檔重復的任何內容。

但我有內容將在文章內。 例如，每次例如A coupon can be used by entering its code but a deal can only be activated by going to landing page. 這將在我將發布的每個“優惠券”帖子中重復出現。 所以我現在嘗試使用的是。

<main><article><main>Unique content</main>
<aside>A coupon can be used by entering its code but a deal can only be activated by going to landing page</aside></article></main>

但是又一次：

 Note: There must not be more than one <main> element in a document.
 The <main> element must NOT be a descendent of an <article>, <aside>,
 <footer>, <header>, or <nav> element.

那么在<main>和/或<article>格式化UN-UNIQUE內容的最佳方法是什么？

Answer 1

main標簽應該用於將這些article和aside元素分組。

<main>
    <article>
        The unique document content.
    </article>
    <aside>
        Related content for that document.
    </aside>
</main>

Answer 2

tl; dr - 用你的常識:)

這篇關於實際 w3網站的文章很好地概述了應該去哪里。 整體結構是：

<body>

  <header>
    <!-- header content goes in here -->
  </header>

  <nav>
    <!-- navigation menu goes in here -->
  </nav>

  <section id="sidebar1">
    <!-- sidebar content goes in here -->
  </section>

  <main>
    <!-- main page content goes in here -->
  </main>

  <aside>
    <!-- aside content goes in here -->
  </aside>

  <footer>
    <!-- footer content goes in here -->
  </footer>

</body>

選項1 - <section> s

他們繼續說<section> s，很明顯，可以包含多個<articles> ，但是也可以將<section> 放在 <article> ，例如定義引言或摘要：

<article>
  <section id="introduction">
  </section>

  <section id="content">
  </section>

  <section id="summary">
  </section>
</article>

因此，一種選擇是在文章中加入<section id="content">和<section id="terms"> 。

選項2 - <footer> s

對於這種內容，使用<footer>似乎是有效的。 你說它僅適用於作者，日期，類別，但w3在其<footer>規范中指出：

頁腳通常包含有關其部分的信息，例如誰編寫它，鏈接到相關文檔， 版權數據等。

您的文字是優惠券的條款和條件，可以視為與版權數據在語義上相似。 我認為這是一個判斷。

選項3 - <div> s等...

作為一個出局，在第一個鏈接中他們也會說<div> s ：

當沒有其他更合適的元素可用於分組內容區域時，您應該使用[a div] ...

因此，如果真的不清楚使用什么，另一種可能性是：

<article>
  Blah blah
  <div class="terms"></div>
</article>

摘要

說實話，在這之后，似乎沒有明確的答案，網站不太可能在一段時間內對文檔進行語義解析時變得非常嚴格，因為他們知道那里有很多人會完全做到這一點錯誤。 如果你只是在每篇文章的末尾加上一個帶有相同術語的<p> ，它可能不會產生任何真正的區別，因為主要文本是唯一的。

我個人認為，只要你運用常識並選擇一些不完全違背建議的東西，你就不會出錯。

Answer 3

我會用這樣的東西：

<main>
    <div class='article'>
        <article>Unique content</article>
        <footer>This coupon can be used only once..</footer>
    </div>
    <div class='article'>
        <article>Unique content</article>
        <footer>This coupon can be used only once..</footer>
    </div>
</main>

無論如何，我認為擁有多個<main>標簽比在<article>標簽中使用非唯一內容更糟糕。

您還可以考慮使用Schema.org正確映射您的內容與其他屬性（ itemprop ...）

Answer 4

按照WHATWG（后面的HTML活的文件標准非正式小組），還有在使用沒有問題的main內部因素article 。 HTML Living Document說：

對文檔中的主要元素的數量沒有限制。 實際上，在許多情況下，擁有多個主要元素是有意義的。 例如，具有多個文章元素的頁面可能需要指示每個這樣的元素的主要內容。

因此，你可以寫

<body>
 <header>My Page Header</header> 
 <main>
  <article><h1>My First Article</h1>
   <main>My first article's content...</main>
   <aside>A sidebar</aside>
  </article>
  <article><h1>My Second Article</h1>
   <main>My second article's content...</main>
   <aside>Another sidebar</aside>
  </article>
 </main>
</body>

但是， W3C HTML 5.3草案不允許這樣做，並聲明“文檔中不得有多個可見的主要元素”。

這是一個關於HTML中心元素的分歧的有趣案例。 驚人！ W3C作者與WHATWG背后的網絡/瀏覽器開發人員之間似乎再次存在分歧。 在這種情況下，我會選擇WHATWG。

HTML5中的<article>里面的<article>

問題描述

4 個解決方案

解決方案1
3 已采納 2014-12-02 09:18:45

解決方案2
2 2014-12-02 10:09:50

解決方案3
0 2014-12-02 09:16:56

解決方案4
0 2017-11-28 13:22:01

HTML5中的<article>里面的<article>

問題描述

4 個解決方案

解決方案1 3 已采納 2014-12-02 09:18:45

解決方案2 2 2014-12-02 10:09:50

解決方案3 0 2014-12-02 09:16:56

解決方案4 0 2017-11-28 13:22:01

解決方案1
3 已采納 2014-12-02 09:18:45

解決方案2
2 2014-12-02 10:09:50

解決方案3
0 2014-12-02 09:16:56

解決方案4
0 2017-11-28 13:22:01