Use HTML to Cite Your Sources

The physical act of citing a source within a document can be a pain regardless of the platform. However, HTML offers the <cite> tag to include source information at the point it’s referenced. The cited text appears italicized and when you hover your mouse over the text, the source information appears as a tooltip.

The format for the tag is:

<cite title="source information">referenced text</cite>

Here’s how the tag appears within your HTML:

<cite title="Jennifer, Niederst. Html Pocket Reference. Sebastopol, CA: O'Reilly, 1999. Internet resource.">Jennifer Niederst</cite>

And here’s how it appears on your blog post/web page:

Jennifer Niederst offers the <cite> tag as a simple way to source your blog content.

Notice Jennifer’s name appears in italics.[NOTE: I’ve added the dotted underline in my stylesheet for all tags that offer additional information as a tooltip.] Hover over it and you’ll see the source information for her book. The first thing you notice is the name of the book is not italicized. Unfortunately, you can’t style text within a tooltip. Next you’ll notice I only used “Internet resource”, not the complete link to her book. You can include a URL in your citation text, but it’s not a hyperlink so unless it’s relatively short and easy to remember, it doesn’t serve much purpose. Even without the URL, you have enough information to find the publication with a quick search.

I know this isn’t the end-all, cure-all solution for source citation. BUT. It’s easy to use so you’re more likely to use it. And, for your readers, the source information is right in front of them. They don’t have to lose their place looking for footnotes or endnotes.