View Full Version : semantics (specific uses)

01-18-2004, 02:33 PM
Well i'm trying to make my markup more semantic, so i've got a few questions for tips on what tag to use where.

First off - form field hints:

<label for="offset">GMT offset <span class="hint">GMT time is: 1:26pm</label><input type="text" name="offset" id="offset" size="5" maxlength="5" />

anyone think of something better to use for the span?

Next one - dates

<div class="newsItem">
<h3>Some newer News</h3>
<span class="newsDate">21/12/03</span>

Once again, any ideas for a more sematic tag to use for the date?

Last main one - page comments

<blockquote class="comment">
<a href="/members/viewuser.htm?userID=4" class="comm">ReadMe said:</a><br />
testing...<br />
<span class="commDate">[05/10/03 2:41pm]</span>

This one just seems very bad semantics full stop, any tips on what to use instead.

Just another couple of minor notes on the same topic, the <kbd> element indicates text to be entered by the user - shouldn't that mean it should be rendered similar to a textarea or a text input box? also <dfn> is described as containing the defining instance of the enclosed term, what does that even mean.

And a final point to think about - semantically, how should a forum thread be marked up?

01-18-2004, 03:44 PM
For your hint, there is no good semantic element. Use a span tag. (Your example is not well-formed, you never close the span tag.)

Same for dates - and span is in this case semantically preferable to div, because it is not a division or section of the document, but just a lump of text that belongs together.

For the comments, a div containing each comment within the blockquote instead of a p element, and use p elements for textual paragraphs in the comments; linebreaking fluidly instead of using the br element.

The kbd element signifies text that the use should enter in for example a code listing, not text that user should enter in a document.

The dfn element is supportsed to be used when you define a term that you later in the text will use. This is useful for ambigous terms. Say you want to talk about cats. Then, do you by the word 'cat' mean domestic cats or all animals of the felidae family? Use the dfn tag for clearing that up the first time you use the word 'cat' on the page.

As for a forum thread, the appropriate markup depends a little on your perspective. You could look at it as a table of entires, where you in one column have the poster's user name, date of writing etc, and in the other column have the text. You could look at it as a set of nested lists, creating a hierarchical structure. You could look at it as sections of running text made by certain posters at certain times. A thread is a so complex thing that you can chose many different views upon what it truly is. There is no true semantical equivalent of forum threads in HTML, so you must approximate them, which is the reason for the ambiguity. You could write your own in XML if you wanted, though, or a module for XHTML.