Seamlessly Cite Quotes

Use the cite attribute of blockquote tag to enhance presentation

The blockquote tag can take an attribute that specifies the URL source of the quote. Unfortunately, no browser takes advantage of this attribute visually. Jeremy Keith, in his excellent new book, DOM Scripting, shows how to use a bit of advanced coding to seamlessly display the URL source of all quotes in a document. However, Mr. Keith used an approach that was not compatible with IE6. That browser, however decrepit, is still the dominant browser in terms of usage, so I modified his script, still using DOM methods, so that we can take advantage of Mr. Keith's usability enhancement in Internet Explorer.

In addition, I have applied advanced print CSS that compliant browsers can use to further enhance the utility of the blockquote implementation. Try print preview in Firefox to see.

"A writer is always well-advised to keep citation simple, consistent, and sufficiently complete that the original source is retrievable. The principle of retrievability is important. Ask yourself this: If you wanted to retrieve a cited Internet source, what kind of information would you need? Most people would answer this way: I'd need the URL!"

The styles and script are embedded for your convenience. I have commented one line that you can modify if IE5.x compatibility is an issue for you.

« Examples page