please read the comments of this article before reading its content or upvoting this anymore. it's grossly inaccurate. in particular, this comment which mostly nails it. again, i'm not the author of this, just quoting Paul Armstrong:
----------------------------------------
It's most unfortunate that you mis-used half of the items in this post.
cite should be used when you're actually _citing_ something from a source, like if you're using a blockquote or q element.
optgroup should contain a set of options, not be closed before the options. Your "live demo" doesn't show any visual difference because of your improper usage.
acronym is used for acronyms. Defining acronym, "a word formed from the initial letters of the several words in the name"… The usage in your example just hurts my brain.
According the HTML specs, address is used to denote the address of the page creator: "The ADDRESS element may be used by authors to supply contact information for a document or a major part of a document such as a form. This element often appears at the beginning or end of a document." See: http://www.w3.org/TR/REC-html40/struct/global.html#h-7.5.6
Pretty sad that you didn't use labels in your fieldset example.
The abbr example is a better example of an acronym. abbr, or Abbreviation is a "shortened form of a word" like ‘management' -> ‘mgmt'.
rel should be used to describe the relationship of the text to the current tag. W3C says, "This attribute describes the relationship from the current document to the anchor specified by the href attribute. The value of this attribute is a space-separated list of link types."
wbr is not in any HTML spec. It is a non-standard tag that was added by Netscape, and later dropped around Netscape 4 or 5.
I'm incredibly disappointed by the inaccuracies that you're giving people who might not know better.
We were discussing a <wbr> found in one of our webpages only yesterday - there were a few puzzled expressions as to what the heck it did! Apparently the answer is remove it.
Another semi-useful one is <base>. Most probably have never seen it, but it's an easy way to direct all your relative links to a separate server. One can use it for simple load balancing.
The only neat idea from the article was using rel="clickable" for doing inline ajax editables, makes a lot more sense than adding a class. Everything else was kind of fluff.
It wasn't just fluff, it was actually misleading and wrong.
acronym should never be used - it is superseded by abbr, and only kept for backward-compatibility reasons. If you are going to use it, then it should be used for tagging acronyms. "Twitter" is not an acronym for "Founded in 2006".
Where's dl/dt/dd? Where are the labels for the radio buttons?
Let's say that there was an article saying that C++ is a great language because it supports templates, so you can easily customize your blog style with it.
That's so far beyond wrong, I'd consider it spam. This is the HTML version of that error.
The fact that they're both in the spec (as I said, for backward-compatibility reasons) does not mean that they're both useful.
There is a dead horse that the web development community has been beating for ages, as to what exactly is the difference between an ABBR and an ACRONYM, and if there even is a difference. http://tinyurl.com/d9vngz Is HTML an acronym, or an abbreviation? HyperText is one word, so it's not an initialism like FBI. What about radar or Nabisco, or other words that were once acrobrevinitialisms but are now treated just like regular words?
The general consensus seems to be: every acronym is an abbr, but not every abbr is an acronym; IE6 supports acronym and not abbr; but abbr is better supported by JAWS and other screen readers, and is supported by IE7+ and the other major browsers. Therefor, abbr is always at least as semantically appropriate as acronym, and better serves the people that the tag is designed to serve. Use abbr, and avoid acronym.
The HTML spec only one definition of the language; it says little to nothing about best practices or trade-offs in using various tags.
I agree with IsaacSchlueter's comments, some of the examples/explanations given are just incorrect.
<address> is supposed to be used only to signify the address of the author of the current page, not any address. The <cite> example doesn't really make any sense, as he doesn't actually have any quotation to cite. And Twitter is an acronym for "Founded in 2006"? What?
I use <abbr> for parenthetical remarks (that is, these) when I write. Is that acceptable usage? I would have rendered the line above, on my blog, as:
I use <abbr> for <abbr title="these">parenthetical remarks</abbr> when I write.
Having found that well-written anchor text just flows as part of the body of a document, the link itself becoming invisible if you were to reformat the text to remove it, I tried the same thing with parentheticals. So far, I think it's worked wonders for my writing. Anything I want to say that's orthogonal to the main point, but still interesting, can still be there in a sort of "director's cut" view, but instead of having all my extra clippings forced upon you, you have to decide to look.
If that isn't proper, I hope there's an <aside> tag in some upcoming version of HTML; it's at about the same "semantic" level as <q>.
<abbr> would be incorrect for this usage. You could, perhaps, stretch the use case of the "i" element (not "em"), though a simple span would probably be the way to go.
You can also use <span class="aside" title="these">parenthetical remarks</span>. Title works on all elements and is actually quite a nice thing to have :)
Another underutilized set is definition list tags. They work well when you want to create a box with paired text and images.
<dl>
<dt>Term</dt>
<dd>Definition or description</dd>
</dl>
I use that one quite a bit. Especially when I think of data that occurs in key/value pairs. The only problem is that I wish that the markup was <dt><dd></dd><dt> so that I the key/value pairs were in their own 'box' that could be styled more intuitively.
From the browser compatibility chart there, I find that ­ would be better for the purpose than <wbr> failing only for Firefox 2 which at this point should be negligible.
Don't use <wbr>, use ­ (soft hyphen). Actually renders with a hyphen attached, letting you know you're reading one broken word, and not just two odd ones (I'm sure this happens, but I can't think of a good example.)
----------------------------------------
It's most unfortunate that you mis-used half of the items in this post.
cite should be used when you're actually _citing_ something from a source, like if you're using a blockquote or q element.
optgroup should contain a set of options, not be closed before the options. Your "live demo" doesn't show any visual difference because of your improper usage.
acronym is used for acronyms. Defining acronym, "a word formed from the initial letters of the several words in the name"… The usage in your example just hurts my brain.
According the HTML specs, address is used to denote the address of the page creator: "The ADDRESS element may be used by authors to supply contact information for a document or a major part of a document such as a form. This element often appears at the beginning or end of a document." See: http://www.w3.org/TR/REC-html40/struct/global.html#h-7.5.6
Pretty sad that you didn't use labels in your fieldset example.
The abbr example is a better example of an acronym. abbr, or Abbreviation is a "shortened form of a word" like ‘management' -> ‘mgmt'.
rel should be used to describe the relationship of the text to the current tag. W3C says, "This attribute describes the relationship from the current document to the anchor specified by the href attribute. The value of this attribute is a space-separated list of link types."
wbr is not in any HTML spec. It is a non-standard tag that was added by Netscape, and later dropped around Netscape 4 or 5.
I'm incredibly disappointed by the inaccuracies that you're giving people who might not know better.