Untitled DocumentIn an effort to make our company's code XHTML 1.1 compliant and more semantic (we were loosely following XHTML 1.0 Trans but now want to more ridigly follow it), I was brainstorming for conventions and best practices. I came up with an idea pertaining to general lists that I'd like your input on.
Looking back at our sites, we would generally produce lists (such as news articles with dates, summaries, leading into full pages), or products, upcoming events, articles (.e.g http://www.wigley.co.nz/mainsite/LatestArticles.html) etc, in two general ways;
1. Divs with nested headers/paragraphs. E.g.
<div id="LatestNews"> <h1>Latest News</h2> <h2><a href="FullArticle.html>News Item One</a></h2> <p><span class="Date">20/10/05</span> Introduction goes here...</p> <h2><a href="FullArticle2.html>News Item Two</a></h2> <p><span class="Date">20/10/05</span> Introduction goes here...</p> </div>
Or, a wee bit nicer, use an unordered list, almost identically:
<div id="LatestNews"> <h1>Latest News</h2> <ul> <li><a href="FullArticle.html" class="Heading">News Item One</a></h2> <span class="Date">20/10/05</span> Introduction goes here...</li> <h2><a href="FullArticle2.html" class="Heading">News Item Two</a></h2> <span class="Date">20/10/05</span> Introduction goes here...</li> </ul> </div>
However, it occured to when reading the XHTML 1.1 doctype's list module, that it would be appropriate to use the definition list (dl, dt, dd) for lists where you had a clear heiracy of titles and associated information about them. The first example shows the proper heirachy between h1,h2 (news article) and introduction, but doesn't give any semantic idea that the h2's are all related in a list.
So, you could do this:
<div id="LatestNews"> <h1>Latest News</h2> <dl> <dt><a href="FullArticle.html">News Item One</a></dt> <dd><span class="Date">20/10/05</span> Introduction goes here...</dd>
<dt><a href="FullArticle2.html" class="Heading">News Item Two</a></dt> <dd><span class="Date">20/10/05</span> Introduction goes here...</dd> </dl> </div>
This gives both the idea of "list of items" and that the list has 'titles' and 'descriptions'... I also went back to the W3C and determined that it is a requirement of the html401 spec to allow multiple DDs for a DT. (e.g. if your DT was for a word that had several meanings. Even Netscape 4 supports it!), so you could even do the following, which I feel most comfortable about:
<div id="LatestNews"> <h1>Latest News</h2> <dl> <dt><a href="FullArticle.html">News Item One</a></dt> <dd class="date">20/10/05</dd> <dd class="intro"> Introduction goes here...</dd>
<dt><a href="FullArticle2.html" class="Heading">News Item Two</a></dt> <dd class="date">20/10/05</dd> <dd class="intro"> Introduction goes here...</dd> </dl> </div>
While I do understand the DL is for a definition list, the W3C provide another acceptable use of it as a transcript of people talking. To me, this seems like another appropriate use that was simply not dreamed of years ago when the spec was built--I can't see any places where this is used, not that I looked around much ...
Ideas? Opinions?
Siggy
****************************************************** The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ******************************************************
