Forum Moderators: open

Message Too Old, No Replies

Best HTML5 markup for a forum discussion

         

Selen

10:23 pm on Nov 30, 2014 (gmt 0)

10+ Year Member Top Contributors Of The Month



I have a question about the best HTML5 markup for a forum like WebmasterWorld. I mean the discussion pages. Is this the best structure? Or maybe <h1> should be right above <body> (but then none of the <article> would have h1).. Someone suggested to use <section> instead of <article> for posts, but it's not correct solution (because each post can be treated like a separate content).

Note: since {post1} and {post2} should discuss the same topic, they are enclosed by the main <article>. Is it the best way to do it...?

<html>
<body>

<article>
<header>
<h1>Discussion Title</h1>
</header>

<article>
{post1}
</article>

<article>
{post2}
</article>

</article>

</body>
</html>

mattur

11:12 am on Dec 17, 2014 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Looks ok, maybe swap in <main> for the containing article? <main> provides a sort-of skip to main content function.

<html>
<body>

<header>{site header}</header>

<main>

<header>
<h1>Discussion Title</h1>
</header>

<article>
{post1}
</article>

<article>
{post2}
</article>

</main>

<footer>{site footer}</footer>

</body>
</html>

w3bmastine

9:18 am on Jan 9, 2015 (gmt 0)

10+ Year Member



If you want you can give each post an aside element for meta-data like message-id, time, user name, etc.

<article>
{post}
<aside>
{meta}
</aside>
</article>

Regarding your question if article or section are sufficient for posts, article is the correct element to use.