Welcome to WebmasterWorld Guest from 54.146.248.111

Forum Moderators: incrediBILL

Message Too Old, No Replies

Ideas on HTML5 Layout for FAQs

     

CSS_Kidd

6:05 pm on Jun 10, 2010 (gmt 0)

5+ Year Member



I am laying out a step by step FAQ page, but I wasn't sure if it would be more beneficial to use:

<article>
<header>
<h1>Question</h1>
</header>
<p>Answer</p>
</article>

for each question (something close to that) or just use an Ordered List. Each question/answer subject is able to independently be its own article and should be presented semantically. What do you think?

Fotiman

6:44 pm on Jun 10, 2010 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



Perhaps, then, you have a list of articles?
<ul>
<li>
<article>
<header>
<h1>Question</h1>
</header>
<p>Answer</p>
</article>
</li>
<li>
<article>
<header>
<h1>Question</h1>
</header>
<p>Answer</p>
</article>
</li>
</ul>

CSS_Kidd

7:06 pm on Jun 10, 2010 (gmt 0)

5+ Year Member



@Fotiman
Is there a benefit to that? It seems a little redundant. If it would be used for styling, wouldn't I just give the articles a class and style the H1 and P as the articles children? i.e.:

<article class="article">
<h1>Question</h1>
<p>Answer</p>
<article>

CSS:
.article {
style
}
.article h1 {
style
}
.article p {
style
}

I am not sure I understand the reasoning to having articles in a list. Please explain.

Fotiman

8:03 pm on Jun 10, 2010 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



Well, I was only talking semantically. You had mentioned that they could be placed in a list. :) Realistically, though, I would not envision having "lists of articles". If each Q/A can be considered an article, then I suppose it makes sense to use <article>.

bill

12:50 am on Jun 11, 2010 (gmt 0)

WebmasterWorld Administrator bill is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month



What about using a definition list for this?

<dl>
<dt>Question 1</dt>
<dd>Answer 1</dd>
<dt>Question 2</dt>
<dd>Answer 2</dd>
</dl>


HTML5 even has a new <dialog> tag that uses <dt> and <dl> tags.
 

Featured Threads

Hot Threads This Week

Hot Threads This Month