Jump to content

Correct Use Of Dl Dt Dd


mattmill30
 Share

Recommended Posts

Hi,I've been looking at the different elements on w3schools and i found the dl dt dd elements.I just wanted to check that my understanding of the elements is correct.I understand that they're for definitions lists. However, are the uses of them in the following scenarios compliant with their purpose?

  • FAQ - Question > Answer
  • Latest News - Date > Headline/Summary

For example:How does it work? It’s simple. You select from one of the services above (in the blue bar) and answer a few questions designed to quickly establish your exact requirements specific to your company. Once you have submitted your contact details and opened a user account, we assign a negotiator to approach multiple suppliers and gather quotes for your required service. Once we have compiled a list of quotes, we let you know by email that they are ready for viewing on your account page. You can either view the quotes purely for information purposes, or select the companies you would like to hear more from.How do you select which suppliers to approach? We are only interested in negotiating with established suppliers who have acquired a reputation within their industry for quality services. We do not have an ‘index’ or approved list of suppliers who pay us money to find them sales leads. We pride ourselves on being impartial and independent, so we only make contact with companies who are genuinely equipped with the manpower, expertise and resources to meet your requirements.What if I don’t have all the information you need? Don’t worry if you don’t have all the information immediately to hand, we can contact you by phone if we need clarification.Should that be accomplished via dl-dt-dd or via h2-p?Likewise:Head OfficeJLE Services Ltd T/A Tendervendors57 Gravel LaneWilmslowCheshireSK9 6LSShould that be accomplished using dl-dt-dd or h2-p?At what point does information cease being a definition list, and become a paragraph with a subheading?Thanks,Matthew Millar

Edited by Matthew Millar
Link to comment
Share on other sites

Semantics considered, I would use the H2 > p for the FAQ listing. Check out the micro-formats for address information. http://microformats.org/wiki/adr-examples they actually use dl/dt/dd for their styling instead of <address>. The last sample on that linked page.

Edited by jlhaslip
Link to comment
Share on other sites

Hi jlhaslip,Thanks for the reply.I've noticed the example at miroformats, each line of data has a title, where as my example is just data beneath a subheading.So that considered, do you think both examples should use h2 > p, with the address one, being wrapped with address?btw, what do you mean by semantics?Thanks,Matthew Millar

Link to comment
Share on other sites

Hi jlhaslip,Thanks for the reply.I've noticed the example at miroformats, each line of data has a title, where as my example is just data beneath a subheading.So that considered, do you think both examples should use h2 > p, with the address one, being wrapped with address?btw, what do you mean by semantics?Thanks,Matthew Millar
http://en.wikipedia.org/wiki/HTMLEssentially in the case of HTML, its using markup tags that are related to the content they are enclosing. This would mean using <H1-6> tags for a heading, using a <p> tag for strings of text, NOT using tables to layout your pages, basically using the tags for what they're meant for. Edited by thescientist
Link to comment
Share on other sites

Thanks Scientist. :)Ok, i've had a bit more of an indepth look at the page, along with:http://microformats.org/wiki/hcard-faq#Sho...RESS_for_hCardsIt says about using the class="adr" for an actual physical address, where as the address element should be used to hold contact details for the page..Does this mean, i should have an <address> and a <dl class="adr"> on the same page?Thanks,Matthew Millar

Link to comment
Share on other sites

  • 2 weeks later...

Hi,I was just having a look at the new HTML5 standard, and i've noticed the example given here:http://www.w3.org/TR/html5/semantics.html#the-header-elementFrom whats been said, i thought the purpose of dt dd, was basically a definition of a word/sentence.So you would use dt dd, for a dictionary, say, because the data held in dd is a definition of the word/sentence in dt.However, in the example they use a definition list, for a very different usage, and i was wondering how, the example differs to a faq? As they both seem to be providing information about the dt.Sorry to pester, i just want to fully understand the semantic purpose of the dl dt dd tags.Thanks,Matthew Millar

Link to comment
Share on other sites

The Def'n List need not be for words, as the link you point to shows us.There are some web page designs that use a dl/dt/dd for their navigation list, even.As for using the structure for an FAQ, I say yes, do it. And also, there can be more than one DD for a DT, by the way.

<dl><dt>	<dd> ... </dd>	<dd> ... </dd>	<dd> ... </dd>

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...