As in all media, when writing on the net it’s useful to be able to reference the sources used for a particular piece of text. Unfortunately HTML (and to some extent browsers) do not provide an adequate means in which to do this. Although tags do exist for direct quotations (using the <q> and <blockquote> tags) there is no equivalent method for referencing less specific forms of information.

While this difference may seem academic it is important that markup accurately records the relationships between documents, both for clarity and verification. In this article I discuss the methods currently available for adding references and suggest improvements where neccessary.

Firstly, a few examples to distinguish between the various forms of quotation and reference.


In a direct quotation we lift text directly from another location and put in our own document, for example: You will find it a very good practice always to verify your references sir.

I would of course be correct. However if I wish to connect this statement to the source which backs it, HTML only offers two options. The statement is not directly quoted from the page and as such it would be incorrect to mark it as such. However connecting this statement to the relevant source using a HTML link provides the reader with no indication of the article-source relationship that exists.


There is a final tag that HTML offers for the purpose of referencing: <cite>. This is suitable for referencing non-specific information, an example of which can be seen from W3C (although the exact meaning of the tag is vague at best).

While this tag is the best fit we have there is one big problem – it isn’t rendered usefully by browsers. Wrapping something in the “cite” tag simply turns it into italics. Source information (i.e. <cite cite=”source”>) is nowhere to be seen, making this tag next to useless.


The obvious solution is to take the <cite> tag and improve it’s rendering capabilities. Just adding the referencing information in a tooltip would be an improvement, but we have something bigger up our sleeves.


Leave a Reply

Please log in using one of these methods to post your comment: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: