Similar HTML elements

[JJ]

I have a newbie question that I need some help with.

<code> == <samp> == <kbd>
<i> == <em> == <cite> == <var> == <dfn> == <address>
<abbr> == <acronym>
<b> == <strong>

From what I can tell these tags are rendered the same to the end user.
If I used <var> instead of <i>, it would look the same to the end
user. Is the only reason to have both <var> and <i> in HTML to imply
the type of data held within an element to anyone that reads the code?
Is there any differences between these tags in the way they're
rendered? Could you point them out? Thanks.

 

[Neal]

I have a newbie question that I need some help with.

<code> == <samp> == <kbd>
<i> == <em> == <cite> == <var> == <dfn> == <address>
<abbr> == <acronym>
<b> == <strong>

From what I can tell these tags are rendered the same to the end user.

Not always. In many browsers this is true.

If I used <var> instead of <i>, it would look the same to the end
user. Is the only reason to have both <var> and <i> in HTML to imply
the type of data held within an element to anyone that reads the code?
Is there any differences between these tags in the way they're
rendered? Could you point them out? Thanks.

Use the element that matches the semantic role of the content. If you want
to emphasize something, use <em>. If you want to cite, use <cite>. Etc.

The abbr/acronym one is fun, though. First, no one can seem to agree on
what an acronym is. Second, IE doesn't deal with abbr. So I find these two
are best avoided. Others have a different opinion.

Don't get hung up on the rendering of the elements. The browser will do
what it does. Choose an element markup which reflects what it is, not what
you want it to look like. You can easily change that in CSS anyhow.

 

[Mitja]

I have a newbie question that I need some help with.

<code> == <samp> == <kbd>
<i> == <em> == <cite> == <var> == <dfn> == <address>
<abbr> == <acronym>
<b> == <strong>

From what I can tell these tags are rendered the same to
the end user. If I used <var> instead of <i>, it would
look the same to the end user. Is the only reason to have
both <var> and <i> in HTML to imply the type of data held
within an element to anyone that reads the code? Is there
any differences between these tags in the way they're
rendered? Could you point them out? Thanks.

The way they're rendered is in no way standard. <i> and <b> are an
exception here - they're for marking up style.

All the others differ in what they mark up, rather than any styling effects.
Those are meant to be added with CSS. See also
http://www.w3.org/TR/html4/struct/text.html#h-9.2.1

 

[Toby Inkster]

From what I can tell these tags are rendered the same to the end user.
If I used <var> instead of <i>, it would look the same to the end
user.

In some browsers they may look the same. In others, they don't.

For example, look at their renderings in my copy of Lynx:
http://examples.tobyinkster.co.uk/default-renderings-in-lynx.png

Here you'll see that <var> and <i> are rendered in completely different
colours, <strong> and <b> look different (both are red, but only <strong>

Is the only reason to have both <var> and <i> in HTML to imply
the type of data held within an element to anyone that reads the code?

It's to imply a difference in data altogether. <var> is for variables. <i>
is for italics text of no special significance.

 

[Mark Parnell]

Not always.

Speaking browsers, for example.

In many browsers this is true.

Many *visual* browsers, yes.

Second, IE doesn't deal with abbr. So I find these two
are best avoided. Others have a different opinion.

I just use <abbr> anyway. It doesn't break anything in IE, and anyone
using a decent browser gets the benefit of it.

 

[Toby Inkster]

The abbr/acronym one is fun, though. First, no one can seem to agree on
what an acronym is. Second, IE doesn't deal with abbr. So I find these two
are best avoided. Others have a different opinion.

http://tobyinkster.co.uk/web-howto#abbr

 

[Neal]

http://tobyinkster.co.uk/web-howto#abbr

Yeah, well, see, I disagree that acronyms must be pronounceable. And, as
W3C uses acronym markup on HTML and CS, they seem to agree.

See http://www.google.com/search?q=define:acronym - very, very few
definitions insist it must be pronounceable.

 

[Toby Inkster]

Yeah, well, see, I disagree that acronyms must be pronounceable.

As do I. My point on that page is that the exact definition of the term
"acronym" is very disputable, though most agree that they are a subset of
abbreviations, so <abbr> is a safe bet.

 

[Neal]

As do I. My point on that page is that the exact definition of the term
"acronym" is very disputable, though most agree that they are a subset of
abbreviations, so <abbr> is a safe bet.

.... unless your user is using IE...