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.)
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 use titles.
<ol>
<li class="pop-48" title="this is the 48th most popular tag">Bicycles</li>
<li class="pop-2" title="This is the 2nd most popular tag">Cars</li>
</ol>
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).
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.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.)
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.
You’re saying that
bigandsmallaren’t semantic? That’s clearly untrue in the context of a visual graphing system like a weighted list.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.
Isn’t this list ordered? The tags are in alphabetical order.
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).
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.)
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.