Skip to content

24 ways to impress your friends

My Other Christmas Present Is a Definition List

13 Comments

Comments are ordered by helpfulness, as indicated by you. Help us pick out the gems and discourage asshattery by voting on notable comments.

Got something to add? You can leave a comment below.

Sophie Dennis

I am in favour of widening the semantic usage of the definition list as per the HTML 5 spec. Being overly restrictive about the context in which a tag can be used – basically arguing for an extremely literal interpretation of the words “definition”, “term” and “description” – will ultimately make the web less semantic rather than more, as people reach for even clumsier alternatives.

The definition list is the best option HTML offers for marking up name/value pairs, and such use is entirely consistent with both existing and future specifications. Norm’s deconstruction of how it doesn’t actually work for dialogue – as suggested by the example in the HTML4 spec – is excellent, but I agree with other commenters that using it to mark up the cast and crew of a movie (director equals Stanley Kubrick), or for a product specification (resolution equals 1024 × 768) is entirely appropriate and should be encouraged.

Put simply ‘Director’ is a term, and ‘Stanley Kubrick’ describes the Director of the movie 2001: A Space Odessey. Maybe not what your high school English teach was after when she asked for something descriptive (by which she probably meant poetic), but it is a description nonetheless. The dl is also excellent in this context as there can be multiple directors marked up with multiple dds, or one person can fulfil several functions – writer, director, producer – and so be marked up with multiple dts. A dl is therefore a vastly superior choice than alternatives such as heading + paragraph, lists with semi-semantic elements like em or strong, or a table with headings.

One problem with the historic HTML specs is the inbalance in what can be marked up semantically and what can’t. This confuses newer coders, as with the very best of intentions they search for a semantic element which simply doesn’t exist, and fuels HTML’s detractors who can rightly point out it’s limitations as a semantic markup language. An approach which encourages the semantic use of tags which we already have will utlimately be beneficial to the adoption of semantic HTML.

Anne van Kesteren

Hi, this might not make the “best comment list” but I justed wanted to say that if you’ve feedback on HTML5 you might want to give it on one of the mailing lists (public-html@w3.org or whatwg@whatwg.org). Publishing a series of articles is also fine and I hope we can locate them all, but such feedback is easier to get lost and usually gives less oppertunity for a conversation. Thanks!

pauldwaite

Living by the specification, a definition list should be used for term definitions – glossaries, lexicons and dictionaries – only.

If you’re talking about the HTML 4 specification, then—as you mention yourself—we can use definition lists for dialogue as well.

Surely tying your conclusion to the spec isn’t helpful when you’re arguing that the spec is bad?

Finn

First of all I’m not a native speaker so sorry for my bad english ;)
How do you think one should handle key/value pairs now in HTML4/XHTML1? I just have an unpleasant feeling when I use two column tables for this purpose. Definition lists seem to be the right option in this case.

Nate K

I’ll be the first to raise my hand and admit I am guilty of using it for other purposes. You do a great job of really defining its proper uses and contexts.

What you say makes perfect sense, and if we really break down the semantics of the tag, its spec and suggested uses, and its potential abuses – it really lets us examine the right tag for the right job. The response from the screen reader is a sure sign that certain things simply wouldn’t work with a key/value pair, as suggested by many.

Thank you.

Will Green

Mark, you seem have a very narrow definition of “definition”. In my mind, listing the cast and crew of a movie using a definition list is perfectly valid in certain contexts, such as an IMDB entry for the movie. So, for 2001: A Space Oddesy, Stanley Kubrik is the definition of director, in the context of this movie.

The key here is context.

Matthew

Apart from a couple of obviously actual definition lists, my only use of dl is for a FAQ, where I think having the answer as a definition for the question is fair. And I just mentioned it to Norm and he didn’t kill me, so I think that’s good enough for me :)

Matthew Hill

I have to agree with Sophie on this one. I’m “guilty” of using def lists for all sorts of name/value pairings, usually when marking up addresses (House/#, Street/Name, Country/Name, etc) but I feel this is an entirely reasonable use of the construct in that context. Note that word “context” again.

I try to use precise semantic markup to the best of my knowledge and ability, but getting hung up on the precise meaning of the words “definition list” and therefore reducing the availability of the DL is taking things a little far, especially given the other options open to us.

Jeff Rechten

Thanks for writing this up. I was about to mark up some links that had headings as a definition list, but have now been persuaded against it. I’ll see what I can do with the ul.

whereistom

I understand your sentiment here, but wonder if it’s over-zealous.

For pair values like the attributes of a piece of hardware (your example), what markup would you suggest is used? There’s no HTML tag that properly covers that kind of requirement, so doesn’t it make sense to use the closest fit, even if a strict interpretation says that it’s wrong?

Isn’t using a <dl> less wrong than the alternatives? – and under the not-very-semantic-overall HTML4, isn’t that often the best we can aim for?

Jeff

Many thanks for the article. An interesting read, although I have some issue with the conclusions you reach.

What about a list of calendar items, for example? I would be tempted to use dt for dates and dd for events on those dates. Yet this seems to go against the HTML5 spec in that it is ordered, and “events don’t equal dates,” they describe them (what else is a date but the sum of things happening on that date?).

This seems to be a shame, as <dt>December 25th</dt> <dd>Christmas Day</dd> Seems much better to me than <li><em>December 25th</em> Christmas Day</li>. While both let you style date and event with CSS, the DL actually explains the relationship between the two elements.

Anonymous Coward

Someone should tell 37signals – their Bascamp login page uses definition lists for the label/input pairings.

They’re probably too busy telling us all to Get Real or something to use proper markup…

Impress us

Be friendly / use Textile