Joe Clark points out the bad markup in Technorati’s weighted tag list (I sometimes call them heat maps). ¶
Matt Mullenweg is one of PC World’s Top 50 People on the Web, Inc.com’s 30 under 30, and Business Week’s 25 Most Influential People on the Web. More »
You should follow me on twitter here.
And on Facebook here.
Recent Essays
Projects
- March 2010
- February 2010
- January 2010
- December 2009
- November 2009
- October 2009
- September 2009
- August 2009
- July 2009
- June 2009
- May 2009
- More...

david gouch | January 23rd, 2005 @ 8:58 pm |
And recommends bad markup to take its place.
Joe Clark’s right about the list being an ordered one, but
bigandsmalltags? They don’t add anything semantically.Just classify the
lis and be done with it.Firas | January 24th, 2005 @ 2:12 pm |
David, classifying the li’s and stopping there removes the whole point of the linked post. The point is that since the larger words are not necessarily emphasized (are they?), there should be a way to convey that they are ‘higher ranked’ without misusing <em> or <strong>. And hence <big> and <small> come in service.
These are the edge cases in which semantics becomes meaningless. Unless you can decide exactly what making a word larger in the tag list is actually supposed to mean. Is it more important? Is it stressed? Is it stressed in the way that <em> stresses words in a sentence?
Big and Small mean something that ‘List Item’ doesn’t.
Matt’s title is somewhat misleading, because we’re trying to convey meaning without conveying semantics, at least the not semantics defined in HTML. Why does a blue whale seem more majestic than a school of tuna? It’s not more important, or more ‘emphasized’, but there’s definitely something that’s triggering a sense of comparitive significance. It’s that sort of significance that a larger word in a weighted list conveys: big.
(You can, I suppose, argue that a larger tag emphasized over the surrounding ones. Which leads me to wonder whether <em> should have a ‘rank’ attribute.)
david gouch | January 24th, 2005 @ 2:51 pm |
Firas:
<Big>and<small>mean nothing semantically: they mean<font size="+1">and<font size="-1">. That is no better than the current markup with inline styles on every link.You are right that classifying all the
<li>s doesn’t convey the popularity rating. Really, I had written off even being able to convey that information with markup, but now I think you can if you usetitles.That solves everything.
Joe Clark | January 27th, 2005 @ 5:23 am |
You’re saying that
bigandsmallaren’t semantic? That’s clearly untrue in the context of a visual graphing system like a weighted list.Tantek | February 2nd, 2005 @ 9:31 am |
Joe Clark is right that the markup can be improved. But I came to a slightly different markup conclusion. See http://tantek.com/log/2005/02.html#d02t0800 for details.
Firas | February 2nd, 2005 @ 11:53 am |
Isn’t this list ordered? The tags are in alphabetical order.
dave | February 2nd, 2005 @ 6:01 pm |
I also wonder why the list is not ordered, but perhaps more disturbingly – suggest that the information conveyed in the weighted list by nested em tag solution is soupy at the expense of hiding a relevant piece of data (the popularity itself). I am not disputing the styled presentation but attempting html gymnastics in the name of semantics.
I fail to see how these semantics (so many nests of ems) are of benefit to man or machine and turning off CSS reveals a list with equally emphasized items, the nesting does not reveal the relevant info.
The only solution I see is to properly mark up a table with columns for tag and popularity ,semanticly linking the two pieces of data (and exposing the popularity to client side manipulation- the part that interests me) with the scope of each row. The rows and cells can be displayed inline to create the block of text effect and the weights/size controlled with classes and the display of the numeric value set to none(I would leave it in though and just make it less prominent).
Pingback: firasd.org » Semantics in Markup of Ranked Tag Lists
Firas | February 4th, 2005 @ 12:45 pm |
dave: here’s a demo of what I think you meant.
(I realize that a pingback already showed up, but just wanted to make clear that there’s a CSS example just not discussion.)
david gouch | February 4th, 2005 @ 7:56 pm |
Two comments.
1. It’s an alphabetically ordered list. I wish Clark would explain why his (“the best”) solution uses an unordered list.
2. Nested
emtags!? If we can nestemtags, why do we have thestrongtag?The spec:
EM: indicates emphasis.
STRONG: indicates stronger emphasis.