E-mail List Archives
Thread: How would you mark up this information?
Number of posts in this thread: 12 (In chronological order)
From: Don Hinshaw
Date: Fri, Apr 22 2005 7:03PM
Subject: How would you mark up this information?
No previous message | Next message →
Hi All,
I am wondering about the best way to mark up this list: http://64.132.144.101/~somedom/access/subscription_sample.html
Should it be a list with each first line being <strong>, or should each first line be a heading: <hx>?
Or should it be a series of blocks like this:
<hx>item 1</hx>
<p>second line<br>
third line</p>
<hx>item 2</hx>
<p>second line<br>
third line</p>
Thanks for any suggestions.
--
Don Hinshaw
Hinshaw Design Group
http://www.hinshawdesign.com
From: Webmaster
Date: Fri, Apr 22 2005 11:40PM
Subject: Re: How would you mark up this information?
← Previous message | Next message →
Hi,
You may place it nicely on the page in logical blocks in the middle of
the page with something like:
<style type="text/css">
p.ctc {
margin-left: 150; margin-top: 7;
}
p.ctcd {
margin-left: 150; margin-top: 20;
}
p.ctcl {
margin-left: 185; margin-top: 7;
}
</style>
<p class="ctc">
Emergency Communications Center
...etc.
If you need more sophisticated list design have a look here
http://www.maxdesign.com.au/presentation/definition/index.cfm
brgds Alex
Don Hinshaw wrote:
>> Hi All,
>> I am wondering about the best way to mark up this list:
>> http://64.132.144.101/~somedom/access/subscription_sample.html
>> Should it be a list with each first line being <strong>, or should each
>> first line be a heading: <hx>?
>>
>> Or should it be a series of blocks like this:
>> <hx>item 1</hx>
>> <p>second line<br>
>> third line</p>
>>
>> <hx>item 2</hx>
>> <p>second line<br>
>> third line</p>
>>
>> Thanks for any suggestions.
From: Jukka K. Korpela
Date: Sat, Apr 23 2005 1:19AM
Subject: Re: How would you mark up this information?
← Previous message | Next message →
On Sat, 23 Apr 2005, Webmaster wrote:
>> margin-left: 150; margin-top: 7;
Sorry, but if you're offering syntactically malformed CSS code that
conforming browsers are required to ignore, your advice can't be very
good.
-- Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/
From: Jukka K. Korpela
Date: Sat, Apr 23 2005 1:28AM
Subject: Re: How would you mark up this information?
← Previous message | Next message →
On Fri, 22 Apr 2005, Don Hinshaw wrote:
>> I am wondering about the best way to mark up this list:
>> http://64.132.144.101/~somedom/access/subscription_sample.html
You can use list markup, or heading markup, or both.
>> Should it be a list with each first line being <strong>, or should each
>> first line be a heading: <hx>?
Since the first _is_ logically a heading for content that follows,
I would use heading markup for it anyway. Whether you _also_ use list
markup, e.g.
<ul>
<li><h2>...</h2>
<div>...</div></li>
...
</ul>
is perhaps a matter of taste, but since you would probably want to remove
the effects of list markup in visual rendering (suppress bullets) and it
would hardly help in nonvisual rendering either, I wouldn't use it.
The choice between
<h2>...</h2>
<p>...</p>
and
<h2>...</h2>
<div>...</div>
depends on whether you regard the contact information as a paragraph of
text or not. I wouldn't. There's not much practical difference in
rendering, since the headings would act as dividing the content into parts
anyway. Moreover, in styling, you would need to worry about the margins
(and font size) of <h2> elements only, since <div> elements (unlike <p>)
have no default margins. Setting, say
h2 { font-size: 100%; margin: 1em 0 0 0; }
could be enough.
-- Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/
From: Jens Meiert
Date: Sat, Apr 23 2005 6:42AM
Subject: Re: How would you mark up this information?
← Previous message | Next message →
><style type="text/css">
>> p.ctc {
>> margin-left: 150; margin-top: 7;
>> }
>>
>> p.ctcd {
>> margin-left: 150; margin-top: 20;
>> }
>>
>> p.ctcl {
>> margin-left: 185; margin-top: 7;
>> }
>> </style>
But please, use units.
-- Jens Meiert Information Architect http://meiert.com/
From: Don Hinshaw
Date: Sat, Apr 23 2005 10:28AM
Subject: Re: How would you mark up this information?
← Previous message | Next message →
Thanks for all the great advice!
Jukka K. Korpela wrote:
> The choice between
> <h2>...</h2>
> <p>...</p>
> and
> <h2>...</h2>
> <div>...</div>
> depends on whether you regard the contact information as a paragraph of
> text or not. I wouldn't. There's not much practical difference in
> rendering, since the headings would act as dividing the content into parts
> anyway. Moreover, in styling, you would need to worry about the margins
> (and font size) of <h2> elements only, since <div> elements (unlike <p>)
> have no default margins. Setting, say
>
> h2 { font-size: 100%; margin: 1em 0 0 0; }
>
> could be enough.
>
>
>
--
Don Hinshaw
Hinshaw Design Group
http://www.hinshawdesign.com
From: Webmaster
Date: Sun, Apr 24 2005 6:29AM
Subject: Re: How would you mark up this information?
← Previous message | Next message →
right.. it was just a code from head ... I meant that the contact
information should not be left cluttered to the left of the page, as we
see so often, that it may be placed in logical blocks on the page, with
the total control of position
Jens Meiert wrote:
>>>><style type="text/css">
>>>>p.ctc {
>>>>margin-left: 150; margin-top: 7;
>>>>}
>>>>
>>>>p.ctcd {
>>>>margin-left: 150; margin-top: 20;
>>>>}
>>>>
>>>>p.ctcl {
>>>>margin-left: 185; margin-top: 7;
>>>>}
>>>></style>
>
>>
>>
>> But please, use units.
From: foliot
Date: Sun, Apr 24 2005 7:39AM
Subject: Re: How would you mark up this information?
← Previous message | Next message →
Webmaster wrote:
>> Hi,
>>
>> You may place it nicely on the page in logical blocks in the middle
>> of the page with something like:
>>
>> <style type="text/css">
>> p.ctc {
>> margin-left: 150; margin-top: 7;
>> }
>>
>> p.ctcd {
>> margin-left: 150; margin-top: 20;
>> }
>>
>> p.ctcl {
>> margin-left: 185; margin-top: 7;
>> }
>> </style>
>>
>> <p class="ctc">
>> Emergency Communications Center
>> ...etc.
Hmmm...
Might I suggest the Definition List instead? (this is, after all, a list of
contact information is it not?)
Consider:
<dl>
<dt>Emergency Communications Center</dt>
<dd>Emergencies dial 9-1-1</dd>
<dt>Chesterfield County Police Department</dt>
<dd>
<ul>
<li>Emergencies dial 9-1-1</li>
<li>Non-emergencies (804) 748-1251</li>
<li>FAX: (804) 748-1239</li>
<li>Street Address: <address>10031 Iron Bridge Road,
Chesterfield, VA 23832</address></li>
</ul>
</dd>
<dt>Chesterfield Fire and EMS</dt>
<dd>
<ul>
<li>Emergencies dial 9 -1-1</li>
<li>Non-emergencies (804) 748-1360</li>
<li>FAX: (804) 751-9022</li>
</ul>
</dd>
<dt>Domestic Violence Resource Center</dt>
<dd>For victims of domestic violence who need immediate assistance,
please call 911 or contact Police - (804) 748-1277 or (804) 748-1251 - after
5 p.m. and weekends, or the Virginia Family Violence and Sexual Assault
24-hour Hotline - 1-800-838-8238, or the YWCA 24-hour hotline - (804)
796-3066.</dd>
</dl>
...style as required.
JF
--
John Foliot = EMAIL ADDRESS REMOVED =
Web Accessibility Specialist / Co-founder of WATS.ca
Web Accessibility Testing and Services
http://www.wats.ca
Phone: 1-613-267-1983 / 1-866-932-4878 (North America)
From: Jukka K. Korpela
Date: Sun, Apr 24 2005 8:41AM
Subject: Re: How would you mark up this information?
← Previous message | Next message →
On Sun, 24 Apr 2005, John Foliot - WATS.ca wrote:
>> Might I suggest the Definition List instead?
You can, but then you are wrong and I need to tell it.
>> (this is, after all, a list of
>> contact information is it not?)
It is. It is not a list of definitions.
>> <dt>Emergency Communications Center</dt>
You are not defining what the term "Emergency Communications Center"
means, i.e. your are not specifying the properties that something needs to
have in order to be called Emergency Communications Center.
Hence, the markup is semantically wrong. No need to tell that even HTML
specifications contain semantically wrong use of <dl> elements; the W3C
doesn't always follow its own recommendations.
Moreover, on the practical side, styling <dl> elements suffers from
various peculiarities and oddities in browsers.
-- Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/
From: Patrick H. Lauke
Date: Sun, Apr 24 2005 9:23AM
Subject: Re: How would you mark up this information?
← Previous message | Next message →
Jukka K. Korpela wrote:
> No need to tell that even HTML
> specifications contain semantically wrong use of <dl> elements; the W3C
> doesn't always follow its own recommendations.
or, to play devil's advocate, the fact that they give examples such as marking up dialogues with a DL indicates that the semantics are not that restrictive, as they may have been aware that it's difficult to create language that covers all possible semantic constructs necessary to mark up real world content in all its facets...
--
Patrick H. Lauke
_____________________________________________________
re
From: John Foliot - WATS.ca
Date: Sun, Apr 24 2005 9:30AM
Subject: Re: How would you mark up this information?
← Previous message | Next message →
Jukka K. Korpela wrote:
>> On Sun, 24 Apr 2005, John Foliot - WATS.ca wrote:
>>
>
>>>> Might I suggest the Definition List instead?
>
>>
>> You can, but then you are wrong and I need to tell it.
Jukka, you know I respect your opinion, but I must disagree with you. The
W3C specifically states:
"Definition lists, created using the DL element, generally consist of a
series of term/definition pairs (although definition lists may have other
applications). Thus, when advertising a product, one might use a definition
list:"
http://www.w3.org/TR/REC-html40/struct/lists.html
I am suggesting one of those other applications... (and referencing the
"authority")
>>
>
>>>> (this is, after all, a list of
>>>> contact information is it not?)
>
>>
>> It is. It is not a list of definitions.
>>
>
>>>> <dt>Emergency Communications Center</dt>
>
>>
>> You are not defining what the term "Emergency Communications Center"
>> means, i.e. your are not specifying the properties that
>> something needs to
>> have in order to be called Emergency Communications Center.
Correct, although I am echoing back specific information (properties)
regarding this subject. I consider all instances of "call and response"
lists appropriate candidates for Definition Lists, and the "example"
provided on the W3C website/page listed above supports my claim:
<dl>
<dt><strong>The ingredients:</strong></dt>
<dd>
<ul>
<li>100 g. flour</li>
<li>10 g. sugar</li>
<li>1 cup water</li>
<li>2 eggs</li>
<li>salt, pepper</li>
</ul>
</dd>
<dt><strong>The procedure:</strong></dt>
<dd>
<ol>
<li>Mix dry ingredients thoroughly.</li>
<li>Pour in wet ingredients.</li>
<li>Mix for 10 minutes.</li>
<li>Bake for one hour at 300 degrees.</li>
</ol>
</dd>
<dt><strong>Notes:</strong></dt>
<dd>The recipe may be improved by adding raisins.</dd>
</dl>
(Source: http://www.w3.org/TR/REC-html40/struct/lists.html )
>>
>> Hence, the markup is semantically wrong. No need to tell that
>> even HTML
>> specifications contain semantically wrong use of <dl>
>> elements; the W3C
>> doesn't always follow its own recommendations.
*How* is it semantically wrong? (and according to whom else besides you?) I
would suggest that you are defining the word "definition" a tad too rigidly
for the HTML spec... I do not believe it was ever intended to be that
literal.
I suppose the larger issue is context. The information could also be marked
up differently, and that difference would not be substantially different;
you could mark it up as an unordered list, or even a nested unordered list
(given the multiple phone numbers). Each entry could also be marked as
separate paragraphs (although *I* wouldn't do it that way). However one
list of three or four "things", with each "thing" having attendant
information attached to it to me says definition list... It's the call and
response structure that I see.
>>
>> Moreover, on the practical side, styling <dl> elements suffers from
>> various peculiarities and oddities in browsers.
Again, refer to above example, and the use of <strong>. What "peculiarities
and oddities" are you referring to, and can you share that information with
the list please?
JF
--
John Foliot = EMAIL ADDRESS REMOVED =
Web Accessibility Specialist / Co-founder of WATS.ca
Web Accessibility Testing and Services
http://www.wats.ca
Phone: 1-613-267-1983 / 1-866-932-4878 (North America)
From: Austin, Darrel
Date: Mon, Apr 25 2005 8:36AM
Subject: RE: How would you mark up this information?
← Previous message | No next message
>>(this is, after all, a list of
>>> > contact information is it not?)
>
>>
>> It is. It is not a list of definitions.
The W3C pretty clearly states that a definition list can be used for
anything that adheres to the 'item/item description' concept. The fact that
they called it specifically a definition list is what leads to the confusion
of its use.
I, too, would vote for a DL.
Or, possibly, a table, though you'd loose a bit of the styling flexibility.
>> Moreover, on the practical side, styling <dl> elements
>> suffers from various peculiarities and oddities in browsers.
Any examples?
-Darrel