Search code examples
htmlforumsemantic-markupmicrodata

Semantic markup for a forum's topic page


I have a large forum, you know, topics with n messages per topic. First message uses to have the main content of the topic, but sometimes some messages down are very useful too. One common case is when the first message is a question and then you get the answers.

Should the topic be an article element and the messages article elements inheriting from the topic article? In this case, should the first message appear in each message's page to be a reference? And then, how to deal with duplicated content?

An example:

<article itemscope itemtype="http://schema.org/Article">
   <header>
      <h1 itemprop="name">My topic title</h1>
   </header>
   <article itemscope itemtype="http://schema.org/Article">
      <div class="author" itemprop="author">Message author's name</div>
      <div class="message-body" itemprop="articleBody">
         message text bla bla
      </div>
      <p class="post-date" itemprop="dateModified" content="date">date</p>
   </article>
   <article itemscope itemtype="http://schema.org/Article">
      <div class="author" itemprop="author">Message 2 author's name</div>
      <div class="message-body" itemprop="articleBody">
         message 2 text bla bla
      </div>
      <p class="post-date" itemprop="dateModified" content="date">date</p>
   </article>
   ... more messages ...
</article>

Is this a good practice for semantics, accessibility and SEO? Is there any better choice I can do?


Solution

  • Each post should be an article. Nothing else should be an article. So the title of the thread should be part of the first post, not of a container.

    You can either nest the replies in the first post, or have all posts on the same level. HTML 5.2 about article:

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

    For the author pane, you could use the footer element.

    Instead of using Schema.org’s Article type, you might want to use the more specific DiscussionForumPosting type (which inherits from Article).

    Nested

    <article>
      <h2>My topic title</h2>
      <footer>…</footer>
      <div>…</div>
    
      <article>
        <h3>Reply: My topic title</h3>
        <footer>…</footer>
        <div>…</div>
      </article>
    
      <article>
        <h3>Reply: My topic title</h3>
        <footer>…</footer>
        <div>…</div>
      </article>
    
    </article>
    

    Same level

    <article>
      <h2>My topic title</h2>
      <footer>…</footer>
      <div>…</div>
    </article>
    
    <article>
      <h2>Reply: My topic title</h2>
      <footer>…</footer>
      <div>…</div>
    </article>
    
    <article>
      <h2>Reply: My topic title</h2>
      <footer>…</footer>
      <div>…</div>
    </article>