Scholarship on the Web.

A footnote is not decoration. In academic writing it is part of the argument: it tells the reader where a claim came from, what the disagreement looks like in the literature, and where the author stands in the conversation. The marker in the body, the number, and the note itself are a single rhetorical move. To break any one of those is to break the move.

What the web defaults broke

The first generation of academic web publishing — roughly 1995 through the mid-2000s — handled citation badly almost without exception. The dominant authoring tools (Word, Acrobat, the early CMS templates) applied a small set of bad behaviors:

• Footnote markers exported as plain text rather than as interactive links to the corresponding note.
• Notes rendered at the bottom of the document, out of view of the paragraph that triggered them.
• In long documents, notes split across separate files entirely — requiring a click, a wait, and a back-button to read each note in context.
• No hover behavior, no preview, no way to glance at the source without losing your place in the prose.
• Loss of fidelity between the screen rendering and any printed version, which mattered for academic citations because readers were going to print the article and read it on paper.

What an academic footnote actually has to do

Reduced to the practical requirements:

1. Locate the note in space close to the paragraph that triggers it. Sidenotes (right margin) handle this best on wide screens; pop-ups handle it on narrow screens; bottom-of-page notes are the worst case for the reader.
2. Preserve the marker as semantic markup, not just visual styling. The marker is a link both ways — from body to note, and from note back to body — and screen readers need to know that.
3. Survive print. The print stylesheet should collapse the apparatus into a conventional bottom-of-page or end-of-section format that academic readers expect.
4. Survive citation. Other authors will cite the article; the URL must be stable, and the note numbering must match what other readers see.

Three working approaches

The other pages in this series implement three approaches to the problem. None is perfect; all are better than the default.

• Superscripted CSS markers — the simplest case, where the marker is rendered with CSS rather than the inline <sup> tag, and the note text lives in the page footer with a same-page anchor link.
• Sidenotes (variant 2) — the Tufte-tradition approach: notes float in the right margin alongside the paragraph that triggers them. The variant-2 implementation handles narrow viewports without collapsing into the body text.
• DHTML pop-up footnotes — note text revealed on hover or click via DHTML, useful for high-density academic prose where every paragraph carries multiple notes. Has known accessibility limitations the page discusses.

Citing this essay

Petrik, Paula. "Scholarship on the Web." archiva.net, accessed n.d. archiva.net/footnote/essay.html.