

Ask HN: (Foot)notes Done Right? - ggchappell

Summary: What is the best interface for adding notes to a web article/essay? My ideas are below. Can anyone point me to interesting examples?<p>Often, in an article or essay, it is reasonable to add notes at various places in the text: comments that some readers might be interested in, and some will skip. I wondering how these should best be handled, on a modern web page.<p>Historically, these were done with footnotes or endnotes. The web has given us pop-ups and links to separate pages. But all of these have problems.<p>Properties I think notes should have:<p>1. Notes should be easy to find from the point in the text where they are referenced.<p>2. Going to the note and back to the main text should be fast and effortless, so as not to break the reader's train of thought.<p>3. Notes should be visible without explicitly accessing the referencing point in the text.<p>4. Having seen a note, it should be easy to find the place in the main text that refers to it.<p>All the methods mentioned above are not too bad on 1, at least a little iffy on 2 &#38; 3 (pop-ups and links are very bad on 3), and very poor on 4.<p>What do we do about this? My current best idea is side notes with a visible link (a line?) to the place in the text that references them. This line (or whatever) would be very faint normally, and be highlighted (temporarily?) when either the referencing point or the note is selected.<p>But surely other people have given this some thought. Can anyone point me to worthwhile ideas about notes, or examples of good (or innovative) implementations?
======
RiderOfGiraffes
I like side-boxes: <http://www.solipsys.co.uk/HowHighTheMoon.pdf>

Put the main stream of information down the left side, and any additional
notes in boxes down the right.

~~~
ggchappell
That's similar to what I'm thinking of. Note, though, that these are not
really tied to any particular spot in the text, and, if there were such a
spot, it would be tricky to pinpoint exactly (see my #4).

~~~
RiderOfGiraffes
An asterisk in the main text would suffice, if the side-note is appropriately
close. Alternatively, gently color the background of the box and the
background of the text it should be linked to.

~~~
ggchappell
That coloring idea sounds like a nice interface. It also shouldn't be too much
trouble to implement with a bit of JS, so that the colors are chosen
automatically.

