Footnotes and smelly feet

A Thought…

She got her good looks from her father. He’s a plastic surgeon.

— Groucho Marx

Footnotes and smelly feet

Posted on 2018-Jun-22 at 10:09:10 by Phil
Last updated on 2022-04-07 at 10:05:00 by Phil

Traditional book printing puts a footnote callout in-line and the footnote itself at the bottom of the page (or sometimes at the end of a chapter or even the whole book). This may not be a desirable arrangement for material to be read on a screen. There is an interesting discussion that you may want to read.

Here we will cover an assortment of supplemental text (also images) that is not to appear inline, but should be easily accessible for a reader who is interested in looking at this supplemental material. This includes traditional footnotes (at the bottom, or foot, of a page), endnotes collected at the end of a chapter (or even the entire book), marginal notes appearing as an inset or off in the page margin (possibly carving out a bit of the main text’s space, as needed), screen pop-ups (dialogs) or slide-outs, links to separate pages, and possibly other methods. In all cases, the intent is to have the supplemental material not in line with the main text, but to be marked (and possibly accessed) via an unobtrusive mark or link.

The style of a callout can vary by author, publisher, and type of material (explanatory/elaboration on a point, cross reference to related material, bibliographic/source material, etc.), e.g., * and other symbols; number, possibly in brackets; name/year, again often in brackets). It should be consistent within a given usage, at least, although there is no reason you can’t mix them in a document. Either superscript the callout or put it in brackets [ and ], so it’s not confused with the mainline text. For dynamic links (pop-ups, etc.) it could even be a graphic arrow, although be careful about what will happen when the page is printed. Don’t use symbols for off-page notes, as it’s far easier to remember a number or name than, “was that a single dagger or a double-dagger?” when moving several pages to read the endnotes. Finally, some prefer a vertical list of notes, while others flow them into one paragraph. The latter may take up less space for a multitude of very short notes, but be harder to find the desired note.

Issues

For someone who is visually impaired and possibly using a screen reader or other assistance, can they navigate to the supplemental information, read it, and get back to the main text, without getting lost? Those who are not visually impaired may be mobility impaired (e.g., can’t use a mouse, and rely on the keyboard). Even for those without impairment, scrolling down without links to the end of a web page (or even, a single PDF page) is a nuisance, and even more so, finding your original place in the text upon return.
For material intended to be printed (hard copy), it is OK to put supplemental material down at the bottom of the page on which it is referenced. For material such as a web page, which is normally read on a screen, keep in mind that any of this material may end up being printed. Although there will be no hyperlinks on paper, all supplemental material must be present somewhere in the printout, with easy navigation to find it and return. If your primary method is a pop-up, slide-out, or link to a separate page, make sure your information doesn’t disappear when printed! You may need to have separate “screen” and “print” media CSS controlling the appearance of a web page, such as a link, etc. in the callout for screen display, and a simple number or symbol and the footnote at the end of the page for print.
Some people may choose to download a document and read it offline later. It is very annoying to have supplemental material in a separate HTML file which was not downloaded at the time! Say, you downloaded an article to read on the plane flight across the ocean, only to find that it is lacking all the footnotes because you didn't realize that you needed to download them, too! Others may want to bookmark a footnote, which can be difficult for pop-ups and similar dynamic methods.
Don’t be a slave to older material which handled supplemental content in an inconvenient way (e.g., when digitizing a book). Feel free to bring their footnotes, endnotes, etc. up to modern standards of accessibility and convenience, even if the resulting book won’t print in exactly the same manner as before. Some authors go through great contortions to limit themselves to one footnote per page; feel free to add additional footnotes if needed to clarify matters. For a historic text, you may not want to alter the main text itself to “uncontort” it, but additional footnotes are fine. In any case, don’t get carried away with footnoting and get so many on a page that half the page is taken up with footnotes. 4 double-daggers for a callout is easy to confuse with 3 — if you really must have that many footnotes (such as for a scientific article), numbering and endnotes are probably better.
Although the most common navigation is from the main text callout to the note, and then return, it is quite possible to start at a collection of notes and want to jump back into the main text for an interesting-looking one (e.g., look at the context that the footnote refers to). This means you should not have one-way links from main text to notes, but two-way links. If you normally hide your footnotes (pop-ups, slide-outs, etc.), consider how somehow could see all the footnotes and choose one to go back to the main text!
A footnote to a link to an online document might easily be replaced with a link directly to that document, unless you want to add some verbiage around the link (commentary on the linked-to document, etc.). Keep in mind that links to other documents may eventually decay and break (404 error), so giving a title and additional information in the footnote (and not just a URL in a direct inline link) could keep it still useful as a starting point for an online search.
PDF documents are oriented around paper-sized pages, so conventional footnotes at the bottom of the page are not a terribly inconvenient amount of scrolling, although someone using a screen reader might wonder why the reader said “asterisk” in the middle of a paragraph. Therefore you should consider making footnotes with two-way links, for improved convenience and accessibility. Endnotes on a separate page should have hyperlinks (bookmarks/outlines). Make sure that when someone prints your PDF document that footnotes and endnotes end up looking reasonably like a normal book format.
Some multicolumn layouts put their footnotes across the entire page (a single spanning column), while others put all footnotes at the end of the last column, and still others put their footnotes at the bottom of the column in which they are called out. It’s a matter of style.

There are lots of ways to present supplemental information in a text. Keep in mind convenience, accessibility, and whether it will be usable when printed (or, even read offline). You may be tempted to use a kewl-looking slide-out on your webpage for this material, but is it accessible when printed, or usable with a screen reader?

Posted on 2022-04-07 at 11:05:00 by Phil

When deciding how to handle footnotes and related asides (endnotes, bibliographic entries, etc.), keep in mind how the material is to be presented to the end user: browser-oriented (indefinitely long pages) or page-oriented (PDF or printing), screen or paper output, and perhaps other considerations.

Within the presentation choice, you need to keep in mind different browser or PDF reader capabilities, and more importantly, accessibility for those people with various impairments. If you use HTML/CSS/Javascript features at least a few years old, most any browser out there ought to be able to properly handle them, even Microsoft’s products (which long had a reputation for being well behind and incompatible). Even so, be prepared to get complaints that your page doesn't work on IE6! There are evidently still some of those browsers in use, especially in schools and government offices. At any rate, don’t use the latest and greatest kewl tricks unless you enjoy doing customer support!

Accessibility, particularly to the blind or visually impaired, is something that is often tacked on as an afterthought, if it’s even considered at all. It is easy to write kewl Javascript to do a slide-in aside (used as a footnote), but is someone using a screen reader (voice output) going to even notice that this footnote is available, much less be able to figure out where to click to use it? How about someone who is mobility impaired (e.g., using a mouth-held stick to type) — how do they click on that slide-in? You even need to think about how normal text with footnote callouts will be presented by a screen reader — will the callout itself be clearly separated from the surrounding text and understood to be an optional action?

Footnotes and other optional material are normally being presented as an aside of some sort, that is, not required in-line reading, but additional material that can be skipped over without losing too much understanding. How you present it can vary by the degree of importance. A floating box on the screen (whenever the callout is visible on the screen) demands your attention and would be a compulsory read. A slide-in from the edge is a bit less pushy, as is a link to a conventional-looking footnote, while a static footnote at the bottom of the screen (or at a convenient inter-paragraph point) is the least intrusive. Just keep in mind that a web page could be very long, and it would not be good to force a lot of scrolling to get to it. A link would be called for to get to the footnote, with a return link (or Back button) used to return. Try to minimize the number of different footnote styles you use — just one, if possible.

A page-oriented format, such as PDF, breaks up the material into paper-sized chunks, so conventional (printed book) style footnotes are acceptable. The amount of scrolling needed is typically minimal, as compared to an HTML page, and thus acceptable to users. Even so, PDFs can have internal links (similar to HTML links) which can make footnotes more convenient. Such links should certainly be use for endnotes and any other references that may appear on another page. Note that most PDF readers do not have a “Back” button, so a reverse link at the footnote or endnote will be necessary to get you back to the original text.

Finally, there is the issue of on-screen versus printed handling of footnotes, in whatever format you want to interact with them. Obviously there can be nothing dynamic about a printed format — everything needs to be there, and in a reasonable place. Printed output is also almost always on standard office paper sheets, so placing a footnote at the bottom of the page (on which it is called out) is appropriate. If you know that your material will always be printed for reading, you should simply format it to look good on a page. However, any electronic document is bound to be read at least some of the time on a screen, and whatever you use should work there, too. What you don’t want is a fancy mechanism (e.g., slide-in) that doesn’t print well. Ideally, you want control over separate screen and printed formats so that the information appears cleanly in both versions, whether it's at the bottom of the page for printed (regardless of the source) or some dynamic mechanism.

Posted on 2023-08-24 at 14:58:00 by Phil

When creating documents in PDF, there is yet another way to provide asides and related information. PDF offers annotations, which is a block of text highlighted in some manner (“highlighter” marker, underline, overline, strike-through, etc). Hovering over that text (or clicking on it) will bring up a dialog on the side of the reader, containing the note. Be aware that some (or all) users (readers) will be able to append their own thoughts, in the manner of a blog. Also, annotations generally don’t get printed out when a page is printed.

In HTML and some other text markups, you have the ability to define things such as acronyms, abbreviations, asides, and the like, often viewed by simply mousing over the text. Before using them in a document, be sure to test their accessibility, ease of navigation, and (perhaps most importantly) if and how they get printed out.