How should I format an address?

[John Salerno]

I'd like to include a mailing address in the page I'm working on. I was
wondering if I should use the <pre> tag, or if I should just use <p> and
put <br> after each line of the address, so it will look like a mailing
address across several lines?

One thing against <pre> is that it puts it in fixed-width font, although
I guess my styles can override that. But is there a preferred method to
do something like this? <pre> looks like it can get out of control, so I
don't want to abuse it. (Plus, it doesn't look all that nice in the
markup, because you can't line it up with everything else!)

 

[Chris Beall]

I'd like to include a mailing address in the page I'm working on. I was
wondering if I should use the <pre> tag, or if I should just use <p> and
put <br> after each line of the address, so it will look like a mailing
address across several lines?

One thing against <pre> is that it puts it in fixed-width font, although
I guess my styles can override that. But is there a preferred method to
do something like this? <pre> looks like it can get out of control, so I
don't want to abuse it. (Plus, it doesn't look all that nice in the
markup, because you can't line it up with everything else!)

John,

You could consider using <address>, which is semantically what you seem
to have. See http://www.w3.org/TR/html401/struct/global.html#edef-ADDRESS.

You'll probably need to insert <br> as appropriate to get the usual
mail-address format.

Chris Beall

 

[John Salerno]

You could consider using <address>, which is semantically what you seem
to have. See http://www.w3.org/TR/html401/struct/global.html#edef-ADDRESS.

You'll probably need to insert <br> as appropriate to get the usual
mail-address format.

Wow, thanks. I didn't know about this element, but it's perfect!

 

[Steve Pugh]

Wow, thanks. I didn't know about this element, but it's perfect!

Read the spec carefully. <address> is only to be used for the contact
details related to the page itself. Any other addresses on the page
must not be marked up with <address>.

Steve

 

[John Salerno]

Read the spec carefully. <address> is only to be used for the contact
details related to the page itself. Any other addresses on the page
must not be marked up with <address>.

Steve

Hmmm...I was reading on W3C's tutorials about it, and it said this:

"The <address> tag defines the start of an address. You should use it to
define addresses, signatures, or authorships of documents."

The example it gives is even a regular mailing address. Is that wrong?

 

[Stan McCann]

I'd like to include a mailing address in the page I'm working on. I
was wondering if I should use the <pre> tag, or if I should just use
<p> and put <br> after each line of the address, so it will look
like a mailing address across several lines?

What's wrong with <address>? A <br> is appropriate for a new line IMO.
I've also played around a bit with styling a list within address so
that name is one list item, street address is one list item, city,
state, and zip, is one list item. I'm sure countries other than the US
may have different address schemes. Add/remove list items as
necessary.

 

[David Dorward]

Hmmm...I was reading on W3C's tutorials about it, and it said this:

"The <address> tag defines the start of an address. You should use it to
define addresses, signatures, or authorships of documents."

Google suggests that you found that on w3schools.com. W3Schools is not, in
any way, affiliated with the W3C and has numerous errors. They should not
be considered authoritative.

As previously mentioned, the element specifies contact information for the
document. That contact information might take the form of a postal address.

So, if I were to write a page and wanted to include my contact details on
it, then I could use the address element to markup my postal address. On
the other hand, if I were listing registered charities with interests in
wildlife, then it would not be an appropriate element to use to provide
contact details for the RSPCA and RSPB.

 

[Chris Beall]

Read the spec carefully. <address> is only to be used for the contact
details related to the page itself. Any other addresses on the page
must not be marked up with <address>.

Steve

Steve,

It depends on your definition of 'may'

I interpret 'may be used' to mean 'this is one suggested use'.

I didn't see anything in the spec stating that it must not be used for
any other purpose. It's an address, so <address> is the most
appropriate semantic markup.

Chris Beall

 

[John Salerno]

Google suggests that you found that on w3schools.com. W3Schools is not, in
any way, affiliated with the W3C and has numerous errors. They should not
be considered authoritative.

As previously mentioned, the element specifies contact information for the
document. That contact information might take the form of a postal address.

So, if I were to write a page and wanted to include my contact details on
it, then I could use the address element to markup my postal address. On
the other hand, if I were listing registered charities with interests in
wildlife, then it would not be an appropriate element to use to provide
contact details for the RSPCA and RSPB.

Hmm, I'm still a little uncertain. At first I thought you meant it was
for something more technical, like a web pages address (like a URL or
something), but if what I'm doing is putting the contact information for
the website's authors, that would be acceptable?

 

[David Dorward]

Hmm, I'm still a little uncertain. At first I thought you meant it was
for something more technical, like a web pages address (like a URL or
something),

No, just contact information. It is /who/ the contact information is for
that is relevant.

but if what I'm doing is putting the contact information for
the website's authors, that would be acceptable?

Yes, its the point of the element.

 

[Toby Inkster]

Google suggests that you found that on w3schools.com. W3Schools is not, in
any way, affiliated with the W3C and has numerous errors.

Although I agree with your general point about W3Schools not being
authoritative...

HTML 2.0 Spec:
| The ADDRESS element contains such information as address, signature and
| authorship, often at the beginning or end of the body of a document.

Not that many people still use HTML 2.0.

 

[Jukka K. Korpela]

What's wrong with <address>?

For one thing, it is _defined_ (by HTML specs) to indicate contact
information for author of the document (or part of document), not an
address in general.

It is by default rendered in italics by some popular browsers, which is
just foolish.

You would need to indicate line breaks with <br>, and you would not be
able to use more adequate markup for the lines. You could not make the
lines _elements_. This is bad for styling.

You could use just <div class="address">, with inner <div> elements for
lines. Or you could make it a table, which is actually more logical
than it may sound. For more notes on this, see
http://www.cs.tut.fi/~jkorpela/html/address.html

 

[Andy Dingley]

What's wrong with <address>?

There are two things wrong with <address>

First of all it's only for the "addres sof the page's author / creator",
which also implies that more than one of them simultaneously is right
out. Of course you might _mean_ the page's contact address, which is
fine, but it's not really appropriate to use this for address
directories etc. (although commonly done, and it doesn't really break
anything).

Secondly <address> gives you no additional formatting over its content,
You still have to deal with these linebreask etc. That's a matter for
the old standbys of <div>, <span> and <br>, with plentiful use of the
class attribute. Take a look at the following example and see if it's
any use for you.

Note also that I've got an "address-uk" class on the address element, as
well as "address" itself. This is that you can drive country-specific
address formats.

You might also look at vCard and similar vocabularies for "address"
information. so as to have some consistency about class names.



<html>
<style type="text/css" >

body {
background-color: #F3E39B;
}

/*
@media print {
*/
@media screen {

.address {
background-color: #fff;
color: #0;

border: thick outset #F3E39B;
margin: 20mm 50mm 5mm 20mm;
padding: 1em 2em;
min-width: 60mm;
max-width: 180mm;

font-style: normal;
font-family: arial, helvetica, sans-serif;
font-size: 12pt;
}

.addressee {
font-size: 120%;
font-family: serif;
margin-bottom: 0.33em;
margin-left: -0.5em;
}

.address .postal-town {
margin: 0.25em 0;
}

.address .postal-code {
margin: 0.5em 0 0;
font-size: 120%;
text-transform: uppercase;
}
.address .postal-code-barcode {
display: none;
}



.address.address-uk .postal-town {
text-transform: uppercase;
}

.address.address-uk .postal-code {
text-transform: uppercase;
font-size: 120%;
}



.address.address-us .postal-state {
display: inline;
text-transform: uppercase;
}
.address.address-us .postal-state:after {
content: ', ';
}

.address.address-us .postal-code {
display: inline;
}

.address.address-us .postal-code-barcode {
display: block;
font-family: 'the magic US postal barcode font',
'code 39', 'OCR A extended', fantasy;
/* Set only the right font here and make sure it's present */
font-size: 6mm;
margin: 10mm 0 0 20mm;
}
}
</style>

<body>

<div class="address address-uk" >
<div class="addressee" >Biffa Bacon</div>
<div class="street-address" >1 Bash Street
<br>Wrong-side-of-the-tracks</div>
<div class="postal-town" >Fulchester</div>
<div class="postal-code" >AB1 23d</div>
<div class="postal-code-barcode" >AB1 23d</div>
</div>

<div class="address address-us" >
<div class="addressee" >Barbie Bimbo</div>
<div class="street-address" >Barbie's Condo
<br>Somewhere unfeasibly pink</div>
<div class="postal-town" >Beverley Hills</div>
<div class="postal-state" >CA</div>
<div class="postal-code" >90210</div>
<div class="postal-code-barcode" >90210</div>
</div>

</html>

 

[Steve Pugh]

Hmmm...I was reading on W3C's tutorials about it, and it said this:

"The <address> tag defines the start of an address. You should use it to
define addresses, signatures, or authorships of documents."

What's the URL of that tutorial? Because I don't know of any W3C HTML 4
tutorial (they did have an HTML 3.2 one If I recall correctly).

The example it gives is even a regular mailing address. Is that wrong?

According to the spec itself, it's wrong unless it's the mailing
address that should be used as contact details for the page on which it
is found.

Steve

 

[John Salerno]

What's the URL of that tutorial? Because I don't know of any W3C HTML 4
tutorial (they did have an HTML 3.2 one If I recall correctly).

The others were right about it being W3School instead.

According to the spec itself, it's wrong unless it's the mailing
address that should be used as contact details for the page on which it
is found.

I guess I'm also wondering if the intentions of why you include the
address should also be considered. If I include the address of the page
author, but not for purposes of concerning the page itself, does that
not count? (For example, I write a web page, then include my address so
people can send me an order, or a letter, or something unrelated to the
fact that I have a website.)

 

[Andy Dingley]

Not that many people still use HTML 2.0.

Isn't HTML 2.0 the default assumption in the absence of a doctype ?

They might not _realise_ they're using HTML 2.0, but there's a lot of
people doing it.

 

[Stan McCann]

For one thing, it is _defined_ (by HTML specs) to indicate contact
information for author of the document (or part of document), not an
address in general.

Thanks Jukka. I guess I had never really read the docs on address; you
are also slightly off on the definition. It doesn't have to be the
address of the author, but contact information for the document, which
is not always the same. I know, picky. As for the default display to
be italics. Irrelevant. I can style it any way I want.

I'm not going to go fix every page where I have used it incorrectly,
but now that I know the correct usage, I will use it correctly from now
on. Thanks again for pointing this out.

As for the original question, then yes, I suppose a table would be ok,
or as I said I'd played with a bit, maybe a list. Being items listed
in one column, I think I may go with list.

 

[chromatic_aberration]

Or you could make it a table, which is actually more logical
than it may sound. For more notes on this, see
http://www.cs.tut.fi/~jkorpela/html/address.html

Interesting!
I think one could also argue for the use of a definition list, for about
the same reasons:

<dl class="address">
<dt>Addressee</dt>
<dd class="addressee">Somebody</dd>
<dt>Street address</dt>
<dd class="streetAddress">Somewhere</dd>
<dt> ...
<dd> ...
</dl>

and then, you could omit the dt's:

<dl class="address">
<dd class="addressee">Somebody</dd>
<dd class="streetAddress">Somewhere</dd>
<dd> ...
</dl>

 

[Stan McCann]

I didn't note this earlier. Advice is often seen on this group to not
choose an element because of it's default style. Isn't the reverse
true as well? Don't choose ul because of the default style? Don't
choose address because of it's defaut style? Seems like the same
arguments can be used for this as don't choose h1 because it's bigger
but because it's a level 1 header.

I'm not arguing, especially with Jukka whom I respect, just asking for
clarification. I can go along with not using address after reading the
definition, but list? An address does seem like a list to me. So what
if the default style has bullets.

Interesting!
I think one could also argue for the use of a definition list, for
about the same reasons:
snip

and then, you could omit the dt's:

<dl class="address">
<dd class="addressee">Somebody</dd>
<dd class="streetAddress">Somewhere</dd>
<dd> ...
</dl>

This one makes a lot of sense to me.

 

[Jukka K. Korpela]

I guess I had never really read the docs on address;
you are also slightly off on the definition. It doesn't have to be
the address of the author, but contact information for the
document, which is not always the same.

To stay on the safe side, we should expect them to be the same, since
the summary at http://www.w3.org/TR/REC-html40/index/elements.html

As for the
default display to be italics. Irrelevant. I can style it any way
I want.

With the usual CSS caveats. Did you forget them? My point is that by
using <address> you take the unnecessary risk of having the content
displayed in italics in some browsing situations. When you would use
<address> for contact information on the author, the risk might be
worth taking, but why would you take a risk when there is nothing to be
won? (The reason why the risk might be worth taking is somewhat
theoretical: given the definition of <address>, it is _possible_ that
some software actually uses it according to the definition, e.g.
letting the user access the author's contact information with a simple
command instead of looking around the page to find it.)

As for the original question, then yes, I suppose a table would be
ok, or as I said I'd played with a bit, maybe a list. Being items
listed in one column, I think I may go with list.

With a list (<ul> or <ol>), you would have the problem of _default_
rendering, with bullets or numbers. An attempt to remove the bullets or
numbers with CSS might or might not be successful.