Separating presentation from semantics

After all these years, we have finally reached the point where we’ve separated page organization from presentation, and now we’re about to embark on the same mistakes again, but this time with presentation and semantics.

I’ve been following the issues associated with the vocabindex Drupal module, including one where the person submitting the bug stated the vocabindex use of UL was incorrect. We’re supposed to, MXT writes, use definition lists rather than unordered lists for any lists of terms with associated definition.

At first glance, it does seem as if the vocabindex module is using the unordered list incorrectly. After all, look at any of my category pages (such as the one for the Semantic Web)—what you see is a list of “terms” and their associated definitions. An obvious candidate for definitions lists.

Look more closely, though. In my sidebar menu I list the vocabindex terms as links to web page URIs, but there is no definition attached to any item. The description, if one is given, is, instead, added as a title attribute to the item and displayed only when the item has cursor focus. Yet, it’s the same data. Does this mean, then, I’m somehow not properly displaying my menu items? Should I have a huge sidebar, with the item description given underneath?

More importantly, whether I have a given text description for each item is purely optional, some do, some don’t. Yet the items in the list have meaning without any associated description. In fact, each item in the list is really nothing more than a label for a bucket to hold content. I could just as easily use foobarsillyputty as labels, except that I’m trying to use “meaningful” labels in order to enable you all to better find past content.

In the absolutely ancient W3C page where lists are covered a list of ingredients is given as an example of an unordered list:

  • 1 cup sugar
  • 1 cup oil
  • 2 cups flour

However, I don’t see that anyone would have a problem with adding parenthetical information to this list in order to further clarify the items:

  • 1 cup sugar (light brown granulated by C & H)
  • 1 cup oil (canola or corn, but not olive)
  • 2 cups flour (white or mixed white and whole wheat)

This is really nothing more than what the vocabindex is doing with the vocabulary index terms within both the index pages and my sidebar menu: a listing of items and a (parenthetical) description to clarify what that item is. However, it’s only when the description is displayed as a “tooltip” that one sees the item as a clarification phrase, only. When presented in the index pages, it “looks” like a definition list, and so we want to have it marked up this way— mixing up semantics and presentation.

A definition list is assumed to have two pieces of information; the term or phrase and an associated definition. Even when not present, the definition is still assumed to be forthcoming at some point— not having it is the exception, not the rule. An unordered list is just that: a list of items. They can be a list of items to buy at the store, select from in a form, or click on in a web page. There’s no assumption that any additional information is necessary for the item. If there was, Drupal would make this information mandatory rather than optional. The application and associated developers would definitely discourage the use of the items in a tag cloud or other format where only the term is given because the term, by itself, would be meaningless.

Yet we look at how the terms are portrayed in a page like the vocabindex page I linked above, and that’s enough for us to say we should use one form of markup over another because it’s more “semantical”. Further exploration online at other sites who attempt to define the differences between unordered lists and definition lists shows the same thing: if we see two pieces of data, we’re assuming a definition list, because that’s what it looks like—not what it is.

The HTML5 document adds another key element to the discussion of definition lists by stating that definition lists are name-value pairs. From this can we deduce, then, that the name has no meaning without the value. That’s my interpretation: that a definition list is the proper semantic markup only when data is defined within a context of names and associated values, both of which are meaningless without the other. If, however, *HTML5 allows us to list the names without values, or the values without the names, then the HTML5 document is imprecise, and we should just use whatever we want to use— semantics can not be derived from imprecision.

Currently, in Drupal, vocabulary terms are discrete labels, nothing more. Any description is for clarification not definition, and isn’t essential to the meaning of the term. Forget how the vocabindex pages “look”, and focus on what the data means. If we can’t do that, then this whole semantic markup thing is a bit of a farce, really.

*Confirmed: it doesn’t

Blaming the W3C for a proprietary web

I hope my last post on the W3C processes does not come off sounding like I’m jumping on to the “Down with the W3C” bandwagon advocated by others in the web development community. That couldn’t be further from the truth. If anything, I would not be as frustrated if I wasn’t such a big supporter of the W3C and its work. I certainly find the W3C’s effort to be more open than anything put out by Microsoft or Adobe.

In particular, I found Paul Ellis’ A Propriety Web? Blame the W3C to be disingenuous, at best.

He writes:

This may seem like a forgone conclusion to many of you after seeing the W3C’s development timetables, but the real reason Flash and Silverlight exist is because the “open web” people dropped the ball. HTML simply can handle what Flash and Silverlight can do. It has become increasingly stale for modern web development needs.

Here is some perspective, HTML5 has finally added a tag for handling video. Flash 6 came out with video support in 2002! Where is the HTML version of Line Rider? It is in Flash and Silverlight now. If you want to see something really interesting check out Hard Rock Cafe’s memorabilia page (Silverlight 2 required) and tell me if you’ve ever seen something like that with HTML.

The best response to this bit of criticism came in comments to the post, by a person named Paul, who wrote:

SVG had a video tag since at least 2004. But SVG is stalled in its development in large part because a major plugin developer (Adobe) and a major browser developer (Microsoft) are uninterested in it. So the slow evolution of web standards is a result, not a cause, of the big company’s wish to dominate the web.

In fact, there is no chapter in the Bible that says that the only two options are W3C and totally proprietary. If Microsoft were truly frustrated with the W3Cs pace (and not its openness) it could just call up Adobe, Mozilla et. al. and start another standards body. But Microsoft and Adobe do not want to co-operate on Web technologies. They want to compete, and use their dominance of certain other industries as levers that will allow them to define the platform unilaterally.

The man got it in one. The slow progress of the web can be laid exactly at the doorstep of a company like Microsoft, which refuses to implement most standards we’ve had for years in the interest of developing its own proprietary crap. Proprietary crap, I might add, which is competitive with the other proprietary crap being developed by Adobe. Why do something like Silverlight, which is based on XML, when there is something like SVG, also based on XML and implemented in the other browsers? The W3C did not “force” Microsoft to take this route—this is Microsoft doing what it does best: trying to own the technology.

In the meanwhile, the W3C has released specifications such as SVG, CSS, RDF, XHTML, and so on, in addition to ECMA’s work on JavaScript 2.0, all of which could provide all of the functionality we need, and more, and all of it free to use by everyone for everything. Oh, no, how evil. Instead, let’s praise companies for re-implementing all of this functionality in their own little plug-ins and browsers, leaving the rest of us web developers to scramble to learn how to implement their adorable, playful, and proprietary “enhancements” so that the applications work on all browsers and all operating systems.

Blame a proprietary web on the W3C!? In what universe?

I do think the W3C needs to change. I think the recent issue with the SVG interest group shows that the organization is too fixed in a bureaucracy no longer compatible with today’s way of doing business. However, we don’t have to wait on the W3C passing new specs in order to have the web of the future. If all the browser companies implemented all of the specifications that have been released, or are under final consideration, combined with the JavaScript we have today, we could do all that Flash and Silverlight and any of these proprietary technologies do…and more. If Microsoft were to implement these specifications in IE8, and encourage companies to move on from IE6 and IE7. If we didn’t have to depend on Adobe’s plug-in. If tools that generate content actually generate content correctly. If the WaSP returned to actually demanding tool makers adhere to standards, rather than become apologists for companies like Microsoft, and it’s cute little meta tags of the week.

Another commenter to the Ellis post wrote what good does it do for the W3C to push out more specifications when browser companies aren’t implementing the ones that already exist. That’s the key to this issue: the W3C can’t force implementation. Only we can force implementation, by using these specifications and leaving other browsers out in the cold. We’re certainly not going to get an open web if instead of punishing companies who are holding all of us back, we give in, lay on our backs, and think of Silverlight.