Footnotes for All: One Foot(note) Format for Kindle, iBooks and generic EPUB


At first glance, the iBooks requirements for pop-up footnotes with their unique in-place implementation of the <aside> tag looks like a nightmare for sharing code between ebook types but actually if we read the following note in the iBooks Asset Guide 5.2.7
Use the <aside> element when you want to hide the footnote; use a <div> or <p> element when you want the footnote to appear in the normal reading view. If you use <div> or <p> and a user clicks the footnote link, the content appears in a popup, but the footnote is also visible as part of the text on the page.
the sun breaks through the cloud once more as there comes into sight the opportunity once more for a single EPUB for distribution across all platforms.

The only addition we need to make to the Kindle requirements of a footnote referent formatted thus:
<sup><a href="#fn1" id="r1">[1]</a></sup>
And a footnote entry listed as so:
<p id="fn1"><a href="#r1">1.</a> Footnote text here.</p>
Is to add in the epub:type element to the tags. This results in
<sup><a href="#fn1" id="r1" epub:type="noteref">[1]</a></sup>
and
<p id="fn1" epub:type="footnote"><a href="#r1">1.</a> Footnote text here.</p>

There is one issue here, and that is when the pop-up footnote appears in iBooks the number appears in a large font on its own line at the head and is then repeated in the text.

And while you might consider removing the note number or the hyperlinking of the note referent number, both are actually useful, the first for the identification of note numbers and the second for movement back from the list of notes to the position of the referent: we must not assume that the reader will only want to read notes in the direction of text -> note but also note -> text.

Comments