It's All Beta: a basic guide to using Blogsome

It’s always good to learn new things. But to be sure you’re learning the right answers to your questions, it pays to be careful who you ask.

A List Apart offers a lot of articles on a wide range of subjects. Every webmaster should visit it regularly. And that’s exactly what I did a few days ago, when I was looking for some advice about javascript. Not just any old javascript either, but the sort of javascript that will work in most, if not all, browsers, and won’t cause too many accessibility problems.

Aaron Gustafson’s recent [November 2008] article, ‘Progressive Enhancement with JavaScript‘ offered some useful advice:

One of the keys to effectively integrating progressive enhancement is establishing a plan for script management. To do that, you must first become familiar with the concept of “unobtrusive JavaScript.”

Like an obedient student, I went straight to the Wikipedia page in the link above. On arrival, what I noticed was, as on all other Wikipedia pages, a box with the heading ‘Contents’. You can choose to either show or hide this box. A glance at the source code, however, shows how Wikipedia’s coders achieved this piece of javascript magic:

<a href="javascript:toggleToc()" class="internal" id="togglelink">hide</a>

That didn’t look quite right to me. Sure enough, after a brief search, I found myself back at A List Apart reading Jeremy Keith’s article, ‘Behavioral Separation‘, which was published way back in June 2006. And here’s what it says:

Suppose you want to add some behavior to a particular link. You could use what’s known as the javascript: pseudo-protocol: <a href="javascript: doSomething();">click for fun</a> That’s a short-sighted approach. User agents that don’t support JavaScript will choke on that href value.

Oh dear. That ’short-sighted approach’ is what Wikipedia still uses a whole two years after Jeremy Keith wrote those words.

It’s not just Jeremy Keith either. Roger Johansson at 456 Berea Street agrees in his September 2007 piece, ‘How to create an unobtrusive print this page link with JavaScript‘:

First a look at the obtrusive way. Most of the time print links are hardcoded in the HTML, and look something like this: <a href="javascript:window.print()">Print this page</a> [This technique] doesn’t separate content from behaviour. It also uses the fake javascript: protocol. But worst of all, it will confuse people browsing without JavaScript. The link will still be there, but when they click it, nothing happens.

So, to sum up, although Aaron Gustafson linked to Wikipedia in his article on unobtrusive javascript last month, if you really do want to learn about unobtrusive javascript, it is better to do as the Wikipedia says, rather than copy what they do. Maybe it’s time they cleaned up their own code, although one could argue that they’re leaving things a bit late. On the other hand, maybe it’s never too late to ‘go unobtrusive’. Will the Wikipedia see the light? Only time will tell.