Piece Footnotes

This shot shows a few recent changes.

First, I designed and built a simple CSS and JS inline footnote popover for pieces on The Manual, based on MultiMarkdown’s footnotes. Content is extracted from the footnotes list at the end of the piece, and links open in new windows so readers don’t lose their places. The little arrow is a simple text arrow with CSS rotation, avoiding an extra asset.

In the full screenshot, three other changes:

1. Footnotes are still collected at the end of a piece, if readers prefer to explore them after reading the piece. But the links in them aren’t colored so as not to distract from the author biography.

2. The author biography is real simple, using the sans face to differentiate from the actual piece content. The author’s name also doubles as a link to their website or Twitter profile, eliminating the need for a list of links or social icons.

3. The address bar shows our new URL structure, which reflects the rethought, simplified organisation of the whole site, divided in /read, /shop, and /about. We think of it as “Read The Manual”, “Shop The Manual”, and “About The Manual”, the three main things readers both new and old should be looking for.