Meme Catcher

I just got finished writing a new version of the del.cio.us whuffie bookmarklet. It’s a bookmarklet that adds via: tags to your bookmarks for attribution purposes, so you can have a little extra meta-data about where your links are coming from.

This idea was first expressed in 2007 by Ric Hayman, who also wrote a very nice post about the original via: tag bookmarklet. And a year later, Nicola D’Agostino picked up the meme and sparked another interesting conversation about attribution meta-data in Delicious.

I hope that 2 people will also use and enjoy the new the del.cio.us whuffie bookmarklet.

Lately I have been fielding a lot of questions at work about strategies for assuring that the markup is semantic, accessible and valid. There are a lot of pieces to the puzzle, but the first line of defense is certainly my Firefox extensions.

I recently compiled a short list of Firefox extensions for the Front-End team. Everyone had always been aware of the HTML Validator Extension but hadn’t made a practice of cross-referencing those messages with an accessibility report from the Firefox Accessibility Extension. Putting those two together apparently gives developers a really granular sense of what’s going awry in the code under development. It’s a mini unit test suite right in the tool bar

I’ve also been surprised lately at how many people who use Firebug as a DOM inspector, don’t know about Firebug’s awesome JavaScript debugging capabilities. So overall, making and publishing this list was a surprisingly rewarding bit of evangelism.

Firefox Extensions for Front-End Web Developers

1. Web Developer Toolbar
2. Firebug
3. Firefox Accessibility Extension
4. HTML Validator Extension
5. Operator, for debugging Microformats
6. View Rendered Source Chart - the free version is not yet compatible with ff3 as of 8/14/08
7. Live HTTP Headers supplements the Firebug Net tab for debugging HTTP and HTTPS transactions.
8. Screengrab! is a versatile screen capture tool, essential for submitting bug reports.

You are what you wear
And you wear the scars.
There are no mirrors
In your house of cards.
Your world is decaying
But you don’t understand…
—The Dark

The critical point to remember about Software Systems as Big Balls
of Mud, is that it is not an anti-pattern. The statement that applying top-down practices to software results in a Big Ball of Mud is an affirmation that

1. We always have a working system
2. We are mostly able to satisfy most requirements
3. We are almost always able to satisfy critical requirements

In addition, the points stated above are our benchmark for adopting any new process and its inherent risks. We can (and will)
ask in all seriousness, is this solution more robust than a big ball of mud? Successful advocacy always seems to require
answering this question.

Slides

Here is a presentation of some of the ideas in BBM. It is basically a bunch of quotations from the papers mentioned here and a few others. I had intended to write a paper around the ideas presented here, but later realized running Selenium regressions required me to write down the same ideas, albeit in a more pragmatic language

See also

The Selfish Class, also by Foot & Yoder

Today I wanted to know how to get the functionality of the HTML validator Firefox extension. The extension has two modes: Tidy and SGML parser. Each of these modes reports differently on the HTML under test. Both reports can be useful (I’m not going to get into the differences here).

Specifically, I wanted to be able to generate either a Tidy or an SGML parser report from the command line. And I wanted to be able to run my report for any public Web page.

(more…)

This bookmarklet no longer works. Please use the new whuffie bookmarklet instead. This version of the via: tag bookmarklet broke when Delicious launched their new UI in mid-2008. Congratulations to the Del team on the improved UI, and I hope everyone will enjoy the updated bookmarklets.

Delicious Whuffie is a bookmarklet that, when clicked, adds via:username to the tags field when saving a URL from another user.

This bookmarklet is intended to be used on the “save this” page at del.icio.us. I have also created (and prefer) a version of the bookmarklet that adds the user’s tags along with via:username; as I seem to always do that as well when tagging with via:

(more…)

Closures are a powerful feature of JavaScript. However it’s often hard to explain in a few words, just what is useful about closures. Well, here on page 131 of the Rhino book, is the recipe for a unique ID generator that doesn’t require a global counter.

One thing that I personally enjoy about the Flanagan book is that he says things like “don’t pollute the global namespace.” This technique does not pollute the global namespace.

var uid = (
function(){
var id=0;
return function(){
return id++ ;
};
}
)();
//then just say:
alert(uid());

Generate a unique ID!.

Recently, I started building a site with a lot of transparent image elements. The trouble was the the client required support for IE6 as well as IE7. Now, IE 6 and lower do not support transparent PNGs out of the box, but I knew that there were workarounds for that.

The question was, which workaround to use? One method I saw involved using an Explorer “behavior.” Unfortunately, this solution required loading and HTC file, which is an ActiveX control. ActiveX controls aren’t loaded in IE6 with default security settings. Maybe there is a workaround for that, but I couldn’t find it in a timely fashion. Besides, the HTC solution requires an HTC file and a special GIF file be stored on the server. Adding mysterious stuff to the client’s file tree is something I really like to avoid.

Then I ran across a brand new article (based upon a much older article) at A List Apart: Super-Easy Blendy Backgrounds. This article describes a pure CSS technique of getting image transparency to work in IE 6.
(more…)

This began as a post for the JAG internal wiki. After I’d gone to all the trouble of looking everything up and spelling it right, I thought it would be worthwhile to mirror the post here.

Here are a couple of basic pointers for building Acessible Web sites. I generally am interested in Accessibility, because it’s part of the Semantic Web vision. When I come across a relevant article, I tag it with accessibility. But I became especially interested after the National Federation for the Blind sued Target, basically because Target refused to add ALT tags to their images.

In no particular order, here’s list of core techniques:
(more…)

This began as a post for the JAG internal wiki. But I wound up looking up a lot of good links, so I thought I’d mirror the post here in order to keep those links handy.

When I want to implement a requirement, such as a business rule or DHTML behavior in JavaScript, sometimes I find that I don’t know how to implement that behavior. Sometimes this might be because the requirement is complex, as in the case of DHTML animation. Or the algorithm I am searching for may just be obscure, such as a unique ID generator that uses a closure instead of a global counter.

When I do not immediately know how to implement a requirement, I usually need that information in a hurry. I do not have time to make extensive flow charts, or to research the deep features of JavaScript. What I want is to find someone else who has already implemented something ‘’similar'’ to the requirement. And I want to see their source code.
(more…)

http://encytemedia.com/event-selectors/

Another js library that I’d like to use some time.

"event:Selectors allow you to apply an event such as mouseover, mouseout, click, et al using a CSS style syntax."
(more…)